@media screen and (max-width: 500px) {
    body {
        font-size: 12px;
        overflow-x: hidden;
    }

    div.nav {
        width: 100%;
        
    }

    div.nav main.nav-main div.nav-logo {
        width: 100px;
    }

    div.nav main.nav-main div.nav-logo img  {
        object-fit: cover;
    }

    div.nav main.nav-main div.contact span a {
        font-size: 10px;
    }

    /* MAIN HERO CONTNT */

    .content .content-main {
        width: 100%;
        background-color: red;
        flex-direction: column;
    }

    .content .content-main .main-text {
        width: 100%;
        display: flex;
        /* flex-direction: column; */
    }

    .content .content-main .main-text .cta a {
        font-size: 10px;
    }

    .content .content-main .main-text .text {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;

    }

    #nvs ul li a {
        font-size: 10px;
        padding: 0;
        margin-top: 60px;
    }


    #nvs.show {
        height: 210px;
        padding: 5px;
    }

    /* services styling */

    .services {
        padding: 0;
        margin: 0;
    }

    .services .s-links ul{
        padding: 3px;
        gap: 5px;
        flex-wrap: wrap;
        padding-bottom: 10px;
    }

    .svs-container .item {
        width: 100%;
    }
    
    .svs-container  {
        padding: 10px;
        gap: 20px;
    }

    .svs-container .item .item-info p.name {
        font-size: 15px;
    }

    .svs-container .item .item-info p.cta a {
        font-size: 15px;
        text-align: center;
    }

    .svs-container .item .item-info p.cta {
        width: 120px;
    }

    /* PRINCIPLES STYLINl */

    div.principles {
        margin-top: 20px;
    }

    div.principles .core-hdr {
        width: 100%;
        padding: 20px;
    }

     div.principles .hdr-ctr .core-hdr h1 {
        font-size: 30px;
     }

     div.principles .hdr-ctr .core-hdr p {
        font-size: 15px;
        text-align: justify;
     }

     div.values .v-hdr  {
        width: 100%;
        padding: 20px;
     }

     div.values ul  {
        width: 100%;
        padding: 0 20px;
     }

     /* OUR TEAM STYLING */

      .tm {
        margin-bottom: 0;
      }

     .tm .tm-ctr .tm-hdr  {
        width: 100%;
     }

     .tm .tm-ctr .tm-hdr p {
        width: 100%;
        gap: 10px;
        padding: 10px;
     }

     .tm .tm-ctr .tm-srch {
        width: 100%;
        padding: 20px;
     }

     .tm .tm-ctr .tm-srch h3 {
        font-size: 20px;
     }

     .tm .tm-ctr .tm-srch label {
        width: 100%;
     }

     .tm .tm-ctr .tm-srch label select {
        padding: 10px;
     }

     .tm .tm-ctr .tm-mbrs {
        width: 100%;
        display: flex;
     }

     .tm .tm-ctr .tm-mbrs span {
        width: 100%;
     }

     .tm .tm-ctr .tm-mbrs span img {
        height: 80%;
     }

     /* CONTACT US STYLING */

     div.ct-us {
        margin-top: 0px;
     }

     /* .ct-us .ct-us-ctr .ct-banner, .ct-us .ct-us-ctr .ct-white {
        height: 300px;
     } */

     .ct-us .ct-us-ctr .my-frm  {
        top: 20%;
        transform: translateY(20%);
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr {
        width: 100%;
        gap: 10px;
        padding: 0px;
        justify-content: top;
        flex-direction: column;
        align-items: start;
        justify-content: start;
        
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc  {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-direction: row;
        width: 100%;
        gap: 20px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc .frm-lctn  {
        width: 150px;
        gap: 5px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc .social{
        width: 100px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc .social ul {
        flex-direction: column;
        width: 100px;
        gap: 10px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc .social ul li a {
        width: 100%;
        padding: 5px;
        text-align: right;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm-ctr-dsc .frm-nmbr {
        gap: 13px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm  {
        width: 100%;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container .nm-email {
        width: 100%;
        display: flex;
        justify-content: space-between;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container .nm-email input {
        width: 200px;
        padding: 10px;
        font-size: 12px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container {
        gap: 10px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm {
        display: flex;
        flex-direction: column;
        gap: 10px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container input[type = "email"] {
        width: 100%;
        padding: 10px;
        font-size: 12px;
     }
     
     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container textarea {
        width: 100%;
        padding: 10px;
        font-size: 12px;
     }

     .ct-us .ct-us-ctr .my-frm .my-frm-ctr .frm .form-container input[type = "submit"] {
        width: 100%;
        padding: 10px;
        font-size: 12px;
     }

     /* SERVICES STYLING */

     .products#svs {
        margin-bottom: 20px;
        height: auto;
     }

     .products#svs #svs-container {
        width: 100%;
        padding: 10px;
        box-shadow: none;
     }

     .products#svs #svs-container #pdt_wrapper {
        width: 100%;
        padding: 10px;
        box-shadow: none;
     }

     .products#svs #svs-container #pdt_wrapper .pdt_input  {
        width: 100%;
        padding: 0px;
        gap: 10px;
        margin-top: 0px;
        padding: 10px;
     }

     .products#svs #svs-container #pdt_wrapper .pdt_input span.arr {
        width: 30px;
        padding: 0px;
        height: 30px;
     }

     .products#svs #svs-container #pdt_wrapper .pdt_input div#prd_srch button  {
        width: 50px;
     }

     .products#svs #svs-container #pdt_wrapper .pdts {
        width: 100%;
        padding: 10px;
        gap: 10px;
     }

     .products#svs #svs-container #pdt_wrapper .pdts .itm {
        width: 100%;
        padding: 10px;
     }

     .products#svs #svs-container #pdt_wrapper .pdts .itm .blt {
        width: 15px;
        height: 15px;
     }

     /* FOOTER STYLING */

     div.ftr {
        padding: 5px;
     }

     div.ftr .ftr-ctr {
        width: 100%;
        padding: 5px;
     }

     div.ftr .ftr-ctr .ftr-ql {
        flex-direction: column;
     }

     div.ftr .ftr-ctr .ftr-ql .quick-links, div.ftr .ftr-ctr .ftr-ql .cstr-care, div.ftr .ftr-ctr div.connect, div.ftr .ftr-ctr .ftr-ql .newsletter{
        width: 100%;
        padding: 5px;
     }

     div.ftr .ftr-ctr .ftr-ql .newsletter .news-sgu {
        /* background-color: red; */
        display: flex;
        justify-content: left;
        align-items: left;
        gap: 10px;
     }

     div.ftr .ftr-ctr .ftr-ql .newsletter .news-sgu button {
        width: 170px;
     }

     div.ftr .ftr-ctr .ftr-cr {
        width: 100%;
     }


}