﻿/* MODIFICACIONES DE STYLE.css */

@font-face {
    font-family: raleway-black;
    src: url(~/Content/fonts/Raleway/static/Raleway-Black.ttf);
}

.font-raleway-black {
    font-family: raleway-black !important;
}

.letraPequena {
    font-size: 12px !important;
}

.letraMasPequena {
    font-size: 10px !important;
}

/* Estilos base para el header */
.header__area {
    background-color: transparent; /* Fondo transparente por defecto */
    transition: all 0.4s ease-in-out; /* Transición suave */
}

    .header__area .logo img {
        transition: all 0.4s ease-in-out; /* Transición para el logo */
    }

    .header__area .header__sidebar__right > li a {
        color: #333; /* Color de íconos por defecto */
        transition: all 0.4s ease-in-out; /* Transición suave */
    }

    /* Estilos cuando el header es sticky */
    .header__area.sticky__header.is-sticky {
        background-color: rgb(12, 61, 91); /* Fondo azul oscuro cuando es sticky */
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Sombra ligera */
    }

        .header__area.sticky__header.is-sticky .logo img {
            content: url("/Content/assets/css/images/logo/logo_sehs_blanco.png"); /* Cambia al logo blanco */
        }

        .header__area.sticky__header.is-sticky .header__sidebar__right > li a {
            color: #fff; /* Íconos blancos cuando es sticky */
        }


