/*********************************************************/
/*Hola de Estilos del Módulo Pitágoras Remote Content */
/*********************************************************/

:root { 

    /*Body*/
    font-size: 16px;
    --body-bg: #fff;    
    --grey-bg: #f2f2f2;    

    /*Paleta Oficial Pitágoras*/
    --pitagoras-white : #fff; 
    --pitagoras-black100: #000000;

    --pitagoras-blue80 : #1C3A54; 
    --pitagoras-blue50 : #2872E8; 
    --pitagoras-blue30 : #14AEE4; 
    --pitagoras-blue20 : #4FD4CF; 
    
    

}
/*******************************/
/*Ajuste al ancho del container*/
/*******************************/
.sppb-row-container {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.body-wrapper {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;   
}

/*******************************/
/*******************************/

/*Clases especiales para elementos el formulario de Newsletter */
.focus_red {
    background: #b9795330 !important;
}

.focus_red:focus {
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(208, 26, 26, 0.97) !important;
}

/*********************/
/*Titulos*/
/*********************/

.pitagoras_module h1 {font-size: 1.8rem; }
.pitagoras_module h2 {font-size: 1.6rem; }
.pitagoras_module h3 {font-size: 1.5rem; }
.pitagoras_module h4 {font-size: 1.4rem; }
.pitagoras_module h5 {font-size: 0.7rem; }

/*********************************/
/*Bloque responsive de Titulos*/
/*********************************/
@media (min-width:768px) {

    .pitagoras_module h1 {font-size: 1.8rem; }
    .pitagoras_module h2 {font-size: 1.6rem; }
    .pitagoras_module h3 {font-size: 1.4rem; }
    .pitagoras_module h4 {font-size: 1.2rem; }
    .pitagoras_module h5 {font-size: 1rem; }
}
@media (min-width:600px) and (max-width: 767px) {
    
    .pitagoras_module h1 {font-size: 1.6rem; }
    .pitagoras_module h2 {font-size: 1.4rem; }
    .pitagoras_module h3 {font-size: 1.2rem; }
    .pitagoras_module h4 {font-size: 1rem; }
    .pitagoras_module h5 {font-size: 0.8rem; }
}
@media (max-width: 767px) {
    
    .pitagoras_module h1 {font-size: 1.5rem; }
    .pitagoras_module h2 {font-size: 1.3rem; }
    .pitagoras_module h3 {font-size: 1.1rem; }
    .pitagoras_module h4 {font-size: 1rem; }
    .pitagoras_module h5 {font-size: 0.8rem; }
}



/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
/* VIDEO RESPONSIVE*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

.video-responsive {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 53.25%;
    padding-top: 30px;  
    margin: 10px auto;
    max-width: 700px; 
    width: 100%; 
}

.video-responsive iframe, .video-responsive object, .video-responsive embed {
    position: absolute;  
    top: 0;
    left: 0; 
    height: 100%;
    width: 100%;
}
.rumble, .bitchute, {
    width: 100% !important;
    max-width: 700px !important;
    margin: 10px auto !important;
}


/*************************************************/
/*************************************************/
/* DISEÑO FLEXBOX */
/*************************************************/
/*************************************************/


/*Container principal */
.flexbox, .flexbox100 {
    flex: 0 0 100%;        
    width: 100%; 
    text-align: left;     
    display: flex !important;  
    display: -webkit-flex !important; /* Safari */     
    flex-flow: row wrap !important;
    -webkit-flex-flow: row wrap !important; /* Safari */    
    -moz-flex-flow: row wrap !important; 
    -o-flex-flow: row wrap !important; /* Safari */    
    max-width: 100%;
    padding: 0;    
    margin: 0 auto;    
}

/*Componente Default*/

/* Containers hijos*/
.flexbox5 {
    flex: 0 0 5%;        
    width: 5%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox10 {
    flex: 0 0 10%;        
    width: 10%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox15 {
    flex: 0 0 15%;        
    width: 15%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox20 {
    flex: 0 0 20%;        
    width: 20%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox20M {
    flex: 0 0 18%;        
    width: 18%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox25 {
    flex: 0 0 25%;        
    width: 25%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox30 {
    flex: 0 0 30%;        
    width: 30%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox33 {
    flex: 0 0 33%;        
    width: 33%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox35 {
    flex: 0 0 35%;        
    width: 35%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox40 {
    flex: 0 0 40%;        
    width: 40%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox45 {
    flex: 0 0 45%;        
    width: 45%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox50 {
    flex: 0 0 50%;        
    width: 50%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox60 {
    flex: 0 0 60%;        
    width: 60%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox65 {
    flex: 0 0 65%;        
    width: 65%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox70 {
    flex: 0 0 70%;        
    width: 70%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox75 {
    flex: 0 0 75%;        
    width: 75%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox80 {
    flex: 0 0 80%;        
    width: 80%; 
    text-align: left;
    margin: 0; padding: 0px;
}
.flexbox85 {
    flex: 0 0 85%;        
    width: 85%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox90 {
    flex: 0 0 90%;        
    width: 90%; 
    text-align: left;
    margin: 0; padding: 0px;
}

.flexbox95 {
    flex: 0 0 95%;        
    width: 95%; 
    text-align: left;
    margin: 0; padding: 0px;
}


/********************************************************/


/*****************************/
/*TABLAS */
/*****************************/

/*Tabla Standard*/

.grid table  {  
    background: #fff !important;    
    margin: 0px auto;    
    width: 100%;
}

.grid th, .grid td {
    padding:6px 10px !important;
    font-size: 1rem !important; 
    font-weight: 300;
}
.grid th {
    background-color: #cecece !important;
    font-weight: 700;
}

/*Altura de celdas o de textareas*/
.height100 {
    height: 100px;
}
.height200 {
    height: 200px;
}

/*Anchos de celdas de tablas*/
.w25p {  width: 25%; vertical-align: top; }
.w30p {  width: 30%; vertical-align: top; }
.w40p {  width: 40%; vertical-align: top; }
.w50p {  width: 50%; vertical-align: top; }
.w60p {  width: 60%; vertical-align: top; }
.w70p {  width: 70%; vertical-align: top; }
.w75p {  width: 75%; vertical-align: top; }
.w80p {  width: 80%; vertical-align: top; }
.w100p {  width: 100%; vertical-align: top; }




/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
/*>>BLOQUE RESPONSIVE **/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>**/
@media (min-width:992px) and (max-width:1099px) {

    

    
    
}

/* Regresa a los Tamaños Originales,  columna contenedor de item cambia al 50% */
@media (min-width:850px) and (max-width:991px) {
    /*EMPTY*/
    
}

/*Columna sigue al 50%*/
@media (min-width:700px) and (max-width:849px) {

    
    
}
/*Columna sigue al 50%*/
@media (min-width:600px) and (max-width:699px) {

    
    
}

/* Tabla Grid */
/* Los <td> con clase w50p deben colapsar a 100% debajo de 700px */
@media (max-width:699px) {      
    .grid td.w50p, .grid td.w30p, .grid td.w40p, .grid td.w60p, .grid td.w70p {
        width: 100%;
        display: inline-block !important;     
    }   
}

/*Columna cambia al 100%*/
@media (max-width:599px) {      

}
