﻿/* Hoja de estilos de Indicus a modo de helper para apoyar los estilos genéricos de Bootstrap */
/* Son estilos genéricos utilizables en cualquier proyecto, no añadir estilos propios de este proyecto */


/******************************************************************************************/
/************************************WEIGHT FUENTE*****************************************/
/******************************************************************************************/
.fw-light {
    font-weight: 300;
}

.fw-normal {
    font-weight: normal;
}

.fw-regular {
    font-weight: 500;
}

.fw-bold {
    font-weight: bold;
}

.fw-bolder {
    font-weight: 900;
}



/******************************************************************************************/
/************************************TAMAÑOS FUENTE****************************************/
/******************************************************************************************/
.size8 {
    font-size: 8px !important;
}

.size9 {
    font-size: 9px !important;
}

.size10 {
    font-size: 10px !important;
}

.size11 {
    font-size: 11px !important;
}

.size12 {
    font-size: 12px !important;
}

.size13 {
    font-size: 13px !important;
}

.size14 {
    font-size: 14px !important;
}

.size15 {
    font-size: 15px !important;
}

.size16 {
    font-size: 16px !important;
}

.size18 {
    font-size: 18px !important;
}

.size19 {
    font-size: 19px !important;
}

.size20 {
    font-size: 20px !important;
}

.size21 {
    font-size: 21px !important;
}

.size22 {
    font-size: 22px !important;
}

.size24 {
    font-size: 24px !important;
}

.size25 {
    font-size: 25px !important;
}


.size30 {
    font-size: 30px !important;
}

.size35 {
    font-size: 35px !important;
}

.size40 {
    font-size: 40px !important;
}

.size45 {
    font-size: 45px !important;
}

.size50 {
    font-size: 50px !important;
}

.size55 {
    font-size: 55px !important;
}

.size60 {
    font-size: 60px !important;
}

.size65 {
    font-size: 66px !important;
}

.size70 {
    font-size: 70px !important;
}


/******************************************************************************************/
/***************************************ANCHOS*********************************************/
/******************************************************************************************/
.w10 {
    width: 10px;
}

.w15 {
    width: 15px;
}

.w20 {
    width: 20px;
}

.w25 {
    width: 25px;
}

.w30 {
    width: 30px;
}

.w40 {
    width: 40px;
}

.w50 {
    width: 50px;
}

.w60 {
    width: 60px;
}

.w70 {
    width: 70px;
}

.w75 {
    width: 75px;
}

.w80 {
    width: 80px;
}

.w90 {
    width: 90px;
}

.w100 {
    width: 100px;
}

.w125 {
    width: 125px;
}

.w150 {
    width: 150px;
}

.w175 {
    width: 175px;
}

.w200 {
    width: 200px;
}

.w225 {
    width: 225px;
}

.w250 {
    width: 250px;
}

.w275 {
    width: 275px;
}

.w300 {
    width: 300px;
}

.w325 {
    width: 325px;
}

.w350 {
    width: 350px;
}

.w375 {
    width: 375px;
}

.w400 {
    width: 400px;
}

.w425 {
    width: 425px;
}

.w450 {
    width: 450px;
}

.w475 {
    width: 475px;
}

.w500 {
    width: 500px;
}

.w525 {
    width: 525px;
}

.w550 {
    width: 550px;
}

.w575 {
    width: 575px;
}

.w600 {
    width: 600px;
}

.w5pct {
    width: 5% !important;
}

.w10pct {
    width: 10% !important;
}

.w15pct {
    width: 15% !important;
}

.w20pct {
    width: 20% !important;
}

.w25pct {
    width: 25% !important;
}

.w30pct {
    width: 30% !important;
}

.w35pct {
    width: 35% !important;
}

.w40pct {
    width: 40% !important;
}

.w45pct {
    width: 45% !important;
}

.w50pct {
    width: 50% !important;
}

.w55pct {
    width: 55% !important;
}

.w60pct {
    width: 60% !important;
}

.w65pct {
    width: 65% !important;
}

.w70pct {
    width: 70% !important;
}

