@media only screen and (min-width:768px) and (max-width:990px) {
        .menu_bar {
            justify-content: center; 
            padding: 10px; 
            height: 85px;
        }
    
        .menu_bar ul {
            padding-left: 0;
            text-align: center;
            flex-direction: column;
        }
    
        .menu_bar ul li {
            padding: 2px 4px; 
        }
        .menu_bar .phone {
            margin-right: 22px;
        }
        .c6 {
            padding-left: 0;
        }
        .menu_bar ul a:nth-child(2){
            margin-right: 1px;
        }
        .logo {
            position: absolute;
            top: 30px;
            left: 30px;
    
        }
        .navbar ul {
            float: none; 
            margin: 10px 0; 
        }
        .navbar ul li {
            display: block;
            margin: 5px 0;
        }
        .nav-links {
            flex-direction: column;
            width: 100%;
            height: 100vh;
            justify-content: center;
            background-color: aqua;
            margin-top: -900px;
        }
        .nav-links li {
            margin: 30px auto;
        }
        .social {
            display: flex;
            margin-left: 0px;
        }
        
        .navbar ul li:hover ul {
            display: none; 
        }
        .navbar ul li:hover > ul {
            display: block; 
        }
        .navbar ul li ul li {
            width: 198px;
            border-top: 2px solid white;
        }
        .navbar ul li ul li ul {
            left: 80%; 
            top: 10%;
        }
        .navbar ul li ul li a {
            margin-top: -18px;
            margin-left: 3px;
        }
        .tr{
            margin-top: rem;
            margin-left: 0;
        }
        .sub-menu li{
            margin-left: -1rem !important;
        }
        
        .navbar ul li a:hover {
            background-color: rgb(0, 76, 152);
            color: whitesmoke;
            border-radius: 6px;
        }
    

    
        /* index */
        .body {
            padding-top: 15px;
        }
        
        .marquee h3:after {
            content: '';
            position: absolute;
            background-color: #161923;
            height: 1%;
            width: 30%;
            margin-top: 35px;
            margin-left: -110px;
        }
    
        .body .home-img {
            width: 100%;
        }
    
        /* footer */
        footer {
            margin: 0;
        }
        footer .row { 
            text-align: start; 
            margin-top: 70px;
            margin-left: 5px;
        }
        footer img {
            margin-top: -10px;
        }
        .in {
            margin-left: -20px;
        }
        .f9 {
            margin-left: 10px;
        }
        .our {
            margin-left: -28px;
        }
        /* About us */
        .content{
            height: 10vh;
            width: 100vw;
            display: flex;
            flex-direction: row;
            align-items: end;
            background-image: url(/images/About\ us_page_img.jpg);
            background-size: 550px;
            margin-bottom: -90px;
        }
    
        .content a{
            color: white;
            margin-left: 41px;
            font-size: 17px;
            margin-bottom: 12px;
            text-decoration: none;
            background-position: bottom;
            align-items: flex-start;   
         }
         .content a:nth-child(2){
             margin-left: 2px;
         }
    
         .accordion{
            padding-top: 100px !important;
        }
        .accordion img {
            width: 150%;
            margin-top: 10px;
            margin-left: -50px;
        }
        .career {
            margin-top: 5px;
        }
    
        /* Clients */
    
        .clients {
            margin-top: 100px;
            display: flex;
            flex-direction: column-reverse;
        }
        .clients img {
            width: 100px;
        }
    
    
         /* Careers */
         .c2{
            height: 10vh;
            width: 100vw;
            display: flex;
            flex-direction: row;
            align-items: end;
            background-image: url(/images/Careerspage_img.jpg);
            background-size: 550px;
            margin-bottom: -90px;
        }
        .c2 a{
           color: white;
           margin-left: 50px;
           font-size: 20px;
           margin-bottom: 10px;
           text-decoration: none;
           background-position: bottom;
           align-items: flex-start;   
        }
        .c2 a:nth-child(2){
            margin-left: 2px;
        }
    
    
    
    
        /*Telecom fiber*/
        .c3{
            height: 10vh;
            width: 100vw;
            display: flex;
            flex-direction: row;
            align-items: end;
            background-image: url(/images/services_img.png);
            background-size: 550px;
            margin-bottom: 2px;
        }
        .c3 a{
           color: white;
           margin-left: 10px;
           font-size: 16px;
           margin-bottom: 5px;
           text-decoration: none;
           background-position: bottom;
           align-items: flex-start;   
        }
        .c3 a:nth-child(2){
            margin-left: 2px;
        }
        .c3 a:nth-child(3){
            margin-left: 2px;
        }
        .c3 a:nth-child(4){
            margin-left: 2px;
        }
        section{
            padding-left: 40px;
            padding-bottom: 12px;
        }
        section h2{
            padding-bottom: 20px;
        }
        section .container{
            background-color: #333;
        }
        .lg {
            margin-top: 10px;
        }
        .box{
            width: 300px;
            display: inline-block;
            padding: 20px;
            margin-right: 100px;
            margin-bottom: 17px;
            margin-top: 10px;
            background-color: rgba(o,o,o,1);
            text-align: center; 
            border-style: solid ;
            border-color: rgb(168, 198, 228);
        }
        .box:hover{
            background-color: rgb(0, 76, 152);
            color: whitesmoke;
        }
        .box h5:nth-child(6){
            margin-left: 2px;
        }
        .box h6{
            font-size: 18px;
            text-align: center;
        }
    
        .c4{
            height: 10vh;
            width: 100vw;
            display: flex;
            flex-direction: row;
            align-items: end;
            background-image: url(/images/services_img.png);
            background-size: 550px;
            margin-bottom: 10px;
        }
        .c4 a{
           color: white;
           margin-left: 10px;
           font-size: 14px;
           margin-bottom: 5px;
           text-decoration: none;
           background-position: bottom;
           align-items: flex-start;   
        }
        .c4 a:nth-child(2){
            margin-left: 2px;
        }
        .c4 a:nth-child(3){
            margin-left: 2px;
        }
        .c4 a:nth-child(4){
            margin-left: 2px;
        }
        .section-block{
            padding-top: 20px;
        }
        .body .home-img{
            width: 100%;
        }
        .img1 img {
            width: 180%;
        }
        .img2 img {
            width: 250%;
        }
        .Outside {
            margin-top: 10px;
        }
        .Plant h2 {
            margin-top: 2px;
            margin-bottom: 20px;
        }
        .Outside img {
            width: 160%;
            margin-top: 110px;
        }
        .box-5 {
            width: 121px;
            display: inline-block;
            padding: 20px;
            margin-right: 110px;
            margin-bottom: 50px;
            margin-top: -25px;
            background-color: rgba(o,o,o,1);
            text-align: center; 
            border-radius: 8px;
            border-style: solid ;
            border-color: rgb(168, 198, 228);
        }
        .box-5:hover{
            background-color: rgb(0, 76, 152);
            color: whitesmoke;
        }
        .box-4:hover{
            background-color: rgb(0, 76, 152);
            color: whitesmoke;
        }
        .box-3:hover{
            background-color: rgb(0, 76, 152);
            color: whitesmoke;
        }
        .system img {
            width: 260%;
            margin-left: -60px;
        }
        .box-2 {
            width: 160px;
            display: inline-block;
            margin-right: 110px;
            margin-bottom: 50px;
            margin-top: -25px;
            background-color: rgba(o,o,o,1);
            text-align: center; 
            border-radius: 8px;
            border-style: solid ;
            border-color: rgb(168, 198, 228);
            
        }

        .pon {
            padding: 10px;
            margin-left: -50px;
    
        }

        .design{
            padding: 10px;
            margin-left: 10px;
        }


        .hybrid {
            padding: 15px;
            margin-left: 70px;
        }

        .copper{
            padding: 15px;
            margin-left: -50px;
        }

        .cran {
            padding: 15px;
            margin-right: 20px;
        }
        .rm h6 {
            margin-bottom: -3px;
        }
        /* Data Services*/
        .md {
            margin-top: -10px;
        }

        
        .con {
            margin-top: 10px;
        }
        /* Wireless */
        .wire img {
            margin-left: -40px;
            width: 260%;
        }

        /* Contact us */
        .header-content{
            height: 10vh;
            width: 100vw;
            display: flex;
            flex-direction: row;
            align-items: end;
            background-image: url(/images/contact_img.png);
            background-size: 550px;
            margin-bottom: 10px;
        }
        .header-content a{
            color: white;
            margin-left: 50px;
            font-size: 20px;
            margin-bottom: 10px;
            text-decoration: none;
            background-position: bottom;
            align-items: flex-start;
         }
         .header-content a:nth-child(2){
             margin-left: 2px;
         }
        .c1{
            background-color: white;
            font-size: 10px;
            border-radius: 4px;
            margin-bottom: 10px;
            margin-left: -100px;
            box-shadow: 0 0 20px lightgray;
        }
        form .border{
            padding: 15px;
            width: 85%;
            margin-left: 25px;
            border-radius: 5px;
        }
        form h4{
            margin-left: 30px;
            padding-top: 30px;
        }
        form textarea{
            margin-top: 10px;
            margin-left: 25px;
            border-radius: 5px;
            padding-top: 8px;
            box-shadow: 0 0 2px black;
            width: 85%;
        }
        .border{
            padding: 5px;
            margin: 10px;
            border-radius: 2%;
            border-color: lightgray;
            box-shadow: 0 0 2px black;
        }
        .border h6{
            padding: 10px;
            font-size: 15px;
        }
        form a{
            margin-left: 23px;
            margin-top: 20px;
            margin-bottom: 20px;
        }
        .button-box{
            width: 200px;
            margin: 35px 10px;
            position: relative;
            border-radius: 30px;
            background-color: #fff;
        }
        .contact-info h5{
            margin-top: 10px;
        }
        .contact-info p{
             margin-left: 40px;
             margin-top: -18px;
             padding-top: 10px;
        }
        .contact-info{
            margin-left: 39px;
            width: 277px;
            display: inline-block;
            transform: 1s;
        }
        .contact-info .text{
            margin-left: 10px;
            margin-top: 8px;
        }
        .nr{
            height: 100px;
            margin-bottom: 10px;
        }
        .contact-info:hover{
            transform: scale(1.1);
            background: light;
            box-shadow: 0px 0px 10px rgb(0, 76, 152);
            border-radius: 8px;
        }
    
}