*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;

}

.hammasi{
    background-color: black;
}

.navbar {
    display: flex;
    height: 87px;
    justify-content: space-between;
    align-items: center;
    padding: 0px 120px;
margin-bottom: 20px;
}

.navb {
    display: flex;
    align-items: center;
}

input {
    border: 1px solid transparent;
    border-image: linear-gradient(86.86deg, #FF0000 5.88%, #0019FF 76.25%)1;
    padding: 6px 100px 6px 10px;
    background-color: black;
    position: relative;
    color: white;
}

.ivv{
    position: absolute;
    top: 35px;
    left: 850px;
    color: gray;
}

.aa {
    border: 2px solid transparent;
    border-image: linear-gradient(180deg, #52FF00 0%, #8B44FF 100%)1;
    background-color: black;
    font-size: 16px;
    color: white;
    padding: 10px 20px;
}



.filex{
    display: flex;
    gap: 60px;
    justify-content: center;
}


.su{
    font-family: "Lato" , sans-serif;
font-size: 36px;
color: white;
}
.fi{
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
.rew{
    color: white;
font-family: "Poppins" , sans-serif;
font-size: 14px;
margin-left: 8px;
}
.in{
font-family: "Poppin" , sans-serif;
font-size: 14px;
color: #00ff66;
margin-left: 32px;
}
.sta{
    font-family: "Poppins" , sans-serif;
font-size: 18px;
color: white;
margin-bottom: 50px;
}


.swit{
    width: 60px;
    background-color: gray;
    border-radius: 100px;
    padding: 4px;
    display: flex;
    justify-content: start;
    border: 0.55px solid #000000;
    padding: 4px;
    cursor: pointer;
}
#checkbox1{
    display: none;
}

#checkbox1:checked ~ .swit{
    justify-content: end;
cursor: pointer;
background: linear-gradient(103deg, #98FF47 0.24%, #00C0EA 86.7%);
}

#checkbox{
    display: none;
}
#checkbox:checked ~ .swit{
justify-content: end;
cursor: pointer;
background: linear-gradient(103deg, #98FF47 0.24%, #00C0EA 86.7%);
}

.bg{
    width: 25.76px;
    height: 25.76px;
    border-radius: 100px;
    background-color: white;
}

a{
    cursor: pointer;
    text-decoration: none;
}

.df{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 700px;
}
.dfd{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}


.gap{
    gap: 30px;
    display: flex;
    align-items: center;
}

.topl{
    font-family: "Lato" , sans-serif;
font-size: 19px;
color: white;
}

.qos{
    display: flex;
    align-items: center;
    justify-content: end;
    margin-right: 65px;
    gap: 20px;
}

.qo{
    display: flex;
    align-items: center;
    gap: 8px;
}

.ol{
    justify-content: center;
    display: flex;
    align-items: center;
    width: 53.3px;
    height: 53.3px;
    border-radius: 14.81px;
    border: 2.22px solid #FFFFFF ; 
    font-family: "Poppins" , sans-serif;
font-size: 40px;
color: white;  
background-color: black;
}


.ni{
    border: 2.22px solid #FFFFFF;
    width: 106.6px;
height: 53.3px;
border-radius: 14.81px;
background-color: black;
font-family: "Poppins" , sans-serif;
font-size: 32.57px;
color: white;
}


.ber{
    width: 282.54px;
height:  53.3px;
padding: 10px 48px 10px 48px;
gap: 10px;
border-radius: 14.81px;
color: white;
font-family: "Poppins" , sans-serif;
font-size: 16px;
color: black;
border: none;
}

.gr{
    display: flex;
    align-items: center;
    gap: 20px;
}


.iv{
    border: 2px solid #DCDCDC;
    background-color: black;
    width: 59.46px;
height: 53px;
padding: 6.46px 0px 0px 0px;
gap: 6.46px;
border-radius: 12.93px ;
color: #DCDCDC;
}



.sss{
    background-color: #1E1E1E;
    width:  100%;
height:197px;
padding: 40px 120px 40px 120px;
gap: 0px;
justify-content: space-between;
display: flex;
margin-top: 126px;
}

.custom{
   margin-bottom: 10px;
font-size: 18px;
color: white;
}

.tes{
    color: #FFFFFF80;
}

.aaaaa{
    padding-right: 50px;
}
.rol{
    color: white;
    margin-left: 135px;
    margin-bottom: 30px;
}

.ima{
    margin-left: 15px;
}