.w75pct {
    width: 75% !important;
}

.w80pct {
    width: 80% !important;
}

.w85pct {
    width: 85% !important;
}

.w90pct {
    width: 90% !important;
}

.w95pct {
    width: 95% !important;
}

.w100pct {
    width: 100% !important;
}



/******************************************************************************************/
/***************************************ALTOS**********************************************/
/******************************************************************************************/
.h20 {
    height: 20px;
}

.h25 {
    height: 25px;
}

.h30 {
    height: 30px;
}

.h40 {
    height: 40px;
}

.h50 {
    height: 50px;
}

.h60 {
    height: 60px;
}

.h70 {
    height: 70px;
}

.h75 {
    height: 75px;
}

.h80 {
    height: 80px;
}

.h90 {
    height: 90px;
}

.h100 {
    height: 100px;
}

.h125 {
    height: 125px;
}

.h150 {
    height: 150px;
}

.h175 {
    height: 175px;
}

.h200 {
    height: 200px;
}

.h225 {
    height: 225px;
}

.h250 {
    height: 250px;
}

.h275 {
    height: 275px;
}

.h300 {
    height: 300px;
}

.h325 {
    height: 325px;
}

.h350 {
    height: 350px;
}

.h375 {
    height: 375px;
}

.h400 {
    height: 400px;
}




/******************************************************************************************/
/***********************************ANCHO MÁXIMO*******************************************/
/******************************************************************************************/
.maxw50 {
    width: 100%;
    max-width: 50px;
}

.maxw75 {
    width: 100%;
    max-width: 75px;
}

.maxw100 {
    width: 100%;
    max-width: 100px;
}

.maxw125 {
    width: 100%;
    max-width: 125px;
}

.maxw150 {
    width: 100%;
    max-width: 150px;
}

.maxw175 {
    width: 100%;
    max-width: 175px;
}

.maxw200 {
    width: 100%;
    max-width: 200px;
}

.maxw225 {
    width: 100%;
    max-width: 225px;
}

.maxw250 {
    width: 100%;
    max-width: 250px;
}

.maxw275 {
    width: 100%;
    max-width: 275px;
}

.maxw300 {
    width: 100%;
    max-width: 300px;
}

.maxw350 {
    width: 100%;
    max-width: 350px;
}

.maxw400 {
    width: 100%;
    max-width: 400px;
}

.maxw450 {
    width: 100%;
    max-width: 450px;
}

.maxw500 {
    width: 100%;
    max-width: 500px;
}

.maxw550 {
    width: 100%;
    max-width: 550px;
}

.maxw600 {
    width: 100%;
    max-width: 600px;
}

.maxw650 {
    width: 100%;
    max-width: 650px;
}

.maxw700 {
    width: 100%;
    max-width: 700px;
}

.maxw750 {
    width: 100%;
    max-width: 750px;
}

.maxw800 {
    width: 100%;
    max-width: 800px;
}

.maxw850 {
    width: 100%;
    max-width: 850px;
}




/******************************************************************************************/
/***********************************ANCHO MÍNIMO*******************************************/
/******************************************************************************************/
.minw25 {
    min-width: 25px;
}

.minw50 {
    min-width: 50px;
}

.minw75 {
    min-width: 75px;
}

.minw100 {
    min-width: 100px;
}

.minw125 {
    min-width: 125px;
}

.minw150 {
    min-width: 150px;
}

.minw175 {
    min-width: 175px;
}

.minw200 {
    min-width: 200px;
}

.minw225 {
    min-width: 225px;
}

.minw250 {
    min-width: 250px;
}

.minw275 {
    min-width: 275px;
}

.minw300 {
    min-width: 300px;
}

.minw325 {
    min-width: 325px;
}

.minw350 {
    min-width: 350px;
}

.minw375 {
    min-width: 375px;
}

.minw400 {
    min-width: 400px;
}

.minw425 {
    min-width: 425px;
}

.minw450 {
    min-width: 450px;
}

.minw475 {
    min-width: 475px;
}

.minw500 {
    min-width: 500px;
}