/* Background Image */
.bg-image--1 {
    background-image: url('images/banners/BANNER_SUSCRIPCION.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--2 {
    background-image: url('images/banners/BANNER2.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--3 {
    background-image: url('images/banners/BANNER3.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--4 {
    background-image: url('images/banners/BANNER4.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--5 {
    background-image: url('images/banners/BANNER5.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--6 {
    background-image: url('images/banners/BANNER6.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--7 {
    background-image: url('images/banners/BANNER7.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--8 {
    background-image: url('images/banners/BANNER8.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.bg-image--9 {
    background-image: url('images/banners/BANNER9.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.btn-primary {
    /*background-color: rgba(0, 123, 131, 1) !important;*/ /* color principal del sehs */
    background-color: rgba(10, 61, 92, 1) !important; /* color principal del sehs */
    color: white !important;
}

    .btn-primary:hover {
        background-color: rgba(10, 61, 92, 0.9) !important; /* color principal del sehs */
        color: white !important;
    }

a.bg-primary:hover, a.bg-primary:focus, button.bg-primary:hover, button.bg-primary:focus {
    /*background-color: rgba(0, 123, 131, 0.8) !important;*/
    background-color: rgba(10, 61, 92, 0.8) !important;
}


.btn-secondary {
    background-color: rgba(255, 255, 255, 1) !important; /*color secundario del sehs */
    color: black !important;
    /*background-color: rgba(185, 25, 24, 1) !important;  color secundario del sehs */
}

    .btn-secondary:hover {
        background-color: rgba(138, 140, 141, 1) !important; /*color secundario del sehs */
        color: white !important;
        /*background-color: rgba(185, 25, 24, 1) !important;  color secundario del sehs */
    }

.text-primary {
    /*color: rgba(0, 123, 131, 0.9) !important;*/
    color: rgba(10, 61, 92, 0.9) !important;
}

.text-secondary {
    /*color: #2A4C81 !important;*/
    color: rgba(138, 140, 141, 1) !important;
}

.bg-primary {
    /*background-color: rgba(0, 123, 131, 1) !important;*/ /* color principal del sehs */
    background-color: rgba(10, 61, 92, 1) !important; /* color principal del sehs */
}

.bg-secondary {
    background-color: rgba(138, 140, 141, 1) !important; /* color secundario del sehs */
    /*background-color: rgba(185, 25, 24, 1) !important;*/ /* color secundario del sehs */
}

.text-warning-dark {
    color: #f80 !important;
}

    .text-warning-dark:hover {
        color: #f80 !important;
    }


a#scrollUp {
    /*background: rgba(0, 123, 131, 0.9);*/
    background: rgba(10, 61, 92, 0.9);
    color: #fff;
    bottom: 110px;
    right: 35px !important;
    border-radius: 100px;
    height: 45px;
    width: 45px;
    font-size: 25px;
    text-align: center;
    padding: 9px 0;
    box-shadow: 0 0 15px 0px rgba(50, 50, 50, 0.2);
    transition: 0.3s;
    z-index: 1020 !important;
}

    a#scrollUp:hover {
        background: #fb3;
        color: #000;
    }


.brown--color .social__net.social__net--2 li a:hover {
    /*border-color: rgba(0, 123, 131, 0.9);*/
    border-color: rgba(10, 61, 92, 0.9);
    /*color: rgba(0, 123, 131, 0.9);*/
    color: rgba(10, 61, 92, 0.9);
}

/*.header__area .header__sidebar__right > li.shopcart > a span.product_qun {
    background: #ce7852 none repeat scroll 0 0;
    border-radius: 100px;
    color: #fff;
    display: block;
    font-size: 9px;
    font-weight: 400;
    height: 17px;
    line-height: 17px;
    margin: -8px 0 0;
    min-width: auto;
    overflow: visible;
    padding: 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 44%;
    width: 16px;
}*/

@media only screen and (max-width: 990px) {
    .carousel_mobile {
        padding-top: 80px !important;
    }
}



@media (min-width: 200px) {
    .m-xs-0 {
        margin: 0 !important;
    }

    .mt-xs-0,
    .my-xs-0 {
        margin-top: 0 !important;
    }

    .mr-xs-0,
    .mx-xs-0 {
        margin-right: 0 !important;
    }

    .mb-xs-0,
    .my-xs-0 {
        margin-bottom: 0 !important;
    }

    .ml-xs-0,
    .mx-xs-0 {
        margin-left: 0 !important;
    }

    .m-xs-1 {
        margin: 0.25rem !important;
    }

    .mt-xs-1,
    .my-xs-1 {
        margin-top: 0.25rem !important;
    }

    .mr-xs-1,
    .mx-xs-1 {
        margin-right: 0.25rem !important;
    }

    .mb-xs-1,
    .my-xs-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-xs-1,
    .mx-xs-1 {
        margin-left: 0.25rem !important;
    }

    .m-xs-2 {
        margin: 0.5rem !important;
    }

    .mt-xs-2,
    .my-xs-2 {
        margin-top: 0.5rem !important;
    }

    .mr-xs-2,
    .mx-xs-2 {
        margin-right: 0.5rem !important;
    }

    .mb-xs-2,
    .my-xs-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-xs-2,
    .mx-xs-2 {
        margin-left: 0.5rem !important;
    }

    .m-xs-3 {
        margin: 1rem !important;
    }

    .mt-xs-3,
    .my-xs-3 {
        margin-top: 1rem !important;
    }

    .mr-xs-3,
    .mx-xs-3 {
        margin-right: 1rem !important;
    }

    .mb-xs-3,
    .my-xs-3 {
        margin-bottom: 1rem !important;
    }

    .ml-xs-3,
    .mx-xs-3 {
        margin-left: 1rem !important;
    }

    .m-xs-4 {
        margin: 1.5rem !important;
    }

    .mt-xs-4,
    .my-xs-4 {
        margin-top: 1.5rem !important;
    }

    .mr-xs-4,
    .mx-xs-4 {
        margin-right: 1.5rem !important;
    }

    .mb-xs-4,
    .my-xs-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-xs-4,
    .mx-xs-4 {
        margin-left: 1.5rem !important;
    }

    .m-xs-5 {
        margin: 3rem !important;
    }

    .mt-xs-5,
    .my-xs-5 {
        margin-top: 3rem !important;
    }

    .mr-xs-5,
    .mx-xs-5 {
        margin-right: 3rem !important;
    }

    .mb-xs-5,
    .my-xs-5 {
        margin-bottom: 3rem !important;
    }

    .ml-xs-5,
    .mx-xs-5 {
        margin-left: 3rem !important;
    }

    .p-xs-0 {
        padding: 0 !important;
    }

    .pt-xs-0,
    .py-xs-0 {
        padding-top: 0 !important;
    }

    .pr-xs-0,
    .px-xs-0 {
        padding-right: 0 !important;
    }

    .pb-xs-0,
    .py-xs-0 {
        padding-bottom: 0 !important;
    }

    .pl-xs-0,
    .px-xs-0 {
        padding-left: 0 !important;
    }

    .p-xs-1 {
        padding: 0.25rem !important;
    }

    .pt-xs-1,
    .py-xs-1 {
        padding-top: 0.25rem !important;
    }

    .pr-xs-1,
    .px-xs-1 {
        padding-right: 0.25rem !important;
    }

    .pb-xs-1,
    .py-xs-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-xs-1,
    .px-xs-1 {
        padding-left: 0.25rem !important;
    }

    .p-xs-2 {
        padding: 0.5rem !important;
    }

    .pt-xs-2,
    .py-xs-2 {
        padding-top: 0.5rem !important;
    }

    .pr-xs-2,
    .px-xs-2 {
        padding-right: 0.5rem !important;
    }

    .pb-xs-2,
    .py-xs-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-xs-2,
    .px-xs-2 {
        padding-left: 0.5rem !important;
    }

    .p-xs-3 {
        padding: 1rem !important;
    }

    .pt-xs-3,
    .py-xs-3 {
        padding-top: 1rem !important;
    }

    .pr-xs-3,
    .px-xs-3 {
        padding-right: 1rem !important;
    }

    .pb-xs-3,
    .py-xs-3 {
        padding-bottom: 1rem !important;
    }

    .pl-xs-3,
    .px-xs-3 {
        padding-left: 1rem !important;
    }

    .p-xs-4 {
        padding: 1.5rem !important;
    }

    .pt-xs-4,
    .py-xs-4 {
        padding-top: 1.5rem !important;
    }

    .pr-xs-4,
    .px-xs-4 {
        padding-right: 1.5rem !important;
    }

    .pb-xs-4,
    .py-xs-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-xs-4,
    .px-xs-4 {
        padding-left: 1.5rem !important;
    }

    .p-xs-5 {
        padding: 3rem !important;
    }

    .pt-xs-5,
    .py-xs-5 {
        padding-top: 3rem !important;
    }

    .pr-xs-5,
    .px-xs-5 {
        padding-right: 3rem !important;
    }

    .pb-xs-5,
    .py-xs-5 {
        padding-bottom: 3rem !important;
    }

    .pl-xs-5,
    .px-xs-5 {
        padding-left: 3rem !important;
    }

    .m-xs-n1 {
        margin: -0.25rem !important;
    }

    .mt-xs-n1,
    .my-xs-n1 {
        margin-top: -0.25rem !important;
    }

    .mr-xs-n1,
    .mx-xs-n1 {
        margin-right: -0.25rem !important;
    }

    .mb-xs-n1,
    .my-xs-n1 {
        margin-bottom: -0.25rem !important;
    }

    .ml-xs-n1,
    .mx-xs-n1 {
        margin-left: -0.25rem !important;
    }

    .m-xs-n2 {
        margin: -0.5rem !important;
    }

    .mt-xs-n2,
    .my-xs-n2 {
        margin-top: -0.5rem !important;
    }

    .mr-xs-n2,
    .mx-xs-n2 {
        margin-right: -0.5rem !important;
    }

    .mb-xs-n2,
    .my-xs-n2 {
        margin-bottom: -0.5rem !important;
    }

    .ml-xs-n2,
    .mx-xs-n2 {
        margin-left: -0.5rem !important;
    }

    .m-xs-n3 {
        margin: -1rem !important;
    }

    .mt-xs-n3,
    .my-xs-n3 {
        margin-top: -1rem !important;
    }

    .mr-xs-n3,
    .mx-xs-n3 {
        margin-right: -1rem !important;
    }

    .mb-xs-n3,
    .my-xs-n3 {
        margin-bottom: -1rem !important;
    }

    .ml-xs-n3,
    .mx-xs-n3 {
        margin-left: -1rem !important;
    }

    .m-xs-n4 {
        margin: -1.5rem !important;
    }

    .mt-xs-n4,
    .my-xs-n4 {
        margin-top: -1.5rem !important;
    }

    .mr-xs-n4,
    .mx-xs-n4 {
        margin-right: -1.5rem !important;
    }

    .mb-xs-n4,
    .my-xs-n4 {
        margin-bottom: -1.5rem !important;
    }

    .ml-xs-n4,
    .mx-xs-n4 {
        margin-left: -1.5rem !important;
    }

    .m-xs-n5 {
        margin: -3rem !important;
    }

    .mt-xs-n5,
    .my-xs-n5 {
        margin-top: -3rem !important;
    }

    .mr-xs-n5,
    .mx-xs-n5 {
        margin-right: -3rem !important;
    }

    .mb-xs-n5,
    .my-xs-n5 {
        margin-bottom: -3rem !important;
    }

    .ml-xs-n5,
    .mx-xs-n5 {
        margin-left: -3rem !important;
    }

    .m-xs-auto {
        margin: auto !important;
    }

    .mt-xs-auto,
    .my-xs-auto {
        margin-top: auto !important;
    }

    .mr-xs-auto,
    .mx-xs-auto {
        margin-right: auto !important;
    }

    .mb-xs-auto,
    .my-xs-auto {
        margin-bottom: auto !important;
    }

    .ml-xs-auto,
    .mx-xs-auto {
        margin-left: auto !important;
    }
}

@media (min-width: 200px) {
    .text-xs-left {
        text-align: left !important;
    }

    .text-xs-right {
        text-align: right !important;
    }

    .text-xs-center {
        text-align: center !important;
    }
}

/* OTRAS MODIFICACIONES */

.TextoVisible {
    color: white;
    width: 200px;
    height: 65px;
    position: fixed;
    top: 40%;
    left: 50%;
    margin-top: -32px;
    margin-left: -32px;
    border-radius: 50%;
    z-index: 2
}

.cajaTexto {
    /* IMPORTANTE */
    width: 200px !important;
    margin: 0 auto !important;
}

.cargando {
    display: inline-block;
    color: #ffffff;
    position: relative;
    overflow: hidden;
    z-index: 1;
    border-radius: 50%;
    cursor: pointer;
    vertical-align: middle;
}

.positionCargando {
    position: fixed;
    right: 0rem;
    top: 0rem;
    left: 0rem;
    bottom: 0rem;
    z-index: 2147483647;
    background-color: rgba(0,0,0,0.3) !important;
}

.espacioBody {
    padding-top: 8em;
    padding-bottom: 4em;
}

img.zoom {
    /*  width: 350px;
    height: 200px;*/
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
}

.transition {
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
}

.presionar {
    cursor: pointer !important;
}

.infoButton {
    animation-duration: 3s;
    animation-name: slidein;
}

@keyframes slidein {
    from {
        margin-right: 70%;
        width: 200%;
    }

    75% {
        font-size: 150%;
        margin-right: 25%;
        width: 150%;
    }

    to {
        margin-right: 0%;
        width: 100%;
    }
}

.iframe-modal {
    width: 100%;
    height: calc(100vw / 3);
}

a {
    color: #143c64;
}



.header__absolute {
    left: 0;
    position: absolute;
    right: 0;
    top: 0px;
    z-index: 9;
}

/*.header__area .header__sidebar__right {
    height: 90px;
    list-style: outside none none;
    position: relative;
    z-index: 9;
}*/
