/* ==============================
   Phone
   ============================== */
   .mobile-ion,
    .mobile-on{display: none !important;
    }
        .btn--flow.mobile-on {
            display: none !important;
        }
    @media (max-width: 480px) and (min-width: 320px) {
        .text-xs-left{text-align: left !important;}
        .mobile-ion{
            display: inline-block !important;
        }
        .topbar--mobile{
            position: fixed;
            width: 100%;
            top: 0;
            height: 7px;
            left: 0;
            background: #EFD243;
            z-index: 9;
        }
        .bottombar--mobile{
            position: fixed;
            width: 100%;
            bottom: 0;
            height: 7px;
            left: 0;
            background: #EFD243;
            z-index: 9;
        }
                section {
                    padding: 90px 0 !important;
                }
                                .tab-style4 .nav-tabs>li>a{text-align: left;}
        body header nav{top: 10px;}
    #section--counter,
    .mobile-off{display: none !important;}
    .mobile-on{display: block !important;}
    body .video--img--1 {
        left: 3%;
        right: initial;
        margin: auto;
        top: -30%;
        width: 30%;
    }
    body .video--img--2 {
        left: initial;
        right: 0;
        margin: auto;
        top: -38%;
        width: 30%;
    }
    body .mb-200{margin-bottom: 100px !important;}
    body  .video--box--xl {
        overflow: hidden;
        position: relative;
        left: 0;
        right: 0;
        margin: auto;
        top: 0vh;
        bottom: 0;
        width: 100%;
        height: 183px;
        z-index: 111;
    }
    body .video--img--3 {
        left: 0;
        right: initial;
        margin: auto;
        top: 90%;
        width: 30%;
    }
    body .video--img--4 {
        left: 0;
        right: 0;
        margin: auto;
        top: 100%;
        width: 30%;
    }
    body #runvideoSection {
        min-height: 80vh;
    }
    .p,
    body ol.phases>li,
    body p{line-height: 1.6; font-size: 16px;}
    section.runtitle2{padding: 6vh 0 !important;}
    p.text-white{padding: 0 !important;}
    body h1 {
        line-height: .9 !important;
    }
    body .h1 {
        font-size: 36px;
        margin-bottom: 20px !important;
        line-height: .9 !important;
        text-align: left !important;
    }
    body .ScrollSmoother-wrapper {
        border: 7px solid #EFD243;
    }
    body .panel-body{max-width: 100% !important;}
    .w-xs-100{width: 100px !important;}
    body .list-unstyled li.card {
        width: 100%;
        background: #EFD243;
        padding: 60px 40px 40px 40px;
        margin-bottom: 40px;
    }
    body .tabsLd { 
        padding: 0px 0px;
    }
    body .tabsLd a {
        text-transform: uppercase;
        font-size: 14px;
        color: white;
        font-weight: 900;
        display: block;
        padding: 30px 15px;
        text-align: center;
    }
    body .onHover--text {
        font-size: 24px;
        font-weight: 800;
        color: black;
    }
    .wx-50{
        max-width: 50%;
    }
    .invert{
        flex-direction: column-reverse;
        margin-top: 40px;
    }
        .members--items li a:hover img {
            transform: scale(1) !important;
        }
    body .marquee__img {
        width: 40px;
        height: 20px;
        margin: 0 2vw;

        border-radius: 5vw;
        background: black;
        color: white;
        font-size: 1rem;
        text-align: center;
        align-items: center;
        justify-content: center;
        display: flex;
        position: relative;
    }
    body .onHover>span{font-size: 22px;}
    body .h2 {
        font-size: 2.5em;
        line-height: 1.1 !important;
    }
    iframe{
        max-height: 200px;
    }
    body .mb-xs-0{margin-bottom: 10px !important;}
    .height-fit{
        height: auto !important;
        padding: 120px 0px !important;
    }
    .height-fit .vertical-align {
        position: relative;
        top: 0%;
        -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
        transform: translateY(0%);

    }
    .imgpar{
        height: 400px;
            width: 100%;
            object-fit: cover;
            margin-bottom: 40px;
    }
    body .members--items li {
        width: 100%;
        position: relative;
    }
    .accordion-style1 .panel-title {
        font-size: 18px !important;
        padding-right: 30px;
        position: relative;
        padding-right: 50px;
        line-height: 1.3;
    }
        body .accordion-style1 .panel-title>span.float-right{
            font-size: 40px;
        }
        .mb-xs-40{
            margin-bottom: 40px;
        }
    body .loading--hero {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0; 
        width: 100%;

        justify-content: center;
        align-items: center;
        gap: 30px 0px;
    }
    body .loading--hero li { 
        width: 23%; 
    }
    body .rotating img:not(.circle--r) {
        width: 25px;
    }
    body .rotating .circle--r {
        position: absolute;
        top: 0;
        bottom: 0;
        left: -50%;
        right: -50%;
        animation: rotateInfinite 20s linear infinite;
        margin: auto;
        width: 104px;
        max-width: 300%;
    }
    body .loading--hero li:nth-child(4) {
        width: 5%;
        opacity: 0;
        margin: 25px 30px;
    }
    body .swiper-container{
        padding: 0 15px;
    }
    body     h4,
    body     h3 {
            font-weight: bold;
    }
    body .underline-orange:before { 
        bottom: 0px;
        height: 5px;
        background: #df5930;
    }
    body p.lead {
        margin: 0 0 25px;
        font-size: 22px;
        line-height: 1.5;
        font-weight: 500;
    }
        .navbar{margin: auto !important;}
    .mb-xs-60{margin-bottom: 60px;}
        body header a.logo img{margin-left: 0 !important;}
        body nav.navbar-default.active {
            width: 100%;
            height: 72px !important;
        }
    .plusmenu{display: none !important;}
    nav.navbar-default.active {
        width: 100% !important;
        height: 100px;
    }
        .members--items li a hr{
            width: 100% !important;
        }
        .members--items li a span{
            font-size: 14px !important;
        }
        .members--items li a span:not(.hover--ball),
        .members--items li a p {
            transform: translateY(0px) !important;
            opacity: 1 !important;
        }
                .hover--ball {
                    opacity: 0 !important;
                }
}