.minw525 {
    min-width: 525px;
}

.minw550 {
    min-width: 550px;
}

.minw575 {
    min-width: 575px;
}

.minw600 {
    min-width: 600px;
}




/******************************************************************************************/
/***********************************PADDING BOTTOM*****************************************/
/******************************************************************************************/
.pb2 {
    padding-bottom: 2px
}

.pb3 {
    padding-bottom: 3px
}

.pb5 {
    padding-bottom: 5px
}

.pb10 {
    padding-bottom: 10px
}

.pb15 {
    padding-bottom: 15px
}




/******************************************************************************************/
/******************************************Z-INDEX*****************************************/
/******************************************************************************************/
.z10 {
    z-index: 10;
}

.z20 {
    z-index: 20;
}

.z30 {
    z-index: 30;
}

.z40 {
    z-index: 40;
}

.z50 {
    z-index: 50;
}

.z100 {
    z-index: 100;
}

.z200 {
    z-index: 200;
}

.z300 {
    z-index: 300;
}

.z400 {
    z-index: 400;
}

.z500 {
    z-index: 500;
}

.z1000 {
    z-index: 6000;
}

.z2000 {
    z-index: 2000;
}

.z3000 {
    z-index: 3000;
}

.z4000 {
    z-index: 4000;
}

.z5000 {
    z-index: 5000;
}

.z10000 {
    z-index: 10000;
}

.zztop {
    hz-index: 99999;
}



/******************************************************************************************/
/**************************************POINTER EVENTS**************************************/
/******************************************************************************************/
.pointer-events-all {
    pointer-events: all;
}

.pointer-events-none {
    pointer-events: none;
}





/******************************************************************************************/
/********************************************LINKS*****************************************/
/******************************************************************************************/
.nolink, .nolink:hover, .nolink:visited, .nolink:focus {
    text-decoration: none;
}

.link-from-center, .link-from-center:hover {
    position: relative;
    color: inherit;
    text-decoration: none !important;
    display: inline-block;
}

    .link-from-center::before {
        content: "";
        position: absolute;
        z-index: 2;
        bottom: -1px; /* Ajustar según el grosor deseado */
        left: 50%;
        width: 0;
        height: 1px; /* Ajustar según el grosor deseado */
        background-color: currentColor;
        transition: width 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, left 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        t_ransform: translateX(-50%);
    }

    .link-from-center:hover::before {
        width: 100%;
        left: 0;
    }






/******************************************************************************************/
/******************************FONDOS COLORES GENÉRICOS************************************/
/******************************************************************************************/
.fondoBlanco {
    background-color: #fff;
}

.fondoNegro50pct {
    background-color: rgba(0,0,0,.5);
}

.fondoNegro75pct {
    background-color: rgba(0,0,0,.75);
}

.fondoTransparente {
    background-color: transparent;
}

.fondoGrisF5 {
    background-color: #f5f5f5;
}




/******************************************************************************************/
/*******************************TEXTO COLORES GENÉRICOS************************************/
/******************************************************************************************/
.colorNegro {
    color: #000;
}

.colorBlanco {
    color: #FFF;
}

.colorGris3 {
    color: #333;
}

.colorGris5 {
    color: #555;
}

.colorGris6 {
    color: #666;
}

.colorGris7 {
    color: #777;
}

.colorGris8 {
    color: #888;
}

.colorGris9 {
    color: #999;
}

.colorGrisA {
    color: #AAA;
}

.colorGrisB {
    color: #BBB;
}

.colorGrisC {
    color: #CCC;
}

.colorGrisD {
    color: #DDD;
}

.colorGrisE {
    color: #EEE;
}

.colorGrisF5 {
    color: #F5F5F5;
}




/******************************************************************************************/
/******************************************BORDES******************************************/
/******************************************************************************************/
.b-1-c {
    border: solid 1px #cccccc;
}

.b-1-e {
    border: solid 1px #eeeeee;
}




/******************************************************************************************/
/**********************************LAYAOUT POR BLOQUES*************************************/
/******************************************************************************************/
/* Layout por bloques de 25% del container */
.row-blocks {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-right: -15px;
    margin-left: -15px;
}

