/* 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; }
.size14 { font-size: 14px !important; }
.size15 { font-size: 15px !important; }
.size16 { font-size: 16px !important; }
.size18 { font-size: 18px !important; }
.size20 { font-size: 20px !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 { z-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%;
}