#nive {
    color: red;
}

@media screen and (max-width: 940px) {
    #phone-nav {
        display: block;
    }

    #nav-container {
        display: none !important;
    }
}

/* home-banner  */

@media screen and (max-width:1100px) {
    .banner-text-container {
        left: 15% !important;
    }
}

@media screen and (max-width:1088px) {
    .banner-button {
        margin-bottom: 40px !important;
        margin-top: 25px !important;
    }

    .other-heading {
        margin-bottom: 100px !important;
    }
}

@media screen and (max-width:850px) {
    .banner-button {
        margin-bottom: 10px !important;
        margin-top: 15px !important;
    }

}

@media screen and (max-width:670px) {
    .banner-heading {
        font-size: 30px;
    }

}


@media screen and (max-width:530px) {
    .banner-heading {
        font-size: 20px;
    }

    .banner-button {
        font-size: 15px;
        height: 30px;
        width: 200px;
    }
}

@media screen and (max-width:455px) {
    .banner-heading {
        font-size: 15px;
    }

    .banner-button {
        margin-bottom: 0px;
        margin-top: 5px !important;
        font-size: 10px;
        height: 20px;
        width: 150px;
    }
}

@media screen and (max-width:435px) {
    .banner-heading {
        font-size: 15px;
    }

    .banner-button {
        margin-bottom: 0px !important;
        margin-top: 0px !important;
        font-size: 10px !important;
        height: 18px !important;
        width: 150px;
    }
}

/* home banner end  */


/* other banner  */
@media screen and (max-width:980px) {
    .banner-other-heading {
        margin-bottom: 100px !important;
        font-size: 40px !important;
    }
}

@media screen and (max-width:800px) {

    .banner-other-heading {
        margin-bottom: 50px !important;
        font-size: 30px !important;
    }
}

@media screen and (max-width:590px) {

    .banner-other-heading {
        margin-bottom: 30px !important;
        font-size: 25px !important;

    }
}

@media screen and (max-width:485px) {

    .banner-other-heading {
        margin-bottom: 20px !important;
        font-size: 20px !important;

    }
}

@media screen and (max-width:390px) {

    .banner-other-heading {
        margin-bottom: 15px !important;
        font-size: 15px !important;

    }
}


/* other banner end  */


@media screen and (max-width:332px) {
    .banner-heading {
        font-size: 12px;
    }

}

@media screen and (max-width:950px) {
    .banner-text-container {
        left: 10% !important;
    }

    .pointers {
        font-size: 10px !important;
    }

    .content-container p {
        margin: 15px;
    }
}



@media screen and (max-width:775px) {
    .sub-sub-utgApp-container img {
        width: 300px;
    }

    .utgApp-container h1 {
        font-size: 50px;
    }

}

@media screen and (max-width:580px) {
    .sub-utgApp-container {
        display: inline;
    }

    .utgApp-container h1 {
        font-size: 40px;
    }

}

@media screen and (max-width:870px) {
    .sub-footer-images-container img {
        width: 100px;
    }

}

@media screen and (max-width:670px) {
    .sub-footer-images-container img {
        width: 70px;
    }

    .footer-container {
        display: list-item !important;
    }
    .text-left{
  text-align: left !important;
  margin-top: 30px !important;
}

    .footer-container div p a {
        font-size: 15px;
        line-height: 10px;
    }

    .footer-container div p {
        line-height: 10px;
    }

}

@media screen and (max-width:480px) {
    .sub-footer-images-container img {
        width: 50px;
    }

}

@media screen and (max-width:350px) {
    .sub-footer-images-container img {
        width: 40px;
    }

}


/* top-header */
@media screen and (max-width:1280px) {
    .top-header {
        gap: 870px !important;
    }

}


@media screen and (max-width:1172px) {
    .top-header {
        justify-content: center;
        gap: 770px !important;


    }

}

@media screen and (max-width:1072px) {
    .top-header {
        justify-content: center;
        gap: 670px !important;


    }

}

