@charset "UTF-8";
/***!  /media/templates/site/cassiopeia/css/user.css?775456  !***/

/* ajustes visuales de la cabecera, incluido la barra de menú*/
.container-header {
    position: relative;
    z-index: 10;
    margin-bottom: 20px;
    background-color: #FFFFFF;
    background-image: none;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.03) inset;
}

/*usamos un color en el body diferente del blanco*/
/*body{background-color: #E1D9CD;}*/
/*body{background-color: #EBE6DE;}*/

/*centramos todos los elementos del menú superior y el footer (menos el logo)*/
body.wrapper-fluid header>.grid-child, body.wrapper-fluid footer>.grid-child{
    justify-content: center;
}

/*centramos el logotipo*/
.navbar-brand{
    width:100%;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
}

/*ajustamos el tamaño de letra del menú superior*/
.metismenu.mod-menu .metismenu-item>a{font-size: 16px !important;}

/*ponemos estilo al menú superior*/
.container-nav{
    background-color: #262626;
    color: #fff;
}

/*ponemos el sticky solo al menú*/


/*ajustamos estilos al submenú del menú superior*/
.metismenu.mod-menu .metismenu-item{background-color: #262626;}
.metismenu.mod-menu .metismenu-item>a{color:#ffffff;}

/*ajustamos tamaño del texto del breadcrumbs*/
.mod-breadcrumbs__wrapper ol li{font-size: 16px !important;}
.mod-breadcrumbs__wrapper ol li a{font-size: 16px !important;font-weight: bold;}

/*ponemos estilo al footer*/
.footer{
    background-color: #2d2d2d;
    background-image: none;
}

/*aumentamos el tamaño de los textos del body*/
body p {font-size: 20px;}
body ul {font-size: 20px;}
body ul li {font-size: 20px;}
body ul li a {font-size: 20px;}
body ol {font-size: 20px;}
body ol li {font-size: 20px;}
body ol li a {font-size: 20px;}

/*ponemos color a los enlaces de texto*/
a{color: #C87631;text-decoration: none !important;}
a:hover{color: #E77F2E;text-decoration: underline !important;}


/*estilos css para los tabs verticales COMBO*/
.tabs-container {
    display: flex;
    max-width: 100%;
    border-radius: 8px;
    overflow: hidden;
    color: #333;
}
.tabs {
    display: flex;
    flex-direction: column;
    padding: 20px;
    min-width: 250px;
}
.tab-button {
    background: #C67838;
    color: #FFF;
    padding: 12px 16px;
    border: none;
    text-align: left;
    cursor: pointer;
    font-size: 18px;
    width:100%;
    border-radius: 6px;
    margin-bottom: 10px;
}
.tab-button.active,
.tab-button:hover {
    background: #EA7C22;
    color: #fff;
    font-weight: bold;
}
.tab-content-container {
    flex-grow: 1;
    padding: 30px;
    width: 100%;
}
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
}

/*estilos css para los tabs verticales COMBO de la Escuela */
.tabs-container-escuela {
    display: flex;
    max-width: 100%;
    border-radius: 8px;
    overflow: hidden;
    color: #333;
}
.tabs-escuela {
    display: flex;
    flex-direction: column;
    padding: 20px;
    min-width: 250px;
}
.tab-button-escuela {
    background: #2A3939;
    color: #FFF;
    padding: 12px 16px;
    border: none;
    text-align: left;
    cursor: pointer;
    font-size: 18px;
    width:100%;
    border-radius: 6px;
    margin-bottom: 10px;
}
.tab-button-escuela.active,
.tab-button-escuela:hover {
    background: #5C8B7D;
    color: #fff;
    font-weight: bold;
}
.tab-content-container-escuela {
    flex-grow: 1;
    padding: 30px;
    width: 100%;
}
.tab-content-escuela {
    display: none;
}
.tab-content-escuela.active {
    display: block;
}

/*
.mod-breadcrumbs__item a{color:#333333;}


.sppb-panel-title {
    font-size: 18px !important;
}

.metismenu.mod-menu .metismenu-item {
    padding: 0.5em 0.8em !important;
    color: #ffffff;
    background-color: #000000;
}
.metismenu.mod-menu .metismenu-item:hover {
    padding: 0.5em 0.8em !important;
    color: #ffffff;
    text-decoration: underline;
}

.metismenu.mod-menu .metismenu-item a{
    color: #ffffff;
    font-weight: normal;
}
.metismenu.mod-menu .metismenu-item a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.container-header .navbar-brand {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 5px;
    padding-bottom: 0;
}

.container-header .grid-child {
    padding-top: 0.2mm !important;
}

.container-header .container-nav {
    padding-bottom: 0.5em;
    border-bottom: #eeeeee 1px solid;
}

.listado_inicio_h4 h4{
	font-size: 1.2rem;
	font-weight: 300 !important;
	text-align: left !important;
}
.listado_inicio_h4 h4 i {
    color: #28a745; 
}
*/
.indice_de_contenidos {
  border: 2px solid #000000;
  border-radius: 8px;
  padding: 20px;
  margin: 20px 0;
}

.indice_de_contenidos p.centrado {
  background-color: #000000;
  color: white;
  font-weight: bold;
  text-align: left;
  padding: 10px;
  margin: -20px -20px 20px -20px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.indice_de_contenidos ol {
  margin: 0;
  padding-left: 20px;
}

.indice_de_contenidos ol li {
  margin-bottom: 8px;
}

.indice_de_contenidos ol li a {
  color: #007acc;
  text-decoration: none;
}

.indice_de_contenidos ol li a:hover {
  text-decoration: underline !important;
}


.btn_wsp{text-decoration:none !important;}

/*para poner articulos de youtube*/
/*.youtube-lite {
position: relative;
width: 100%;
max-width: 560px;
aspect-ratio: 16 / 9;
background-color: #000;
background-position: center;
background-size: cover;
cursor: pointer;
overflow: hidden;
}
.youtube-lite .play-button {
width: 100px;
height: 100px;
background: url('https://webtao.es/images/play-boton.png') no-repeat;
background-size: 100% 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
/* fin para youtube */
/*
.icon-pending{color:#f00;}*/