/*responsive menu css*/
@media only screen and (max-width: 1024px) {

body.wp-custom-logo .site-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    -webkit-box-shadow: 0 8px 6px -6px #333;
    -moz-box-shadow: 0 8px 6px -6px #333;
    box-shadow: 0 8px 6px -6px #333;
}
}

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

.home-banner::before {
  
    height: 120px;
    }
     #colophon {
    background: url(../images/footer-ipad.png) no-repeat;
    margin-top: 120px;
    position: relative;
    background-size: cover;
    padding-top: 0;
}
#colophon:before {
    content: " ";
    background: url(../images/footer-ipad-shape.png) no-repeat;
    position: absolute;
    top: -120px;
    height: 120px;
    left: 0;
    right: 0;
    width: ;
    width: 100%;
    z-index: 1;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
    }


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

    section,
    .section-gapping {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    header .site-logo {
        max-width: 338px;
    }

    header .primary-navigation .primary-menu-container>ul>.menu-item {
        padding: 0 30px 0 0;
    }

    header .primary-navigation .primary-menu-container>ul>.menu-item>a {
        font-size: 17px;
    }

    .home-banner .common-banner .vc_single_image-wrapper {
        height: 680px;
    }

    .home-banner::before {
        height: 100px;
    }

    .common-title {
        font-size: 40px;
    }

    .vision-section .vision-right .vision-cnt {
        margin: 20px 0 12px;
    }

    body p {
        font-size: 16px;
    }

    .common-btn a,
    .common-btn .vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern {
        line-height: 50px;
        min-width: 195px;
        font-size: 16px;
    }

    .vision-section h3.vc_custom_heading {
        font-size: 22px;
        width: 130px;
        top: 133px;
    }

    .vision-section h3.vc_custom_heading.second {
        left: 65px;
    }

    .vision-section h3.vc_custom_heading.third {
        right: -7px;
    }

    .explore-section .common-title {
        margin-bottom: 30px;
    }

    .explore-section .explore-wrap .vc_col-sm-4 {
        margin: 0 15px;
    }

    .explore-section .explore-wrap {
        margin: 0 -15px;
    }

    .explore-section .vc_col-sm-4 .vc_custom_heading a {
        font-size: 20px;
    }

    #colophon .widget-content>h2 {
        font-size: 25px;
        margin-bottom: 30px;
    }

    #colophon .footer-up .footer-left {
        width: 25%;
        padding-right: 48px;
    }

    #colophon .footer-up .footer-center {
        width: 45%;
        padding-right: 40px;
    }

    #colophon .footer-up .footer-right {
        width: 30%;
    }

    #colophon .menu li a {
        font-size: 15px;
    }

    #colophon .footer-center .contact-wrap li h3 {
        font-size: 16px;
    }

    #colophon .footer-center .contact-wrap li {
        padding: 0 0 15px 40px;
    }

    #colophon .footer-up {
        padding: 102px 0 17px 0;
    }

    #colophon .site-info .powered-by {
        font-size: 16px;
    }.project-section .projects {
  
    margin: 0 38px 50px 0;
}
.projects-image {
    height: 235px;
    }
      .team-wrap .team {
   
    margin-right: 32px;
    }
    .explore-section .explore-wrap .vc_col-sm-4 .vc_single_image-wrapper {
    height: 247px;
    }
  .partner-seaction .vc_col-sm-1\/5 {
   
    margin-left: 32px;
    }
   


}



