/*-----------------------------------------------------------------*/
/*  BACKEND
/*-----------------------------------------------------------------*/

/* Grid Base */
.rc-columna.is-admin {display: block; min-height: 40px;}
.rc-columna.is-admin > .block-editor-inner-blocks > .block-editor-block-list__layout {display: grid; box-sizing: border-box;}

/* Personalizamos el Bloque de imagen para que no tenga margenes */
.rc-columna.is-admin figure.wp-block-image { margin: 0;}

/* modificamos el editor para que se vean las imagenes de fondo en columna fullwidth */
.block-editor-block-list__block, 
.acf-block-component.acf-block-body,
.acf-block-component.acf-block-body > div, 
.acf-block-body .acf-block-preview {height: 100%;}

/* Columna fullwidth bg image */
.rc-columna.is-admin.imagefullcolumn:before {content: ""; position: absolute; top: 0; left: 0 !important; width: 100vw; height: 100%; background-position: center left !important; background-size: 60vw; background-repeat: no-repeat;}

/*-----------------------------------------------------------------*/
/*  FRONTEND
/*-----------------------------------------------------------------*/


/* GRID */
.rc-columna { position: relative; word-break: break-word; }
.rc-columna > * {z-index: 1; }

/* Personalizamos el Bloque de imagen para que no tenga margenes */
.rc-columna figure.wp-block-image { margin: 0;}

/* Video Background */
.rc-columna_video-bg { overflow: hidden; /* padding-top: 56.25%; */ position: absolute; top: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.rc-columna_video-bg iframe, .rc-columna_video-bg object, .rc-columna_video-bg embed { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; mix-blend-mode: multiply;  }
.rc-columna_video-bg__bg-color {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} 


/* Columna fullwidth bg image */
.rc-columna.imagefullcolumn {position: relative;}
.rc-columna.imagefullcolumn:before {content: ""; position: absolute; top: 0; left: 0; width: 100vw; height: 100%; background-position: center left; background-size: 60vw; background-repeat: no-repeat;}
.rc-columna.imagefullcolumn:nth-child(1):before, .rc-columna.imagefullcolumn:nth-child(2):before {left: unset; right: 0; background-position: center right;}
@media (max-width: 1800px) { .rc-columna.imagefullcolumn:before {background-size: 80vw;} }
@media (max-width: 1350px) { .rc-columna.imagefullcolumn:before {background-size: 100vw;} }
@media (max-width: 1250px) { .rc-columna.imagefullcolumn:before {background-size: cover;} }



/*-----------------------------------------------------------------*/
/*  RESPONSIVE 
/*-----------------------------------------------------------------*/


/*---------------------------------------------------------------------------------------- PC SMALL --*/

@media (max-width: 1200px) {

    

}


/*---------------------------------------------------------------------------------------- IPAD ---*/

@media (max-width: 921px) {

    .rc-columna.imagefullcolumn:before {background-size: 100vw; background-size: 100vw; left: 50% !important; top: 50% !important; transform: translate(-50%,-50%);}

    

}

/*---------------------------------------------------------------------------------------- MOVIL ---*/

@media (max-width: 559px) {
    
    .rc-columna.imagefullcolumn:before {background-size: 100vw; background-size: 100vw; left: 50% !important; top: 50% !important; transform: translate(-50%,-50%);}
    
    

}




/*-----------------------------------------------------------------*/
/*  HIDE
/*-----------------------------------------------------------------*/

@media (max-width: 559px) {

    /* Hide Mobile */
    .rc-columna.hide_mobile:not(.is-admin) {display: none !important;}
    .rc-columna.hide_mobile.is-admin {opacity: 0.5 !important; background-color: red;}

}

@media (min-width: 560px) and (max-width: 921px) {

    /* Hide Tablet */
    .rc-columna.hide_tablet:not(.is-admin) {display: none !important;}
    .rc-columna.hide_tablet.is-admin {opacity: 0.5 !important; background-color: red;}

}

@media (min-width: 922px) {

    /* Hide Desktop */
    .rc-columna.hide_desktop:not(.is-admin) {display: none !important;}
    .rc-columna.hide_desktop.is-admin {opacity: 0.5 !important; background-color: red;}

}