@media only screen and (max-width: 479px){
    h1{
        font-size: 35px;
    }
    .m-content{
        flex-direction: column;
    }
    .about-left:before{
        display: none;
    }
    .about-left:after{
        display: none;
    }
    .about-left img{
        animation: none !important;
    }
    .w-th{
        width: 50% !important;
    }
    canvas#webgl{
        width: 100% !important;
    }
    .about-right{
        padding-left: 0 !important;
    }
    .about-right2{
        padding-right: 0 !important;
    }
    .spr{
        flex-direction: column-reverse;
    }
    .key-features .owl-next{
        display: block !important;
        top: -33px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .key-features .owl-prev{
        display: block !important;
        top: -33px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .services-area-three .owl-next{
        display: block !important;
        top: -27px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .services-area-three .owl-prev{
        display: block !important;
        top: -27px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .sln{
        margin: 30px 0;
    }

}
@media only screen and (max-width: 992px){
    
    .milestone-margin, .milestone-margin1, .milestone-margin2, .milestone-margin3, .milestone-margin4, .milestone-margin5, .milestone-margin6 {
        margin-top: 0 !important;
    }

}
/* @media only screen and (max-width: 991px){
    
    li.navbar-dropdown:before {
        position: absolute;
        right: 30px;
        top: 12px;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f078";
        font-size: 15px;
        color: #ffffff;
    }

} */

@media only screen and (min-width: 480px) and (max-width: 575px){
    h1{
        font-size: 35px;
    }
    .about-left:before{
        display: none;
    }
    .about-left:after{
        display: none;
    }
    .about-left img{
        animation: none !important;
    }
    .w-th{
        width: 50% !important;
    }
    canvas#webgl{
        width: 100% !important;
    }
    .card-wrap{
        height: 300px !important;
    }
    .key-features1 .card-wrap {
        height: 230px !important;
    }
    .about-right{
        padding-left: 0 !important;
    }
    .about-right2{
        padding-right: 0 !important;
    }
    .spr{
        flex-direction: column-reverse;
    }
    .key-features .owl-next{
        display: block !important;
        top: -33px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .key-features .owl-prev{
        display: block !important;
        top: -33px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .services-area-three .owl-next{
        display: block !important;
        top: -27px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .services-area-three .owl-prev{
        display: block !important;
        top: -27px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .sln{
        margin: 30px 0;
    }
    
}
@media only screen and (min-width: 576px) and (max-width: 767px){
    h1{
        font-size: 35px;
    }
    .about-left:before{
        display: none;
    }
    .about-left:after{
        display: none;
    }
    .about-left img{
        animation: none !important;
    }
    canvas#webgl{
        width: 100% !important;
    }
    .card-wrap{
        height: 265px !important;
    }
    .key-features1 .card-wrap {
        height: 210px !important;
    }
    .about-right{
        padding-left: 0 !important;
    }
    .about-right2{
        padding-right: 0 !important;
    }
    .spr{
        flex-direction: column-reverse;
    }
    .key-features .owl-next{
        display: block !important;
        top: -33px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .key-features .owl-prev{
        display: block !important;
        top: -33px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .services-area-three .owl-next{
        display: block !important;
        top: -27px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .services-area-three .owl-prev{
        display: block !important;
        top: -27px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .sln{
        margin: 30px 0;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px){
    h1{
        font-size: 35px;
    }
    .header-top-wrap{
        display: none;
    }
    .about-left:before{
        display: none;
    }
    .about-left:after{
        display: none;
    }
    .about-left img{
        animation: none !important;
    }
    .card-wrap{
        height: 285px !important;
    }
    .key-features1 .card-wrap {
        height: 230px !important;
    }
    .about-right{
        padding-left: 0 !important;
    }
    .about-right2{
        padding-right: 0 !important;
    }
    .spr{
        flex-direction: column-reverse;
    }
    .key-features .owl-next{
        display: block !important;
        top: -33px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .key-features .owl-prev{
        display: block !important;
        top: -33px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .services-area-three .owl-next{
        display: block !important;
        top: -50px;
        right: 25px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 20px !important;
    }
    .services-area-three .owl-prev{
        display: block !important;
        top: -50px;
        right: 72px;
        position: absolute;
        transform: translateY(-50%);
        color: #fff;
        font-size: 40px !important;
        background: #FF8F26 !important;
        border-radius: 50% !important;
        width: 35px;
        height: 35px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        font-size: 17px !important;
    }
    .sln{
        margin: 30px 0;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1024px){
    /* .main-header.white-menu .top-right ul:before{
        width: 100% !important;
        left: 28px !important;
    } */
    .about-left:after {
        position: absolute;
        content: "";
        bottom: 36px !important;
        right: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-two 5s infinite linear;
        animation: a-two 5s infinite linear;
        background-color: #222222;
    }
    .about-left:before {
        position: absolute;
        content: "";
        top: 36px !important;
        left: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-one 5s infinite linear;
        animation: a-one 5s infinite linear;
        background-color: #ff8f26;
    }
    .card-wrap{
        height: 300px !important;
    }
    .key-features1 .card-wrap {
        height: 240px !important;
    }
    
}
@media only screen and (min-width: 1025px) and (max-width: 1057px){
    /* .main-header.white-menu .top-right ul:before{
        width: 100% !important;
        left: 44px !important;
    } */
    .about-left:after {
        position: absolute;
        content: "";
        bottom: 36px !important;
        right: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-two 5s infinite linear;
        animation: a-two 5s infinite linear;
        background-color: #222222;
    }
    .about-left:before {
        position: absolute;
        content: "";
        top: 36px !important;
        left: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-one 5s infinite linear;
        animation: a-one 5s infinite linear;
        background-color: #ff8f26;
    }
    .card-wrap{
        height: 280px !important;
    }
    .key-features1 .card-wrap {
        height: 240px !important;
    }
    
}
@media only screen and (min-width: 1058px) and (max-width: 1107px){
    /* .main-header.white-menu .top-right ul:before{
        width: 100% !important;
        left: 65px !important;
    } */
    .about-left:after {
        position: absolute;
        content: "";
        bottom: 36px !important;
        right: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-two 5s infinite linear;
        animation: a-two 5s infinite linear;
        background-color: #222222;
    }
    .about-left:before {
        position: absolute;
        content: "";
        top: 36px !important;
        left: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-one 5s infinite linear;
        animation: a-one 5s infinite linear;
        background-color: #ff8f26;
    }
    .card-wrap{
        height: 280px !important;
    }
    .key-features1 .card-wrap {
        height: 240px !important;
    }
}
@media only screen and (min-width: 1108px) and (max-width: 1157px){
    /* .main-header.white-menu .top-right ul:before{
        width: 100% !important;
        left: 87px !important;
    } */
    .about-left:after {
        position: absolute;
        content: "";
        bottom: 36px !important;
        right: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-two 5s infinite linear;
        animation: a-two 5s infinite linear;
        background-color: #222222;
    }
    .about-left:before {
        position: absolute;
        content: "";
        top: 36px !important;
        left: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-one 5s infinite linear;
        animation: a-one 5s infinite linear;
        background-color: #ff8f26;
    }
    .card-wrap{
        height: 280px !important;
    }
    .key-features1 .card-wrap {
        height: 240px !important;
    }
    
}
@media only screen and (min-width: 1158px) and (max-width: 1199px){
    /* .main-header.white-menu .top-right ul:before{
        width: 100% !important;
        left: 110px !important;
    } */
    .about-left:after {
        position: absolute;
        content: "";
        bottom: 36px !important;
        right: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-two 5s infinite linear;
        animation: a-two 5s infinite linear;
        background-color: #222222;
    }
    .about-left:before {
        position: absolute;
        content: "";
        top: 36px !important;
        left: 52px !important;
        width: 363px !important;
        height: 276px !important;
        border-radius: 10px;
        z-index: -1;
        -webkit-animation: a-one 5s infinite linear;
        animation: a-one 5s infinite linear;
        background-color: #ff8f26;
    }
    .card-wrap{
        height: 280px !important;
    }
    .key-features1 .card-wrap {
        height: 240px !important;
    }
}
@media only screen and (min-width: 1200px) and (max-width: 1207px){
    /* .main-header.white-menu .top-right ul:before{
        width: 64vh !important;
        left: -32px !important;
    } */
    
}
@media only screen and (min-width: 1208px) and (max-width: 1257px){
    /* .main-header.white-menu .top-right ul:before{
        width: 60vh !important;
        left: -15px !important;
    } */
}
@media only screen and (min-width: 1258px) and (max-width: 1306px){
    /* .main-header.white-menu .top-right ul:before{
        width: 62vh !important;
        left: -68px !important;
    } */
}
@media only screen and (min-width: 1307px) and (max-width: 1356px){
    /* .main-header.white-menu .top-right ul:before{
        width: 58vh !important;
        left: -80px !important;
    } */
}
@media only screen and (min-width: 1357px) and (max-width: 1399px){
    /* .main-header.white-menu .top-right ul:before{
        width: 57vh !important;
        left: -59px !important;
    } */
}
@media only screen and (min-width: 1400px) and (max-width: 1440px){
    /* .main-header.white-menu .top-right ul:before{
        width: 58vh !important;
        left: -72px !important;
    } */
}