@media screen and (max-width:968px) {
    .top-header {
        justify-content: center;
        gap: 470px !important;


    }

}

@media screen and (max-width:774px) {
    .top-header {
        justify-content: center;
        gap: 370px !important;


    }

}

@media screen and (max-width:684px) {
    .top-header {
        justify-content: center;
        gap: 170px !important;


    }

}

@media screen and (max-width:478px) {
    .top-header {
        justify-content: space-between;
        /* gap:-25px !important;*/



    }

}

@media screen and (max-width:350px) {
    .top-header {
        /* gap:15px !important;*/
        justify-content: space-between;
        display: inline-block;


    }

}

/* footer  */

@media screen and (max-width:890px) {
    .footer-container {
        display: inline-block;
    }

}


/* araq */
@media screen and (max-width:1000px) {
    .sub-Araq-container {
        grid-template-columns: 200px 200px 200px;
        grid-template-rows: 160px 160px 160px;
    }



}




@media screen and (max-width:730px) {
    .sub-Araq-container {
        grid-template-columns: 200px 200px;
        grid-template-rows: 160px 160px;
    }


}

@media screen and (max-width:470px) {
    .sub-Araq-container {
        grid-template-columns: 200px;
        grid-template-rows: 160px;
    }
}


/* classification */



@media screen and (max-width: 940px) {
    #phone-nav {
        display: block;
    }

    .nav-container {
        display: none !important;
    }
}


@media screen and (max-width:1000px) {
    .sub-classification-container {
        grid-template-columns: 200px 200px 200px;
        grid-template-rows: 160px 160px 160px;
        height: fit-content !important;
    }

    .classification-container {
        height: fit-content !important;
    }

    .sub-Araq-container {
        /*height: fit-content; !important;*/
    }

    .araq-box-container {
        background: red;
        /* height: fit-content; !important;*/
    }

}




@media screen and (max-width:730px) {
    .sub-classification-container {
        grid-template-columns: 200px 200px;
        grid-template-rows: 160px 160px;
        height: fit-content !important;
    }

    .classification-container {
        height: fit-content !important;
        ;
    }

    .araq-box-container input {
        width: 280px !important;
    }

    .araq-box-container {
        /*  height:1100px !important;*/
    }

    .sub-Araq-container {
        /*height:1000px !important;*/
    }


}

@media screen and (max-width:470px) {
    .sub-classification-container {
        grid-template-columns: 200px;
        grid-template-rows: 160px;
        height: fit-content !important;
    }

    .classification-container {
        height: fit-content !important;
    }

    .araq-box-container {
        /* height:2000px !important;*/
    }

    .sub-Araq-container {
        /*height:1900px !important;*/
    }

}


@media screen and (max-width:405px) {
    .classification-container input {
        width: 250px;
    }
}

@media screen and (max-width:365px) {
    .classification-container input {
        width: 200px;
    }

    .classification-container button {
        width: 60px;
    }
}


@media screen and (max-width:1300px) {
    .banner-text-container {
        left: 14 !important;
    }
}

/*table*/
@media screen and (max-width:1030px) {
    .Majoon-container2 table {
        width: 800px !important;
    }

}

@media screen and (max-width:820px) {
    .Majoon-container2 table {
        width: 600px !important;
    }

}

@media screen and (max-width:640px) {
    .Majoon-container2 table {
        width: 300px !important;
        margin-left: 4px !important: margin-right:4px !important:
    }

    .Majoon-container2 {
        margin-left: 4px !important: margin-right:4px !important:
    }

    .Majoon-container4 div {
        font-size: small !important;
        margin-left: 15px;
        width: 300px;
    }

    .Majoon-container2 div {
        font-size: small !important;
        margin-left: 15px;
        width: 300px;
        margin-left: 15px;
    }

}

@media screen and (max-width:440px) {
    .Majoon-container2 table {}

}

@media screen and (max-width:790px) {
    .Majoon-container4 p {
        margin-left: 15px !important;
        margin-right: 15px !important;
        text-align: justify !important;
    }
}