/* -----------------------------------------------------

	Responsive Styles

----------------------------------------------------- */



@media screen and (min-width: 768px) {
 .home section.job {
    padding: 0;
}

}




@media screen and (min-width: 1200px) {



 .navbar-nav li:hover > .sub-menu {

    opacity: 1;

    visibility: visible;

}

/* First Level Dropdown */

.navbar-nav .sub-menu { position: absolute; top: 100%; left: 15px; width: auto; background: #fff; list-style: none; padding: 0; margin: 0; opacity: 0; visibility: hidden; transition: .3s; box-shadow: 0 5px 15px rgba(0,0,0,.1); z-index: 999; padding-top: 10px; padding-bottom: 10px; height: auto; }

.navbar-nav .sub-menu li a {  display: block;  padding: 3px 0px; }

.navbar-nav .sub-menu li a:hover {  color: #2b85c4;}

.navbar-nav .sub-menu li a:before{ display: none; }





/* Second Level Dropdown */

.navbar-nav .sub-menu .sub-menu { top: 0; left: 100%;}



}















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



.banner .banner-text h1 {  font-size: 52px;   max-width: 700px;  line-height: 62px; }  

.banner .banner-text p {  font-size: 26px; line-height: 42px; max-width: 600px; }

















}



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

.banner .banner-text h1 { font-size: 50px;  line-height: 60px; }

.banner .banner-text p {     font-size: 24px;    line-height: 34px; }









}





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

.banner .banner-text h1 { font-size: 46px; line-height: 56px;  max-width: 650px; } 

.banner .banner-text p {   font-size: 22px;    line-height: 32px;  max-width: 500px; }











}



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



.inner-banner h1 {    font-size: 54px;    line-height: 64px; }

 

}







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

h2 { font-size: 50px; line-height: 60px; }

h3 { font-size: 30px; }



.header .logo img {     max-width: 300px; } 

.header .navbar-nav li {    padding: 0 10px; }

.header .phone {    padding-left: 30px; }



.inner-banner h1 {    font-size: 52px;    line-height: 62px; }

.inner-banner h4 {    font-size: 24px; }

.banner .banner-text h1 {  font-size: 42px;  line-height: 52px;  max-width: 550px; }

.banner .banner-text p {    font-size: 20px;    max-width: 450px; }



.collaboration ul li {    padding: 15px 17px;  }

.footer p, .footer ul li a { font-size: 16px; }



}



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

h2 { font-size: 46px;    line-height: 54px; }

h3 { font-size: 28px; }

.header .navbar-nav li {    padding: 0 7px; }

.header .logo img {    max-width: 270px; }

.inner-banner .content {  height: 250px; }



.inner-banner h1 {    font-size: 50px;    line-height: 60px; }

.inner-banner h4 {    font-size: 22px; }



.banner .banner-text h1 {  font-size: 38px;  line-height: 48px;  max-width: 510px; } 

.banner .banner-text p {  font-size: 19px;  max-width: 435px; }

.collaboration ul li img { max-height: 80px; }















}



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



.inner-banner h1 {    font-size: 46px;    line-height: 56px; }

.inner-banner h4 {    font-size: 20px; }

.inner-banner .content {  height: 230px; }

.inner-banner {    padding-top: 110px;   min-height: 300px; }



.header .navbar-nav .menu-item-has-children.active .sub-menu { 

    position: relative; 

    left: -0px; 

    background: transparent; 

    opacity: 1;

    visibility: visible; 

    box-shadow: none; 

    padding-top: 0; 

    height: 100%;



      } 

.header .navbar-nav li.active a:before, .header .navbar-nav li a:hover:before { display: none; }





p {  font-size: 16px; line-height: 28px; }
.bg-content p, .bg-content ul li, .content p, .content ul li {
    font-size: 16px;
    line-height: 28px;
}

h2 {  font-size: 44px;    line-height: 50px;  }

.header nav#nav.is-active {    text-align: center; }

.header .navbar-nav {  max-width: 400px;     width: 100%;         height: 100%;

        overflow-y: scroll; }

.navbar-nav { padding: 100px 0; }

.header .navbar-nav li {  text-align: left; }

.header .navbar-nav li {  padding: 8px 11px; text-align: left; border-top: 1px solid #fff;  border-bottom: none; display: block; width: 100%; }





.header .phone { padding-left: 0px; margin-right: 70px; } 



.banner .banner-text .right { display: none; }

.banner .banner-text .mid-content {    margin-left: 45%; top: 220px; }

.banner .banner-text .left {     max-width: 40%; }



.banner .item {    height: auto;    min-height: 600px; }

.banner .banner-text {  min-height: 600px; }

.about-bg .content { padding: 20px 30px; }

.services .card .content h3 {    font-size: 24px; }



.contact-sec .card figure img {  margin-top: -52px;    max-width: 100px; }















}





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