@media only screen and (max-width: 1023px) {
    header .site-logo {
        position: static !important;
    }

    html.menu-open {
        overflow: hidden;
    }

    header .menu-button-container {
        display: block !important;
        padding: 0;
    }

    html header .menu-button-container {
        display: block !important;
        padding: 0;
        position: absolute;
        height: 35px;
        width: 35px !important;
        background: none !important;
        border-radius: 100px;
        top: 28px;
        right: 15px;
        left: auto;
        bottom: 0;
        cursor: pointer;
        border: 1px solid #7EAD32;
        z-index: 999999 !important;
    }

    html header .menu-button-container:hover {
        background: #0F5B93 !important;
    }

    html header .menu-button-container #primary-mobile-menu {
        padding: 0;
        font-size: 0;
        line-height: normal;
        width: inherit;
        outline: none !important;
        height: inherit;
    }

    header .menu-button-container #primary-mobile-menu .dropdown-icon {
        display: none !important;
    }

    html header .menu-button-container #primary-mobile-menu {
        padding: 0;
        font-size: 0;
        line-height: normal;
        width: inherit;
        outline: none !important;
        height: inherit;
        display: block;
        min-width: auto;
        background: none !important;
    }

    header .menu-button-container #primary-mobile-menu::before {
        position: absolute;
        content: "";
        width: 18px;
        height: 2px;
        background: #7EAD32;
        text-align: center;
        top: 16.3px;
        right: 2px;
        left: 0px;
        bottom: auto;
        margin: auto;
        box-shadow: 0 -6px 0 0 #7EAD32, 0 6px 0 0 #7EAD32;
    }

    header .primary-navigation .primary-menu-container {
        opacity: 1;
        display: block;
        /* left: 0; */
        /* right: 0; */
        transform: translateX(100%);
        -moz-transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        width: 100%;
        /* max-width: 100%; */
        -moz-transition: all 0.5s ease 0s;
        -webkit-transition: all 0.5s ease 0s;
        -ms-transition: all 0.5s ease 0s;
        -o-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s;
        position: fixed !important;
        top: 0px !important;
        /* right: 0; */
        left: auto;
        bottom: 0;
        background: #5f8726;
        max-width: 100%;
        z-index: 99999;
        padding: 0;
        overflow: auto;
        float: none;
        margin: 0;
    }

    header .primary-navigation .primary-menu-container ul {
        padding-top: 90px;
    }

    body.primary-navigation-open header .primary-navigation .primary-menu-container {
        -webkit-transform: translateX(0) translateY(0);
        -moz-transform: translateX(0) translateY(0);
        -ms-transform: translateX(0) translateY(0);
        -o-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }
 body.primary-navigation-open .menu-button-container #primary-mobile-menu::before ,
  body.primary-navigation-open .menu-button-container #primary-mobile-menu::after{
    content: " ";
    box-shadow: none;
    background:  #Fff;
    height: 16px;
    width: 2px;
    position:absolute  
   
   
    font-weight: normal;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
    position: absolute;
    transform: rotate(45deg);
}
body.primary-navigation-open .menu-button-container #primary-mobile-menu::after {
    transform: rotate(
-45deg);
}
    .primary-navigation>div>.menu-wrapper {
        display: block;
    }

    header #site-navigation #primary-menu-list>li>a {
        font-size: 16px;
        color: #fff;
        margin: 0;
        position: relative;
        display: inline-block;
        width: auto;
        padding: 12px 15px;
    }

    header #site-navigation #primary-menu-list>li>a::before {
        display: none;
    }

    header #site-navigation #primary-menu-list>li>a:hover,
    header #site-navigation #primary-menu-list>li.current_page_item>a {
        color: #0F5B93;
    }

    .primary-navigation>div>.menu-wrapper>li:not(:last-child)::before {
        display: none;
    }

    .primary-navigation>div>.menu-wrapper>li {
        margin: 0;
        border-bottom: 1px solid #fff;
    }


    header .logo-nav-wrapper .site-logo>.custom-logo-link {
        max-width: 180px;
    }


    body:not(.primary-navigation-open) .site-header.has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu {
        margin: 0;
    }

    body.lock-scrolling .site {
        position: relative;
    }

    .top-btn {
        height: 35px;
        width: 35px;
        right: 15px;
        line-height: 34px;
    }

    .top-btn::before {
        font-size: 25px;
    }
    .team-wrap .team .member-name {
   
    margin-bottom: 10px;
 
    margin-top: 30px;
    
}
body .partner-seaction .vc_col-sm-1\/5 img {
    
    max-width: 79% !important;
}
.vision-page {
    padding-bottom: 50px !important;
}

}

