body {
    margin: 0px;
}

.di1 {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.p1 {
    color: #AFACC9;
}

.p2 {
    font-size: 20px;
}

.p3 {
    color: #AFACC9;
}

.p4 {
    color: blue;
}

.di2 {
    width: 100%;
    height: 600px;
    background-color: #E1DEFC;
}

.di3 {
    display: flex;
    margin-left: 190px;
}

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

.in1 {
    width: 150px;
    height: 30px;
    border-top-right-radius: 50px;
    border: none;
}

.p5 {
    border-bottom-left-radius: 50px;
    background-color: blue;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
}

.im1 {
    margin-left: 100px;
    margin-top: 80px;
}

.di5 {
    margin-top: 80px;
}

.di6 {
    display: grid;
    grid-template-columns: 300px 300px 300px 300px;
    grid-template-rows: 50px 50px 50px 50px;
    justify-content: space-evenly;
    background-color: #E8E5FB;
    margin-bottom: 0px;

}

.di7 {
    border-radius: 10px;
    align-items: center;
    display: flex;
    background-color: white;

}

.p6 {
    color: #6D698C;
    margin-left: 50px;
}

.im2 {
    margin-left: 10px;
}

h1 {
    text-align: center;
    padding-top: 50px;
}

.di8 {
    display: flex;
    gap: 100px;
}

.di9 {
    width: 100%;
    height: 200vh;
    background-color: #E8E5FB;
    margin-top: 0px;
}

.p7 {
    margin-top: 100px;
    color: #2D2D2D;
    font-size: 20px;
}

.di10 {
    display: flex;
    gap: 50px;
}

.p8 {
    background-color: white;
    padding: 20px;
    font-size: 20px;
    color: #6D698C;
    border-radius: 10px;
}

.p9 {
    text-align: center;
    font-size: 25px;
}

.ds {
    padding-top: 100px;
}

.di11 {
    display: flex;
    align-items: center;
    margin-top: 50px;
    justify-content: space-around;
}

.p10 {
    text-align: center;
    color: #6D698C;
}

.di12 {
    display: flex;
    margin-left: 150px;
    gap: 50px;
}

.di13 {
    display: flex;
    gap: 30px;
    margin-top: 50px;
}

.p11 {
    color: #2D2D2D;
}

.p12 {
    color: black;
}

.p13 {
    font-size: 20px;
    margin-top: 100px;
}

.im5 {
    width: 600px;
    height: 550px;
    margin-top: 80px;
}

.di14 {
    width: 100%;
    height: 450px;
    background-color: #7967FF;
}

.di15 {
    display: flex;
    margin-left: 100px;
    padding-top: 50px;
    gap: 200px;
}

.p14 {
    color: white;
    font-size: 30px;
}

.p15 {
    color: white;
}

.la1 {
    color: white;
}

.in5 {
    padding: 10px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border: none;

}

.di16 {
    display: flex;
    gap: 10px;
}

.in6 {
    padding: 10px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border: none;
    background-color: #2DBC7C;
    color: white;
}

.im6 {
    width: 400px;
    height: 400px;
}

.p16 {
    text-align: center;
    margin-top: 50px;
}

.di17 {
    display: grid;
    grid-template-columns: 250px 250px 250px 250px;
    grid-template-rows: 300px;
    gap: 30px;
    justify-content: space-evenly;
    margin-top: 80px;
}

.di18 {
    border-radius: 10px;
    background-color: white;
}

.im7 {
    margin-left: 90px;
    margin-top: 20px;
}

.p17 {
    text-align: center;
    font-size: 18px;
}

.di19 {
    width: 100%;
    height: 100vh;
    background-color: #EAE7FF;
}

.p18 {
    text-align: center;
    padding: 10px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border: none;
    background-color: #EF584E;
    color: white;
    margin-right: 600px;
    margin-left: 600px;
}

.di20 {
    width: 100%;
    height: 600px;
    background-color: #EAE7FF;
    border-radius: 30px;
    border-bottom-right-radius: 200px;
}

.di21 {
    display: flex;
    gap: 200px;
}
.d21 h1{
    margin-top: 400px;
}

.im8 {
    padding-top: 20px;
    margin-left: 200px;
}

.p19 {
    font-size: 20px;
}

.p20 {
    padding: 10px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border: none;
    background-color: #5B45FF;
    color: white;
    margin-right: 300px;
    text-align: center;
}

.di22 {
    background-color: #EAE7FF;
    width: 100%;
    height: 830px;
}

.di23 {
    display: flex;
    justify-content: space-evenly;
    gap: 50px;
    padding-top: 90px;
}

.di24 {
    display: flex;
}

.di25 {
    background-color: white;
    padding: 50px;
}

.im9 {
    margin-left: 100px;
}

.p22 {
    margin-left: 20px;
}

.p23 {
    text-align: center;
}

.di26 {
    width: 100%;
    height: auto;
    background-color: #EF6A62;
}

.di27 {
    display: flex;
}

.p24 {
    font-size: 40px;
    color: white;
}

.p25 {
    font-size: 20px;
    color: white;
}

.di28 {
    margin-left: 200px;
}

.di29 {
    display: flex;
    gap: 40px;
}

.innn {
    border-radius: 50px 10px 50px 10px;
    padding: 10px;
    border: none;
    outline: none;
}

.ddd {
    color: white;
}

.rrr {
    color: white;
}

.drr {
    border-radius: 50px 10px 50px 10px;
    padding: 10px;
    background-color: #FFCF3C;
    text-align: center;
}

.di30 {
    width: 100%;
    height: 80px;
    background-color: #6D698C;
}

.di31 {
    display: flex;
    text-align: center;
    gap: 10px;
}

.pp1 {
    margin-left: 50px;
}

.iii {
    margin-left: 80px;
}

.di31 img {
    margin-top: 10px;
}

.meni {
    display: none;
}

.www {
    display: none;
}

@media(max-width: 510px) {
    .ddd {
        display: none;
    }

    .meni {
        display: inline;
        background-color: #FFCF3C;
        border-radius: 10px 30px 10px 10px;
        padding: 5px;

    }

    .www {
        display: inline;
        background-color: #2DBC7C;
        border-radius: 10px 30px 10px 10px;
        padding: 5px;
    }

    .di1 p {
        display: none;
    }

    .asas {
        text-align: center;
        margin: 0 auto;
        font-size: 30px;
        padding: 0px;
    }

    .di5 {
        margin: 0 auto;
        text-align: center;
    }

    .di2 {
        margin: 0 auto;
        flex-direction: column;
    }

    .di3 {
        margin: 0 auto;
        text-align: center;
    }

    .im1 {
        position: absolute;
        top: 330px;
        width: 90%;
        left: -50px;
    }

    .in1 {
        width: 90%;
    }

    .di4 {
        flex-direction: column;
    }

    .p5 {
        width: 90%;
    }

    .di6 {
        flex-direction: column;
    }

    .di7 {
        width: 90%;
        flex-direction: column;
    }

    .di6 {
        grid-template-columns: 300px;
        gap: 20px;
        grid-template-rows: 100px 100px 100px 100px;
    }

    .di9 {
        flex-direction: column;
    }

    .di8 {
        flex-direction: column;
    }

    .di10 {
        flex-direction: column;
    }

    .di8 img {
        width: 90%;
    }

    /* .vb {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        justify-items: center;
        margin-top: 30px;
    } */
    .di11 {
        flex-direction: column;
    }
    .di9 {
        height: auto;
        margin:0px;
    }
    .di12{
flex-direction: column;
padding-left: 0px;
margin-left: 0px;
    }
    .di13{
        flex-wrap: wrap;
        margin: 0px;
        display: flex;
    }
    .di13 img{
width: 20%;
    }
    .i5{
margin-left: -130px;
        padding-left: -250px;
        width: 20%;
    }
.di9 .im5{
   margin-left: -170px; 
}
.p14{
    width: 90%;
}
.di15{
    flex-direction: column;
    margin-left: 0px;
}
.im6{
display: none;
}
.ff{
    flex-direction: column;
}
.di16{
    flex-direction: column;
}
.in5{
    width: 90%;
}
.in6{
    width: 90%;
}
.di17{
 display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: 90%;
    gap: 100px;
    height: auto;
}
.im8{
    display: none;
}

.di22{
    height: auto;
}
.di26{
    height: auto;
}
.di31 p{
    display: none;
}
.das{
    display: none   ;
}
.di20{
    height: auto;
}
.di30{
    height: auto;
}
.im6{
    height: auto;
}






}