h2 { font-size: 40px;  line-height: 50px; }

.banner .banner-text h1 {    font-size: 34px;    line-height: 42px; }

.inner-banner figure { display: none; }

.inner-banner .content { max-width: 100%; }

.inner-banner h1 {    font-size: 42px;    line-height: 52px; }







.about-bg { padding-bottom: 50px; }

.about-bg .row   { display: block; }

.about-bg .row:nth-child(even) {    display: flex;  flex-direction: column-reverse; margin: 0 auto; } 

.about-bg .row img, .job .row img { max-width: 500px; width: 100%; }

.about-bg figure { background-color: transparent; }



.reach-us .content { padding-left: 38%; padding-right: 2%; position: relative; z-index: 1; }

.reach-us .content:before { content: ''; position: absolute; background-color: rgba(0,0,0,0.5); width: 100%; height: 100%; left:0; top:0; z-index: -1; }



.job .row figure { text-align: center; margin-bottom: 40px; }

.job h2 span {  display: inline-block; }



.footer .full { margin-bottom: 40px; }

.footer .address {  margin-bottom: 0; }



.banner .btn, .collaboration .btn { padding: 10px 20px; font-size: 16px; }

.collaboration ul li img {  max-height: 60px; }



.footer .copy-rights { margin-top: 10px;  }

.about-bg .content, .alt-sec .content {   padding: 15px 0; }

.reverce-order .row {  flex-direction: column-reverse; }

.alt-sec .image figure { margin-bottom: 20px; margin-top: 10px;  }

.about-bg .row > div, .alt-sec .row > div {   padding: 0 15px; }

.contact-sec .card {    border: 2px solid #47b2e4;    margin: 0 auto 100px;    max-width: 400px;}

.c-form{ margin-top: 0; padding: 0 15px; }











}























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



.inner-banner h1 {    font-size: 38px;    line-height: 48px; }

.reach-us .content {    padding: 30px; }

.reach-us p {  font-size: 18px;  }

.banner .banner-text {    padding-top: 130px; }

.banner .banner-text .left {  width: 90%; margin: 0 auto; position: relative;  top: inherit;  max-width: 450px; }

.banner .banner-text .mid-content {  margin-left: 0;  top: inherit;  position: relative;  text-align: center; padding-top: 40px; padding-bottom: 50px; }

.banner .banner-text h1, .banner .banner-text p {    max-width: 100%; }

.services .card .content h3 { font-size: 22px; }

.services .card .content { padding: 20px 15px;}

.hero-content p, .hero-content ul li {  font-size: 18px;    line-height: 30px; }

.hero-content {    padding: 60px 0 50px; }

.home section.job { padding-bottom: 0; }

.content, .bg-content {  padding: 60px 0; }
.mb-100 {    margin-bottom: 60px !important; }
.c-form h2 + p { padding: 0 0 20px; }
.home section {    padding: 60px 0; }
.job .row figure {    margin-bottom: 5px; }
.home .footer {    margin-top: 20px; }



}



































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

    h2 {

    font-size: 36px;

    line-height: 42px;

}

.inner-banner h1 {    font-size: 36px;    line-height: 46px; }

.inner-banner h4 {    font-size: 18px; }

.services .full { width: 100%; max-width: 470px; margin: 0 auto; float: none;  }

.header-menu .phone  { display: none; }

.mobile-toggle {  top: 24px;  }

.banner .banner-text h1 {

    font-size: 30px;

    line-height: 40px;

}

.collaboration ul li img {

    max-height: 50px;

}

.collaboration ul li {

    padding: 10px 12px;

}

footer .full { width: 100%; }

.bg-content p, .bg-content ul li, .content p, .content ul li, .alt-sec .content-wrap p, .contact-sec .card p, .contact-sec .card a, .c-form h2 + p {

    font-size: 16px;

    line-height: 30px;

}

.faq-sec .accordion-button.collapsed {    font-size: 18px;  }

 

.inner-banner p { line-height: 26px; }







}









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

 h2 {    font-size: 32px;    line-height: 40px;}

h3 {    font-size: 26px; }

.inner-banner h1 {    font-size: 34px;    line-height: 42px; }

.header .logo img {

    max-width: 225px;

    margin-top: 14px;

}