@media only screen and (min-width: 768px) and (max-width: 1023px) {

    section,
    .section-gapping {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    html header .menu-button-container {
        top: auto;
      bottom: -15px;
    }

    .home-banner .common-banner .vc_single_image-wrapper {
        height: 512px;
    }

    .home-banner::before {
        height: 90px;
    }

    .mobile-title {
        display: block;
    }

    .desktop-title {
        display: none;
    }

    .vision-section.section-gapping {
        padding: 50px 0 50px;
    }

    .vision-section .vc_col-sm-6:first-child {
        flex: 0 0 100%;
        width: 100%;
        max-width: 502px;
        padding-top: 20px;
        margin: 0px auto;
    }

    .vision-section .vc_col-sm-6:last-child {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        padding-top: 30px;
    }

    .vision-section .vc_row {
        flex-wrap: wrap;
    }

    .common-title {
        font-size: 24px;
    }

    .common-title.common-title-left {
        text-align: center !important;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper {
        width: 275px;
        height: 275px;
        min-width: 275px;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper::after {
        height: 275px;
        width: 275px;
    }

    .vision-section .vision-left .wpb_single_image:not(:first-child) {
        margin: -84px -57px 0 11px;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper img {
        top: 45px;
        width: 70px !important;
        height: 70px !important;
    }

    .vision-section .vision-left .wpb_single_image.life .vc_single_image-wrapper img {
        top: 100px;
        right: 85px;
    }

    .vision-section .vision-left .wpb_single_image.values .vc_single_image-wrapper img {
        top: 100px;
        left: 95px;
    }

    .vision-section h3.vc_custom_heading {
        top: 125px;
        font-size: 20px;
        width: 147px;
    }

    .vision-section h3.vc_custom_heading.second {
        bottom: 70px;
        left: 51px;
    }

    .vision-section h3.vc_custom_heading.third {
        bottom: 68px;
        right: -17px;
    }

    body p {
        font-size: 17px;
    }

   .common-btn a, .common-btn .vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern {
    line-height: 45px !important;
    min-width: 156px;
    font-size: 17px !important;
    text-align: center;
    margin-top: 5px;
}

    .common-btn {
        text-align: center;
    }

    .explore-section .explore-wrap {
        margin: 0 -15px;
    }

    .explore-section .explore-wrap .vc_col-sm-4 {
        margin: 0 15px;
    }

    .explore-section .vc_col-sm-4 .vc_custom_heading a {
        font-size: 20px;
    }

    #colophon .widget-content>h2 {
        font-size: 25px;
        margin-bottom: 30px;
    }

    #colophon .footer-up .footer-left {
        width: 25%;
        padding-right: 48px;
    }

    #colophon .footer-up .footer-center {
        width: 45%;
        padding-right: 40px;
    }

    #colophon .footer-up .footer-right {
        width: 30%;
    }

    #colophon .menu li a {
        font-size: 15px;
    }

    #colophon .footer-center .contact-wrap li h3 {
        font-size: 16px;
    }

    #colophon .footer-center .contact-wrap li {
        padding: 0 0 15px 40px;
    }

    #colophon .footer-up {
        padding: 102px 0 17px 0;
    }

    #colophon .site-info .powered-by {
        font-size: 16px;
    }
    .projects-image {
    height: 170px;
    }
    .project-section .projects {
    flex: 0 0 30.77%;
    margin: 0 28px 40px 0;
}
.project-section .projects-name {
   
    font-size: 17px;
    
    min-height: 64px;
    padding: 20px 10px;
}
.explore-section .explore-wrap .vc_col-sm-4 .vc_single_image-wrapper {
    height: 180px;
    }
    .faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-heading a {
    background-color: #fff;
    padding: 24px 28px 24px 47px;
   
    color: #545454 !important;
    font-size: 19px;
   
}
.faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-body p {
    font-size: 15px;
    }
    .team-wrap .team .member-image {
    width: 150px;
    height: 150px;
    }
    .team-wrap .team .member-name {
    color: #0F5B93;
    font-size: 21px;
    font-family: 'Lato', sans-serif;
    margin-bottom: 10px;
   
    margin-top: 30px;
}
.team-wrap .team .member-desc {
   
    font-size: 15px;
    line-height: 159%;
}
.partner-seaction .vc_col-sm-1\/5 {
    width: 18.35%;
    margin-left: 15px;
    }
    .team-wrap .team {
   
    margin-right: 28px;
    }
   #colophon {
    background: url(../images/footer-ipad.png) no-repeat;
    margin-top: 80px;
    position: relative;
    background-size: cover;
    padding-top: 0;
}
#colophon:before {
    content: " ";
    background: url(../images/footer-ipad-shape.png) no-repeat;
    position: absolute;
    top: -80px;
    height: 90px;
    left: 0;
    right: 0;
    width: ;
    width: 100%;
    z-index: 1;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.single .project-title h1 {
 
    font-size: 40px;
    }
    .single article {
    padding-top: 60px;
    padding-bottom: 60px;
}
body .partner-seaction .vc_col-sm-1\/5 img {
    
    max-width: 79% !important;
}
.research-team-section h2.vc_custom_heading.common-title, .national-board-seaction h2.vc_custom_heading.common-title, .advisory-seaction h2.vc_custom_heading.common-title, .partner-seaction h2.vc_custom_heading.common-title {
    margin-bottom: 30px;
}
.people-page #colophon:before {
    background-color: #EBF6F9;
}

}

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

    section,
    .section-gapping {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    header .site-logo {
        max-width: 280px;
    }

    body.wp-custom-logo .site-header {
        padding: 20px 15px;
    }


    .home-banner::before {
        height: 41px;
    }

    .home-banner .common-banner .vc_single_image-wrapper {
        height: 400px;
    }

    .home-banner .common-banner .vc_single_image-wrapper img {
        height: 400px !important;
    }

    .mobile-title {
        display: block;
    }

    .desktop-title {
        display: none;
    }

    .vision-section.section-gapping {
        padding: 50px 0 50px;
    }

    .vision-section .vc_col-sm-6:first-child {
        flex: 0 0 100%;
        width: 100%;
        max-width: 335px;
        padding-top: 20px;
        margin: 0px auto;
    }

    .vision-section .vc_col-sm-6:last-child {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        padding-top: 0;
    }

    .vision-section .vc_row {
        flex-wrap: wrap;
    }

    .common-title {
        font-size: 24px;
    }

    .common-title.common-title-left {
        text-align: center !important;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper {
        width: 192px;
        height: 192px;
        min-width: 192px;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper::after {
        height: 192px;
        width: 192px;
    }

    .vision-section .vision-left .wpb_single_image .vc_single_image-wrapper img {
        top: 12px;
        width: 40px !important;
        height: 40px !important;
    }

    .vision-section .vision-left .wpb_single_image:not(:first-child) {
        margin: -84px -57px 0 11px;
    }

    .vision-section h3.vc_custom_heading {
        top: 65px;
        font-size: 14px;
        width: 97px;
    }

    .vision-section .vision-left .wpb_single_image.life .vc_single_image-wrapper img {
        top: 70px;
        right: 65px;
    }

    .vision-section h3.vc_custom_heading.second {
        bottom: 55px;
        left: 35px;
    }

    .vision-section .vision-left .wpb_single_image.values .vc_single_image-wrapper img {
        top: 70px;
        left: 75px;
    }

    .vision-section h3.vc_custom_heading.third {
        bottom: 58px;
        right: -1px;
    }

    body p {
        font-size: 14px;
    }

   .common-btn a, .common-btn .vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern {
    line-height: 42px !important;
    min-width: 146px;
    font-size: 14px !important;
    text-align: center;
    margin-top: 5px;
}

    .common-btn {
        text-align: center;
    }

    .explore-section .explore-wrap {
        flex-wrap: wrap;
        margin: 0;
    }

    .explore-section .explore-wrap .vc_col-sm-4 {
        margin: 0;
        padding-bottom: 25px;
    }

    .explore-section .vc_col-sm-4 .vc_custom_heading a {
        font-size: 20px;
    }

    #colophon {
        padding: 50px 0 0;
        background: url("../images/mobile-footer-bg.png") no-repeat;
        background-size: 100% 100%;
    }

    #colophon .footer-up {
        padding: 50px 0 47px 0;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    #colophon .footer-up .footer-left {
        display: none;
    }

    #colophon .footer-up .footer-center {
        width: 100%;
        padding-right: 0;
        padding-top: 50px;
    }

    #colophon .footer-up .footer-right {
        width: 100%;
        align-self: center;
    }

    #colophon .widget-content>h2 {
        font-size: 20px;
        margin-bottom: 30px;
    }

    #colophon .footer-center .contact-wrap li h3 {
        font-size: 14px;
    }

    #colophon .footer-center .contact-wrap li {
        padding: 0 0 19px 27px;
    }

    #colophon .site-info .powered-by {
        font-size: 14px;
        line-height: 140%;
        max-width: 214px;
        margin: 0px auto;
    }

    #colophon .site-info {
        padding: 20px 0 10px;
    }

    .explore-section.section-gapping {
        margin-bottom: -224px !important;
    }

    #colophon .footer-center .contact-wrap li.address p {
        max-width: 250px;
    }

    /* ----404-page------- */
    .error-404.not-found {
        padding-top: 50px;
        padding-bottom: 80px;
    }

    .error-404.not-found h2 {
     font-size: 59px;
    }
    .vision-right .common-btn .vc_btn3.vc_btn3-color-grey.vc_btn3-style-modern {
    height: 40px;
    font-size: 14px !important;
    min-width: 146px;
    line-height: 40px !important;
}
.explore-section .vc_col-sm-4 .vc_custom_heading , .explore-section .vc_col-sm-4 .vc_custom_heading a{
 
    font-weight: bold;
}
#colophon .footer-up .footer-right figure.wp-block-image.size-full {
    margin-bottom: 0;
}
.error-404.not-found p {
    font-size: 14px;
    }
    .home-banner .banner-logo {
    display: none;
}
.home-banner .banner-logo.mobile-view {
    display: block;
}
.project-section .projects:nth-child(2n) {
    margin-right: 0;
}

