@import url(https://db.onlinewebfonts.com/c/e0c19db670e1b9ed25b23945f1b548dd?family=Usual);
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


/*********************************************************/
/*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; 
    
    

}

/********************************************************/
/******Ajustes especial Canva Pitagoras Tools  ****/
/********************************************************/
.pitagoras-cloud .flexbox, .pitagoras-cloud .flexbox100, 
.pitagoras-cloud .pitagoras_module {
    background: transparent !important;
}

.pitagoras-cloud body {
    border-radius: 1rem !important;
    background: transparent !important;
}

/*Desactivar Boton de Editar del SP PAGE BUILDER de la Página PitagorasTools*/
.sp-pagebuilder-page-edit {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/********************************************************/
/******FUENTES ****/
/********************************************************/

.usualfont {
    font-family: "Usual"; /*Usada en el menu de navegación, y en el body */
}

.urbanistfont { 
    font-family: "Urbanist", sans-serif; /*Usada en los títulos de Productos */
}

.jakartafont {
    font-family: "Plus Jakarta Sans", sans-serif; /*Usada en Selectores de Opciones y */
    font-optical-sizing: auto;    
    font-style: normal;
}

.textshadow {
  text-shadow: 1px 1px 2px #000000;
}


/********************************************************/
/******CLASES PERSONALIZADAS PARA LOS GOOGLE REPORTS ****/
/********************************************************/

.ga4-card {        
    border-radius: 12px; 
    border: 1px solid #dee2e6; 
    background: #fff; 
    overflow: hidden; 
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 20px 0;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);    
}
.ga4-card-header { background: #fff; padding: 1rem; border-bottom: 1px solid #edf2f7; }
.ga4-card-header h3 { margin: 0; font-size: 1.1rem; color: #1a202c; }

.ga4-table {
    width: 100%;
    border-collapse: collapse;
    background-color: white;
    text-align: left;
}
.ga4-table thead {
    background-color: #1a73e8; /* Google Blue */
    color: white;
}
.ga4-table tbody tr:hover {    
    background-color: #BCDAFE;
    transition: background-color 0.2s ease;
}
.ga4-table th { border-bottom: 1px solid #eee; padding: 12px 20px; text-align: left; font-size: 0.75rem; text-transform: uppercase; color: #f2f2f2; letter-spacing: 0.05em; border-bottom: 1px solid #edf2f7; }
.ga4-table td { padding: 16px 20px; border-bottom: 1px solid #edf2f7; vertical-align: middle; }

.ga4-table tfoot th {
    background-color: #e9ecef;
    color: #212529;
    font-weight: 700;
    text-align: left;
    padding: 15px;
    border-top: 3px solid #dee2e6;
}
.ga4-table tfoot th.right-align {text-align: right;}
.total-row { background: #f9fafb; font-weight: 800; border-top: 2px solid #3b82f6; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.ga4-table th.right-align, .ga4-table td.right-align {text-align: right;}
.city-name { display: block; font-weight: 600; color: #2d3748; font-size: 0.95rem; }
.country-name { display: block; font-size: 0.8rem; color: #718096; }
.bar-outer { width: 100px; height: 8px; background: #edf2f7; border-radius: 10px; display: inline-block; overflow: hidden; margin-right: 8px; }
.bar-inner { height: 100%; background: #4285f4; border-radius: 10px; }
.metric-val { font-weight: 600; color: #2d3748; }
.total-footer { background: #f8fafc; font-weight: 700; color: #1a202c; }
.pill { padding: 4px 10px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.social-fb { background: #e7f3ff; color: #1877f2; }
.social-ig { background: #fff0f6; color: #d6336c; }
.device-val { font-size: 13px; color: #6b7280; font-weight: 500; }
.metric-main { font-weight: 700; color: #111827; }
.progress-track { width: 120px; height: 6px; background: #eee; border-radius: 10px; display: inline-block; margin-right: 12px; overflow: hidden; }
.progress-fill { height: 100%; background: var(--g-blue); border-radius: 10px; }
.total-reach-row { background: #f8f9fa; font-weight: 700; border-top: 2px solid var(--g-blue); }
.share-bar-container {
    width: 100%;
    background-color: #e9ecef;
    border-radius: 4px;
    height: 6px;
    margin-top: 6px;
}
.share-bar-fill {
    background-color: #4285f4;
    height: 100%;
    border-radius: 4px;
}
.percentage-bar-bg {
    background: #e0e0e0;
    border-radius: 4px;
    width: 100px;
    height: 8px;
    display: inline-block;
    margin-right: 10px;
}
.percentage-bar-fill {
    background: #34a853; /* Google Green */
    height: 100%;
    border-radius: 4px;
}

/********************************************************/
/******CONFIGURACION ESPECIAL PITÁGORAS TOOLS ******/
/********************************************************/

/*Ajustes a Plantilla Cassiopeia*/
.site-grid .container-component {
  grid-column-end: full-end !important;
}
.site-grid .container-component {
  grid-column-start: full-start !important;
}
.container-component > * + *, .container-sidebar-left > * + *, .container-sidebar-right > * + * {
  margin-top: 0 !important;
}

/*******************************/
/*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: 0px 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) {      

}