.block25pct {
    display: inline-block;
    width: 100%;
    max-width: 267px;
    padding-left: 15px;
    padding-right: 15px;
}

.block50pct {
    display: inline-block;
    width: 100%;
    max-width: 534px;
    padding-left: 15px;
    padding-right: 15px;
}

.block75pct {
    display: inline-block;
    width: 100%;
    max-width: 801px;
    padding-left: 15px;
    padding-right: 15px;
}

.block100pct {
    display: inline-block;
    width: 100%;
    max-width: 1068px;
    padding-left: 15px;
    padding-right: 15px;
}



/******************************************************************************************/
/****************************************MEGA DROPDOWN*************************************/
/******************************************************************************************/
.menu-large {
    position: static !important;
}

.megamenu {
    padding: 20px 0px;
    width: 100%;
}

    .megamenu > li > ul {
        padding: 0;
        margin: 0;
    }

        .megamenu > li > ul > li {
            list-style: none;
        }

            .megamenu > li > ul > li > a {
                display: block;
                padding: 3px 20px;
                clear: both;
                font-weight: normal;
                line-height: 1.428571429;
                color: #333333;
                white-space: normal;
            }

    .megamenu > li ul > li > a:hover,
    .megamenu > li ul > li > a:focus {
        text-decoration: none;
        color: #262626;
        background-color: #f5f5f5;
    }

    .megamenu.disabled > a,
    .megamenu.disabled > a:hover,
    .megamenu.disabled > a:focus {
        color: #999999;
    }

        .megamenu.disabled > a:hover,
        .megamenu.disabled > a:focus {
            text-decoration: none;
            background-color: transparent;
            background-image: none;
            filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
            cursor: not-allowed;
        }

    .megamenu.dropdown-header {
        color: #428bca;
        font-size: 18px;
    }

@media (max-width: 768px) {
    .megamenu {
        margin-left: 0;
        margin-right: 0;
    }

        .megamenu > li {
            margin-bottom: 30px;
        }

            .megamenu > li:last-child {
                margin-bottom: 0;
            }

        .megamenu.dropdown-header {
            padding: 3px 15px !important;
        }
}




/******************************************************************************************/
/****************************************NAVBAR*************************************/
/******************************************************************************************/
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    color: #00A7E8;
}

@media (max-width: 768px) {
    .navbar-nav .open .dropdown-menu .dropdown-header {
        color: #fff;
    }
}


/* Videos responsive vimeo youtube, poner el iframe dentro de un div con class video-container*/
.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* Proporción 16:9 (dividir el alto por el ancho y multiplicar por 100) */
    flex: 1 1 auto;
}

    .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }



/******************************************************************************************/
/***************************************CARGANDO*******************************************/
/******************************************************************************************/
#materialLoading {
    font-family: roboto;
    color: #222;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: table;
    z-index: 9999;
}

#materialLoadingCentered {
    display: table-cell;
    vertical-align: middle;
    padding: 20px;
}

#materialLoadingContent {
    text-align: center;
}

    #materialLoadingContent .spinner-container {
        background-color: #FFFFFF;
        text-align: center;
        border-radius: 7px;
        padding: 40px 20px;
    }

        #materialLoadingContent .spinner-container .texto {
            padding-top: 10px;
            font-size: 16px;
            font-weight: bold;
        }

        #materialLoadingContent .spinner-container .spinner-border {
            text-align: center;
            color: #1584F2;
            width: 3rem;
            height: 3rem;
        }

#materialLoading.hide {
    opacity: 0;
    transition: opacity 0.2s ease-out;
    pointer-events: none;
}

    #materialLoading.hide #materialLoadingCentered {
        transform: scale(0.8);
        transition: transform 0.2s ease-out;
    }

#materialLoading.show {
    opacity: 1;
    transition: opacity 0.2s ease-in;
}

    #materialLoading.show #materialLoadingCentered {
        transform: scale(1);
        transition: transform 0.2s ease-in;
    }