.project-section .projects {
    flex: 0 0 48%;
    margin: 0 10px 30px 0;
}
projects-image {
    height: 127px;
    }.project-section .projects-name {
    background-color: #fff;
    color: #000000;
    font-size: 14px;
    
    min-height: 54px;
    padding: 10px 5px;
}
.projects-image {
    height: 126px;
    }
        .faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-heading a {
    background-color: #fff;
    padding: 24px 28px 24px 47px;
   
    color: #545454 !important;
    font-size: 19px;
   
}
.faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-body p {
    font-size: 15px;
    }
    .faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-heading a:before {
   
    font-size: 22px;
    margin-right: 13px;
   
    left: 18px;
        position: absolute;
}
.faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-body {
   
    padding: 24px 48px 24px 47px;
}
.team-wrap .team:nth-child(-n+3) {
    margin-bottom: 30px;
}

.team-wrap .team {
   
    margin-bottom: 30px;
        width: 100%;
    flex: 0 0 100%;
        margin-right: 0;
}
.partner-seaction .vc_col-sm-1\/5 {
    width: 100%;
    margin-bottom: 20px;
        margin-left: 0;
    }
    .partner-seaction .vc_single_image-wrapper {

    margin: auto;
    }
    .team-wrap .team:nth-child(n+5) {
    margin-bottom: 30px;
}
.team-wrap .team .member-name {
 
    margin-top: 30px;
}
.single .project-title h1 {
 
    font-size: 35px;
    }
    .single article {
    padding-top: 50px;
    padding-bottom: 50px;
}
   .research-team-section h2.vc_custom_heading.common-title, .national-board-seaction h2.vc_custom_heading.common-title, .advisory-seaction h2.vc_custom_heading.common-title, .partner-seaction h2.vc_custom_heading.common-title {
    margin-bottom: 30px;
}
.team-wrap .team .member-desc {
   
    font-size: 14px;
    }
