/*
320px — 480px: Mobile devices
481px — 768px: iPads, Tablets
769px — 1024px: Small screens, laptops
1025px — 1200px: Desktops, large screens
1201px and more —  Extra large screens, TV
*/

.modal-content {
    border-radius: 20px;
}
.modal-header {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.homeIntro h1  {
    margin: 0px;
    padding: 0px;
}
.homeIntro .homeLogo {
    margin: 0px;
    padding: 0px;
    margin-bottom: 20px;
}
.homeIntro img {
    height: 100px;
}

.list-services {
    padding: 0px;
}

.tablet-left img {
    width: 95%;
}

.mobileOneSide {
    height: 100vh;
}
.bgMobile {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}

.showMobile { display: none; }
.showMobile2 { display: none;}

.spacer-mobile,
.wrapper-navbar-mobile, .logo_mobile { display: none ; }
.webs-open-mobile { display: none; }
.card__face--front strong { display: none; }
.align-bottom { height: 100vh; }

.product_1 {
    position: relative;
    left: -70px;
}

.bg-product-2 {
    width: 85%; margin: auto;
}

.bg-blue p {
    color: #fff;
}

.frontliner-title {
    position: relative;
    left: -70px;
}

.bg-white p {
    color: #00263f !important;
}

.bg-blue { background-color: #00263f !important; }
.bg-orange2 {background-color: #f38330; color: #fff;}
.bg-white2 { color: #00263f;  }
.bg-white2 p { color: #00263f; }

.align-bottom { display: flex; }
.hideMobile { display: flex; }
.hideMobile2 { display: block; }

.serviciosBtn {
    background-color: #f48530;
    width: 90% !important;
}

.ml20 { margin-left: 20px; }
.bigButton { padding: 30px 50px 70px 50px;  background-position: center bottom; }
.sideH100 { height: 95vh !important; }
.sideH90 { height: 90vh !important; }

.videoProduct {
    /* width="560" height="315" */
    width: 90%;
    height: 315px;
    margin: auto;
    display: inline-block;
}

.videoProductThumb {
    width: 95%;
    /* height: 315px; */
    height: 250px;
    margin: auto;
    display: inline-block;
    position:relative;
    z-index: 110;
}

/* ani escorpion */
.ani-escorpion {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.product-desc, .product-desc:hover, .product-desc:visited, .product-desc:link {
    display: inline-block;
    color: #fff;
    position: absolute;
    font-size: 22px;
    font-weight: 600;
    top: 200px;
    text-decoration: none;
    cursor: pointer;
    display: none;
}
.product-desc:hover .ani-text {
    display: block;
}
/* product animation */
.ani-text {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    /* font-size: 22px; */
    font-size: 15px;
    border-radius: 20px;
    position: absolute;
    width: 290px;
    height: auto;
    padding: 5px 5px;
    line-height: 1.1;
    display: none;
    font-weight: normal;
}

.text_white_shadow, .text_white_shadowp {
    color: #fff !important;
    text-shadow: 1px 2px #333;
}



@media (max-width: 1600px) {
    .bg-3-frontliner {
        background-position: -50px bottom !important;
    }
}

@media (max-width: 1440px) {
    .xl-size {
        font-size: 20px;
        line-height: 1.1;
    }

    .folder {
        background-size: cover;
    }
}

@media (max-width: 1100px) {
    .websg-navbar { 
        margin-top: 30px;
    }
    .websg-navbar li {
        padding-right: 10px;
    }
    .websg-navbar li a {
        font-size: 15px;
    }

    .webs-logo {
        padding: 5px 0 0 30px;
    }

    .webs-logo img {
        height: 70px;
    }

    /* home */
    .home-title h1 {
        font-size: 22px;
    }
    .home-numbers h2 {
        font-size: 30;
    }
    .home-numbers li h3 {
        font-size: 20px;
    }
    .home-numbers li p {
        font-size: 22px;
    }
    .home-slide-1 img {
        height: 15vh;
    }
    .home-numbers-orange li h3 {
        font-size: 30px;
    }
    .home-numbers-orange li p {
        font-size: 18px;
        font-weight: normal;
    }

    .bg-home {
        background-position: center center;
        background-size: contain;
        /* background-image: url(../../assets/img/team-tablet.jpg) !important; */
    }

    .tablet-left img {
        width: 90%;
    }

    .tablet-right img {
        width: 95%;
        height: auto !important;
    }

    .list-services li a {
        width: 220px !important;
        height: 220px !important;
    }
    .home-client-list img {
        width: 15vw;
        height: auto !important;
    }
}

@media (max-width: 769px) {
    /* .webs-logo { display: none;} */
    .wrapper-logo {
        text-align: center;
    }
    .webs-logo img {
        height: 50px;
        padding: 5px;
    }
    .websg-navbar {
        /* display: none; */
        left: 0;
        width: 99%;
        text-align: center;
        background-color: #00263f;
        padding: 0px;
        margin-top: 0px;
    }
    .websg-navbar li a {
        padding-bottom: 5px;
    }

    .page-titles h2, 
    .landing-services h1, 
    .landing-services h2,
    .serviciosTitle h1   {
        font-size: 28px;
    }
    .page-titles .h3, .page-titles h3,
    .landing-services h3 {
        font-size: 22px;
        color: #fff;
    }

    /* services */
    .websg-page-wrapper-servicios .leftSide {
        color: #00263f;
        background-color: #fff;
        background-image: none;
        height: 49vh;
    }
}

.box-va {
    justify-content: center;
    align-items: center;
    display: flex;
}

@media (max-width: 577px) {
    .profile-box button, .profile-box button:hover, .profile-box button:visited, .profile-box button:link, .profile-box .btn-link {
        border: none;
        background-color: transparent;
        outline: none;
        color: transparent;
    }
    .box-pilares {
        padding-bottom: 0px;
    }

    .blue-buttons .w90 {
        width: 100% !important;
    }

    .mobileP, .mobileP p {
        font-size: 16px !important;
    }
    .mobileP p {
        margin-bottom: 0px;
        padding-bottom: 8px;
    }
    .mobileP p:last-child {
        margin-bottom: 0px;
        padding-bottom: 0px;
    }
    .mobileHeightAuto {
        height: auto;
    }
    .fix-pilar {
        height: 40vh !important;
    }

    .pageTitleMobile h1, .pageTitleMobile h2, .pageTitleMobile h1 strong, .pageTitleMobile h3 {
        font-size: 22px;
    }
    .pageTitleMobile p {
        margin: 0px;
        padding: 0px;
        line-height: 1.2;
        margin-bottom: 10px;
        font-size: 16px;
    }

    .fix-scroll {
        height: 90vh !important;
    }
    .fix-scroll .leftSideDefault, .fix-scroll .leftside-valign {
        height: 45vh !important;
    }
    .fix-scroll .sideH90 {
        height: 95vh !important;
    }
    .mobileHA { height: auto !important;}
    .mobileH50 { height: 44vh !important; display: flex;}
    .hideMobile { display: none; }
    .hideMobile2 { display: none; }
    .showMobile h3 {
        color: #f48530;
        padding-bottom: 20px;
    }
    .mobile-valign {
        justify-content:inherit;
        align-items: normal;
        display: inline-block;
    }
    /* menu options*/
    .webs-open-mobile, .webs-open-mobile:link, .webs-open-mobile:visited, .webs-open-mobile:hover {
        display: inline-block; 
        font-size: 32px;
        color: #fff;
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 900;
    }
    .webs-close-mobile, .webs-close-mobile:link, .webs-close-mobile:visited, .webs-close-mobile:hover {
        display: inline-block; 
        font-size: 32px;
        color: #fff;
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 901;
    }
    .logo-mobile {
        padding: 20px 0;
        display: inline-block;
    }
    .logo-mobile img { height: 10vh; }
    .webs-navbar-mobile {
        margin: 0px;
        padding: 10px 0px;
        list-style-type: none;
    }
    .webs-navbar-mobile li {
        display: block;
        padding: 3px 30px;
        margin-bottom: 0px;
        line-height: 1.1;
    }
    .webs-navbar-mobile li a,
    .webs-navbar-mobile li a:visited,
    .webs-navbar-mobile li a:link,
    .webs-navbar-mobile li a:hover {
        color: #fff;
        font-size: 28px;
        text-decoration: none;
        text-transform: uppercase;
    }
    .webs-navbar-mobile li a:hover { color: #f38330; }

    .webs-logo {
        padding: 5px 0;
    }
    .wrapper-logo { background-color: #00263f; z-index: 900; border-bottom: solid 1px #bbb;} 
    .leftSideDefault { height: 49vh; }
    .spacer, .wrapper-navbar, #logo_white, #logo_regular, #logo_orange, #logo_blue { display: none !important; }
    .spacer-mobile, .showMobile { display: block; }
    .showMobile2 { display: flex; }
    .logo_mobile { display: inline-block; }

    .wrapper-navbar-mobile {
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-color: #00263f;
        z-index: 991;
    }

    .home-product-list {
        margin: 5px 0;
    }
    .home-product-list a img {
        height: 10vh !important;
        width: auto !important
    }
    .home-product-list div {
        text-align: center !important;
        display: inline-block !important;
    }
    .home-product-list div a {
        left: 0 !important;
        top: 0 !important;
    }
    
    .page-titles h2, 
    .landing-services h1,
    .landing-services h2 {
        font-size: 20px;
    }
    .page-titles .h3, .page-titles h3, 
    .landing-services h3 {
        font-size: 18px;
        color: #fff;
    }
    
    .list-services li {
        font-size: 16px;
        margin: 0 0 5px 0;
        font-size: 15px;
    }
    .list-services li a, .list-services li a:hover, .list-services li a:link, .list-services li a:visited {
        width: 164px !important;
        height: 164px !important;
        line-height: 1.1;
        border: solid 6px #f08030 !important;
    }
    .list-services li strong {
        font-size: 14px;
    }
    .home-client-list img {
        width: 15vw;
        height: auto !important;
    }

    /* contact page */
    .list-social-icons li {
        margin-right: 10px;
    }
    .websg-page-wrapper-contact h1 {
        font-size: 22px;
    }
    .websg-form label {
        font-size: 20px;
    }
    .websg-form textarea {
        height: 10vh !important;
    }

    /* servicios */
    .leftSideWrapper {
        padding-top: 0px;
        padding-right: 0px;
    }

    .websg-servicios-btn {
        min-height: auto;
        padding: 5px;
        border-radius: 10 !important;
        margin-bottom: 10px;
    }
    .websg-servicios-btn p {
        font-size: 16px;
        display: inline-block;
    }
    .websg-servicios-btn div { display: none; }

    /* nosotros */
    .nosotrosOrange {
        padding-right: 20px;
        padding-left: 20px;
    }
    .nosotrosOrange p {
        font-size: 20px;
        padding-bottom: 10px;
    }
    

    .scene {
        height: 100px !important;
        width: 95vw;
    }
    .card { margin-top: 10px; }
    .card__face--front img {
        height: 20vh;
        width: auto;
        display: none;
    }
    .card__face--front strong {
        display: block;
        text-transform: uppercase;
        padding: 10px;
        border: solid 1px #fff;
        border-radius: 20px;
    }
    .card__face--back {
        font-size: 15px;
    }
    .card-wrapper {
        padding: 5px 3px;
        line-height: 1.1;
        margin: 0px;
    }
    .box-mision-active .card-wrapper {
        width: 90%;
        padding: 0 25px;
    }

    .bottom-box {
        height: auto;
        padding: 0px;
        font-size: 20px;
    }

    .scene-mision {
        border: solid 1px #fff !important;
    }
    .scene-mision, .box-mision {
        width: 270px !important;
        height: 270px !important;
        border: none !important;
    }

    .profile-box img {
        height: 120px !important;
        width: auto !important;
    }
    .profile-box p, .profile-box strong, .profile-box ul li, .profile-box {
        font-size: 20px;
    }
    .profile-detail {
        border: solid 10px #505968;
        padding: 20px 10px;
        font-size: 18px;
        border-radius: 10px;
        height: auto;
        width: 95%;
    }
    .profile-detail p { font-size:  18px; line-height: 1.1; padding: 0px; margin-bottom: 10px; }

    /* products escorpion */
    .align-bottom {
        height: 45vh;
    }
    .product_1 {
        left: 0;
    }
    .bg-product-2 {
        width: 95%; margin: auto;
        font-size: 19px;
        padding-bottom: 0px;
        margin-bottom: 0px;
    }
    .videoProduct {
        width: 100%;
        height: 315px;
    }
    
    /* frontliner */
    .frontliner-title { left: 0px; }
    .bg-product {
        background-position: bottom center;
    }

    /* diagnostico */
    .sidebar-options{ height: auto; }
    .sidebar-options .fixWidth {
        width: 100%;
    }
    .sidebar-options ul li {
        margin-bottom: 10px;
    }
    .sidebar-options ul li a {
        border: solid 1px #00263f;
    }
    .sidebar-options ul li:last-child { margin-bottom: 0; }
    .sidebar-options ul li a, .sidebar-options ul li a:visited, .sidebar-options ul li a:hover, .sidebar-options ul li a:link,
    .sidebar-options .btn {
        text-transform: uppercase;
        color: #f38330;
        font-weight: 400;
        font-size: 16px; /*22*/
        display: inline-block;
        border-radius: 15px;
        line-height: 1.1;
        border: solid 1px #f38330;
        padding: 3px 2px;
        background-color: transparent;
        text-decoration: none;
    }
    .sidebar-options ul li a:hover, .sidebar-options .btn:hover {
        background-color: #fff;
    }

    .sidebar-options .fixWidth li { width: 100% !important;}
    .sidebar-options .fixWidth li button {
        display: block;
        padding: 10px;
        width: 100%;
    }


    .serviciosTitle h1 {
        padding-bottom: 10px;
    }
    .websg-page-wrapper-servicios p {
        font-size: 18px;
        line-height: 1.1;
    }

    /* capacitaciones */
    .bg-white-big p {
        color: #00263f !important;
        font-size: 20px;
    }
    .serviciosTitleOrange {
        padding: 10px 20px;
    }
    .serviciosTitleOrange p {
        padding-bottom: 10px;
    }
    .serviciosTitleOrange h1 {
        font-size: 24px;
    }
    .serviciosTitleOrange h1 strong {
        padding-top: 10px;
        font-size: 22px;
    }
    .orange-buttons a { font-size: 14px !important; background-image: url(../img/icon_more_30.png) !important; padding: 7px 30px 7px 10px !important; background-position: center right !important; line-height: 1.1; font-weight: normal; height: auto !important;}
    .orange-buttons .w90 {
        width: 100% !important;
        padding: 10px !important;
        background-image: url(../img/icon_more_30.png) !important;
    }
    .ml20 { margin-left: 0px; }

    /* consultoria */
    .blue-buttons a { background-image: url(../img/icon_more_orange_30.png) !important; padding: 7px 30px 7px 10px !important; background-position: center right !important; font-size: 14px !important; line-height: 1.1; font-weight: normal; height: auto !important;}
    .h2Button {
        display: inline-block;
        background-color: transparent;
        color: #00263f;
        margin-bottom: 10px;
        font-weight: 500;
        text-transform: uppercase;
        border-radius: 0;
        padding: 0;
        text-align: center;
        font-size: 22px;
        height: auto !important;
    }

    /* recursos */
    .folder {
        background-size: contain;
        width: 95%;
        height: 30vh;
        /* padding: 80px 10px 0 10px; */
        background-repeat: no-repeat;
        margin-bottom: 20px;
        background-position: center center;
    }
    .folder h2 {
        font-size: 24px;
    }
    .folder p {
        font-size: 20px;
        line-height: 1.1;
    }

    .folder div {
        width: 80%;
        padding-top: 30px;
    }

    /* articulos */
    .h2-orange {
        font-size: 28px;
        height: auto;
        background-color: transparent;
        color: #ef802e;
    }

    .blog-list {
        margin: 0px;
        padding: 20px 0;
        
    }
    .blog-list li {
        padding: 0px;
        padding-bottom: 20px;
        text-align: center;
        list-style: none;
    }
    .blog-list li a, .blog-list li a:hover, .blog-list li a:visited {
        font-size: 28px;
        padding: 10px;
        border: solid 1px #ef802e;
        display: inline-block;
        margin: auto;
        border-radius: 20px;
    }
    .blog-list li a:hover {
        text-decoration: underline;
        color: #ef802e;
    }

    /* galeria */
    .btnPreview {
        width: 100%;
        height: 200px;
    }
    .videoProductThumb {
        width: 100%;
        margin-top: 10px;
        height: 200px;
    }
    .gallery-list {
        text-align: center;
    }

    .gallery-list li, .gallery-list li:first-child {
        display: inline-block;
        width: 100%;
        margin: 0 0 0px 0;
    }
    .gallery-list li a, .gallery-list li a:hover, .gallery-list li a:visited, .gallery-list span {
        width: 100%;
        padding: 10px;
        font-size: 20px;
        height: 70px;
        margin-top: 20px;
    }

    .gallery-list .smallFolder { 
        background-color: #fff;
    }

    .noBg { background-image: none !important; }
    /* producto mobile */
    .productDot, .productDot:hover, .productDot:visited {
        background-color: #f48530;
        color: #fff;
        width: 40px;
        height: 40px;
        position: relative;
        border-radius: 20px;
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        display: inline-block;
        text-decoration: none;
        line-height: 40px;
    }
    span.productDot { position: relative; }

    .product-desc-mobile {
        border: solid 1px #fff;
        padding: 10px;
        border-radius: 10px;
        width: 95%;
        margin: 20px auto;
        font-size: 20px;
        display: none;
        text-align: center;
        line-height: 1.1;
    }

    .product-desc-mobile h3 {
        font-size: 22px;
        line-height: 1.1;
        padding-bottom: 10px;
        margin: 7px 0;
        text-align: center;
        /* display: inline-block;
        margin-left: 10px; */
    }

    /* home equipo */
    .wrapper_thumbs { margin-left: 0px; width: 90%; margin: auto; }
    .wrapper_equipo { background-image: none !important; padding: 0px; text-align: center;}
    .et2, .et3, .et4 { left: 0; top: 0; }
    .equipo_thumb span { padding-right: 0px; }
    .equipo_thumb span img { 
        /* width: 50vw; */
        height: 20vh;
    }

    .bg-escorpion-mobile {
        background-position: bottom center !important;
        background-size: contain !important;
        background-image: url(/gannon/wp-content/themes/webs-gannon/assets/img/escorpion-mobile-portrait.jpg) !important;
        background-color: #365BCD;
    }

    .bg-frontliner-mobile {
        background-position: bottom center !important;
        background-size: cover !important;
        background-image: url(/gannon/wp-content/themes/webs-gannon/assets/img/frontliner-mobile-portrait.jpg) !important;
        background-color: #365BCD;
    }

    .bg-frontliner-mobile_1, .bg-frontliner-mobile_2, .bg-frontliner-mobile_3 {
        background-position: center center !important;
        background-size: cover !important;
    }
    .bg-frontliner-mobile_1 { background-image: url(/gannon/wp-content/themes/webs-gannon/assets/img/frontliner-mobile-1.jpg) !important; }
    .bg-frontliner-mobile_2 { background-image: url(/gannon/wp-content/themes/webs-gannon/assets/img/frontliner-mobile-2.jpg) !important; }
    .bg-frontliner-mobile_3 { background-position: contain; background-position: bottom center ; background-image: url(/gannon/wp-content/themes/webs-gannon/assets/img/frontliner-mobile-3.jpg) !important; }

    /* fix for services white block */
    .fixWhite {
        height: 30vh !important;
    }


    /* fix social bar*/
    .wrapper-social {
        position: relative;
        left: 20px;
    }
    .btn-social {
        /* right: 10px; */
    }

    .box-mision-active {
        width: 300px;
        height: 300px;
    }

    .mobileNoBg { background-image: none !important; }

    .frontliner-text-2, 
    .frontliner-text-3, 
    .frontliner-text-4 {
        width: 98%;
        /* padding-right: 20px;
        padding-left: 230px; */
        padding: 10px 0px;
        line-height: 1.1;
    }
    /* .frontliner-text-3 {
        padding: 10px 20px;
        line-height: 1.2;
    } */
    .frontliner-text-4 { 
        width: 99%;
        padding: 10px 10px;
        line-height: 1.1;
    }
    .productDotF:hover strong {
        display: inline-block;
    }

    .frontliner-text-2, .frontliner-text-2 p,
    .frontliner-text-3, .frontliner-text-3 p ,
    .frontliner-text-4, .frontliner-text-4 p  {
        font-size:15px;
        margin-bottom: 0px;
        padding-bottom: 10px;
    }

    .frontliner-text-2:last-child ,
    .frontliner-text-3:last-child  ,
    .frontliner-text-4:last-child {
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

    .productDotF strong {
        position: absolute;
        display: none;
        line-height: 1.1;
        font-weight: normal;
        width: 120px;
        text-shadow: 1px 2px #333;
    }

    /* home */
    .line_products li img {
        width: 15vw;
    }

    .box-right-sidebar {
        width: 100%;
    }

    .home-servicios-wrapper {
        width: 95%;
        margin: auto;
    }

}

@media (max-width: 390px) {
    .pageTitleMobile h1 {
        font-size: 22px;
    }
    .websg-form textarea {
        height: 8vh !important;
    }

    .leftSideWrapper {
        padding-top: 0px;
        padding-right: 0px;        
    }

    .equipo_thumb p {
        font-size: 16px;
        line-height: 1.2;
    }
    .equipo_thumb strong { 
        font-size: 18px;
    }
    .equipo_thumb {
        margin-top: 25px;
        margin-bottom: 0px;
    }
    .equipo_thumb img {
        margin-bottom: 10px;
    }
}