.banner .banner-text h1 {

    font-size: 26px;

    line-height: 30px;

}

.banner .banner-text p {

    font-size: 18px;

    line-height: 26px; }

.about-bg .content {

    padding: 20px 0px;

}

.reach-us p {

    font-size: 16px;

    line-height: 24px;

}

.footer {

    padding-top: 80px;

 }









}



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

 



}







/* -----------------------------------------------------

    Navifgation Responsive Styles

----------------------------------------------------- */

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

    .header .navbar-nav li a{ color: #fff; padding:0; }

    .header nav#nav.is-active {

        opacity: 1;

        visibility: visible;

    }



    .header nav#nav {

        position: fixed;

        top:0;

        left:0;

        margin-top:0;

        z-index:990;

        opacity:0.0;

        visibility: hidden;

        height:100%;

        width:100%; 

        transition:all 0.35s ease-in-out;

        background: #2b85c4;

 

    }

    

    .navbar-nav{

        padding:100px 0;

        text-align:center;

    }

    

    /* Cross icon */

    .mobile-toggle {

        position: absolute;

        top: 32px;

        right:20px;

        z-index:999;

        display: inline-block;

        cursor: pointer;

        transition-property: opacity, filter;

        transition-duration: 0.25s;

        transition-timing-function: linear;

        background-color: transparent;

        border: 0;

        margin: 0;

        overflow: visible;

        padding: 0;

        width: 30px;

        height: 28px;

        float:right;

    }

    

    .mobile-toggle:hover {

        opacity: 0.7;

    }



    .mobile-toggle:focus {

        outline:0;

    }



    .mobile-toggle-box {

        width: 34px;

        height: 28px;

        display: inline-block;

        position: relative;

    }



    .mobile-toggle-inner {

        display: block;

        top: 50%;

        margin-top: -2px;

    }

    

    .mobile-toggle-inner,

    .mobile-toggle-inner::before,

    .mobile-toggle-inner::after {

        width: 28px;

        height: 3px;

        background-color: #2b85c4;

        border-radius: 4px;

        position: absolute;

        transition-property: transform;

        transition-duration: 0.15s;

        transition-timing-function: ease;

    }

    

    .is-active .mobile-toggle-inner,

    .is-active .mobile-toggle-inner::before,

    .is-active .mobile-toggle-inner::after {

        /*background-color: #ff1acb;*/

        background-color: #fff;

    }



    .mobile-toggle-inner::before,

    .mobile-toggle-inner::after {

        content: "";

        display: block;

    }

    

    .mobile-toggle-inner::before {

        top: -9px;

    }

    

    .mobile-toggle-inner::after {

        bottom: -9px;

    }



    .mobile-toggle--squeeze .mobile-toggle-inner {

        -webkit-transition-duration: 0.075s;

        -ms-transition-duration: 0.075s;

        transition-duration: 0.075s;

        -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

        -ms-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

        transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    }

    

    .mobile-toggle--squeeze .mobile-toggle-inner::before {

        -webkit-transition: top 0.075s 0.12s ease,

        opacity 0.075s ease;

        -ms-transition: top 0.075s 0.12s ease,

        opacity 0.075s ease;

        transition: top 0.075s 0.12s ease,

        opacity 0.075s ease;

    }

    

    .mobile-toggle--squeeze .mobile-toggle-inner::after {

        -webkit-transition: bottom 0.075s 0.12s ease,

        transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);

        -ms-transition: bottom 0.075s 0.12s ease,

        transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);

        transition: bottom 0.075s 0.12s ease,

        transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);

    }



    .mobile-toggle--squeeze.is-active .mobile-toggle-inner {

      -webkit-transform: rotate(45deg);

      -ms-transform: rotate(45deg);

      transform: rotate(45deg);

      -webkit-transition-delay: 0.12s;

      -ms-transition-delay: 0.12s;

      transition-delay: 0.12s;

      -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

      -ms-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

      transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    }

    

    .mobile-toggle--squeeze.is-active .mobile-toggle-inner::before {

        top: 0;

        opacity: 0;

        transition: top 0.075s ease, opacity 0.075s 0.12s ease;

    }

    

    .mobile-toggle--squeeze.is-active .mobile-toggle-inner::after {

        bottom: 0;

        -webkit-transform: rotate(90deg);

        -ms-transform: rotate(90deg);

        transform: rotate(90deg);

        -webkit-transition: bottom 0.075s ease,

        transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);

        -ms-transition: bottom 0.075s ease,

        transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);

        transition: bottom 0.075s ease,

        transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);

    }



}