.faq-section .vc_tta-container {
    margin-top: -24px;
}
.faq-section .vc_tta-panels-container>.vc_tta-panels .vc_tta-panel-heading a:after {
 
    right: 0;
    }
    .project-section .projects:nth-last-child(-n+3) {
    margin-bottom: 30px;
}
.project-section .projects:last-child {
    margin-bottom: 0;

}
.error-404-section .home-banner>div:nth-child(2){
display: none;}
.error-404-section .home-banner>div:nth-child(3){
display: block;}


}


@media only screen and (min-width: 480px) and (max-width: 767px) {
    html header .menu-button-container {
        top: auto;
        bottom: -19px;
    }
    .explore-section .explore-wrap .vc_col-sm-4:nth-child(2n) {
    margin-right: 0 !important;
}


.explore-section .explore-wrap .vc_col-sm-4 {
    margin: 0;
    padding-bottom: 25px;
    flex: 0 0 48%;
    margin-right: 23px;
}
.explore-section .explore-wrap .vc_col-sm-4 .vc_single_image-wrapper {
    height: 200px;
    }
    .projects-image {
    height: 230px;
    }
    .partner-seaction .vc_col-sm-1\/5 {
    width: 33%;
    margin-bottom: 20px;
    margin-left: 0;
}
.partner-seaction .vc_single_image-wrapper {
    position: relative;
    width: 194px;
    }
}


@media not all and (min-resolution:.001dpcm) {
    @media and screen and (max-width: 1023px) {
        body.primary-navigation-open .menu-button-container #primary-mobile-menu{
        right:30px;}
    }
}

/*responsive menu css*/
