@media screen and (max-width:767px){
/*********************Responsive Navigation***********************/
   .toggleNav{
        position: fixed;
        top: 20px;
        right: 20px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: #000;
        cursor: pointer;
        z-index: 1040;
    }
    .toggleNav:before{
        content: "+";
        position: absolute;
        top: 0;
        left: 0;
        font-size: 50px;
        width: 100%;
        height: 100%;
        color: #fff;
        text-align: center;
        line-height: 50px;
        border-radius: 50%;
        background-color: #000;
        transition: 1s;
        font-weight: bold;
        z-index: 1040;
    }

    .toggleNav.active:before{
        transform: rotate(850deg);
        background-color: red;
        color: fff;
    }
    .overlayNav{
        position: fixed;
        top: 20px;
        right: 20px;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: rgba(0,0,0,.80);
        transition: transform 0.5s;
    }
    .overlayNav.active{
        transform:scale(100, 100);
        z-index: 100;
    }
    .menu{
        width: 100%;
        height: 100%;
        overflow: auto;
        z-index: 100;
        visibility: hidden;
    }
    .menu.active{
        visibility: visible;
        transition-delay: 0.5s;
    }
    .menu ul{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50% );
        margin: 0;
        padding: 0;
    }
    .menu ul li{
        list-style: none;

    }
    .menu ul li a{
        position: relative;
        font-size:  2.5rem;
        text-decoration: none;
        color: #fff;
        margin:20px 0;
        display: block;
        font-weight: bold;
        text-shadow: 0 2px 5px rgba(0,0,0,0.5)

    }
    .menu ul li a:before{
        content: '';
        position: absolute;
        bottom: 5px;
        left: -20px;
        width: 100%;
        height: 20px;
        background-color: #ffeb3b;
        z-index: -1;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.5s;

    }
    .menu ul li a:hover:before{
        transform: scaleX(1);
    } 
    .navbar-brand img{padding: 0;}
 .navbar-dark .navbar-toggler-icon  {
        background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }
    .navbar-dark .navbar-toggler{
        color: #000;
        border-color:#000; 
    }
    #visionBox3,#visionBox4,#visionBox5,#visionBox6{
    padding: 0 10%;
}
    /*********************Responsive Navigation***********************/
}
@media screen and (max-width:1024px){
    a.navbar-brand{
        width: 100px;
    }
    .about-img{
        padding-bottom: 100px;
    }
    #aboutUs img{
        height: 450px;    }
}
@media screen and (max-width:991px){
.navbar-dark .navbar-toggler-icon  {
        background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }
    .navbar-dark .navbar-toggler{
        color: #000;
        border-color:#000; 
        margin-right: 20px;
    }
    li.nav-item{
        padding-left: 40px;
    }
    .navbar-brand img{
        padding-left: 10px;
    }
    .social-header ul li{
        padding: 0 30px;
    }
    #top-banner .title-page h1{
        font-size: 25px;
    }
    
}
@media screen and (max-width:767px){
    #top-banner{
        height: 40vh;
    }
    #aboutUs img{
        height: auto;
    }
    .about-img img:nth-child(2){
        position: static;
    }
    #call-to-action h4{
        font-size: 16px;
    }
    #call-to-action .Azbtn{
        padding: 15px;
    }
    .form-footer .btn{
        width: 100%;
    }
    .navbar-brand img{
        height: 40px;
    }
    #wowslider-container1,
    .about-img{
        top: 50px;
    }
    li.nav-item{
        line-height: .6em;
    }
    .dropdown-menu{
        margin-left: 0 !important;
    }


}