/*-------------------------------------------------------------------------- 
///////////////////////////////////////////////////////////////////////////
ADD BANNERS  //////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////
-------------------------------------------------------------------------*/
/*---------------------------------------------------------------- 
BANNER DUOPANEL /////////////////////////////////////////////////
----------------------------------------------------------------*/

/* z index
----------------------------------------*/
.banner-duopanel .col .banner-box {
	z-index:2;
	}
.banner-duopanel .col picture {
	z-index:1;
	}



/* General
----------------------------------------*/
.banner-duopanel{
	align-items:stretch!important;
	}



/* Inside
----------------------------------------*/
.banner-duopanel .inside{
	align-items:stretch!important;
	}



/* Columnas
----------------------------------------*/
.banner-duopanel .col-1,
.banner-duopanel .col-info,
.banner-duopanel .col-1.col-info {
	order:1;

	}

.banner-duopanel .col-2,
.banner-duopanel .col-img,
.banner-duopanel .col-2.col-img {
	order:2;
	}




/* --------------------------------------------------
------------------------------------- IF PLAY ---
---------------------------------------------------*/


/* Picture (default)
------------------------------*/
.banner-duopanel.play .col-img picture.img-main {
	transition-delay:0.4s!important;
	transition:var(--add-transition-very-slow);
	transform: scale(1.08);
	opacity:0.0;
	}



/* Panel info
------------------------------*/
.banner-duopanel.play .play-to-top .banner-box {
	transition-delay:0.8s!important;
	transition:var(--add-transition);
	transform: translateY(40px);
	opacity:0.0;
	}



/*                                       
------------------------------------------- 620 ---
--------------------------------------------------*/
@media only screen and (max-width:620px) {

	.banner-duopanel.play .col-img picture.img-main {
	transition-delay:0.0s!important;
	}

	.banner-duopanel.play .play-to-top .banner-box {
	transform: translateY(8px);
	}

}







/*-------------------------------------------------------------------------- 
////////////////////////////////////////////////// ---------- / END PANELES
--------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------- 
///////////////////////////////////////////////////////////////////////////
ADD PANELES  //////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////
-------------------------------------------------------------------------*/



/*--------------------------------------------
PANEL POLIGRAFIA EMPRESAS ///////////////////////////
-------------------------------------------*/
.panel-poligrafia-empresas{
	background-color:var(--color-neutro-softer)!important;
	min-height:60vh;
	height: 440px;
	align-items:flex-start;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	overflow:hidden;
	padding-bottom:0px; 
	padding-top:0px;
	position:relative;
	max-width:100%;
	width:100%;
	z-index:10;
	}


/* Inside
------------------------------------------*/
.panel-poligrafia-empresas .inside{
	background-color:var(--color-neutro-softer)!important; /*set*/
	align-items:flex-start;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	height:100%;
	padding:5vw 5vw;
	position:relative;
	width:100%;
	}



/* Imagen
------------------------------------------*/
.panel-poligrafia-empresas .inside > picture{
	opacity:0.2;
	height:auto;
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
	top:0px;
	width:auto;
	z-index:1;
	}

.panel-poligrafia-empresas .inside > picture img{
	height:100%;
	width:100%;
	object-fit:cover; /* set */
	object-position:top center; /* set */
	}
@media only screen and (max-width:1680px) {
	.panel-poligrafia-empresas .inside > picture img{
	object-position:50% 70%; /* set */
	}
}


/* Welcome
------------------------------------------*/
.panel-poligrafia-empresas div.welcome{
	align-items:center;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	z-index:10;
	width: 100%;
	}

.panel-poligrafia-empresas div.welcome p{
	color: var(--color-neutro-darker);
	font-size: 0.95em;
	text-align: center;
	width: 70%;
	}

.panel-poligrafia-empresas div.welcome > *{
	width:100%;
	}

.panel-poligrafia-empresas div.welcome .title-1{
	text-align: center;
	color:var(--color-neutro-darker);
	}


/* Desfase
----------------------------------------*/
.panel-servicios {
	padding-top:60px!important;
	}

.panel-servicios > .col {
	overflow:visible!important;
	}

.panel-servicios > .col .desfasar {
	margin-top:-40px;
	}


/*--------------------------------------------
PANEL CONTACTANOS ///////////////////////////
-------------------------------------------*/
.panel-contactanos{
	background-color:var(--color-main-soft)!important; /*set*/
	height: 360px;
	align-items:flex-start;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	overflow:hidden;
	padding-bottom:30px; 
	padding-top:30px;
	position:relative;
	max-width:100%;
	width:100%;
	z-index:10;
	}


/* Inside
------------------------------------------*/
.panel-contactanos .inside{
	background-color:var(--color-main-soft)!important; /*set*/
	align-items:flex-start;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	height:100%;
	padding:5vw 5vw;
	position:relative;
	width:100%;
	}


/* Welcome
------------------------------------------*/
.panel-contactanos div.welcome{
	align-items:center;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content:center;
	z-index:10;
	width: 100%;
	}

.panel-contactanos div.welcome p{
	color: var(--color-white);
	font-size: 0.95em;
	text-align: center;
	width: 70%;
	}

.panel-contactanos div.welcome > *{
	width:100%;
	}

.panel-contactanos div.welcome .title-1{
	text-align: center;
	color:var(--color-white);
	}

/*-------------------------------------------------------------------------- 
////////////////////////////////////////////////// ---------- / END PANELES
--------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------- 
///////////////////////////////////////////////////////////////////////////
ADD ELEMENTOS  ////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////
-------------------------------------------------------------------------*/


/*---------------------------------------------------
////////////      ITEM COVER       ////////////
---------------------------------------------------*/


/* Cover
----------------------------------------*/
.insert-item-cover .item .cover,
.item-cover .cover{
	aspect-ratio:3 / 4!important;
	max-height:600px!important;
	}



.insert-item-cover .item .cover img,
.item-cover .cover img{
	opacity:1.0;
	}


.insert-item-cover a.item:hover .cover img,
a.item-cover:hover .cover img{
	opacity:1.0;
	}



/* Info
----------------------------------------*/
.insert-item-cover .item .content,
.item-cover .content{
	background-color:var(--color-black-50);
	align-content:center;
	justify-content:center;
	position:absolute;
	text-align:center;
	transition:var(--add-transition)!important;
	bottom:0px;
	left:0px;
	right:0px;
	top:0px;
	}



.insert-item-cover  a.item:hover .content,
a.item-cover:hover .content{
	background-color:var(--color-black-60);
	}


.insert-item-cover .item .content *,
.item-cover .content *{
	justify-content:center;
	text-align:center;
	}


.insert-item-cover .item .content .title,
.item-cover .content .title{
	color:var(--color-white);
	}

.insert-item-cover .item .content p,
.item-cover .content p{
	color:var(--color-white);
	}

.insert-item-cover .item .content .link,
.item-cover .content .link{
	color:var(--color-white);
	}


/*-----
/ END /
-----*/



/*---------------------------------------------------
////////////     CARD HORIZONTAL       ////////////
---------------------------------------------------*/
.add-card-horizontal .item{
	gap:var(--gap);
	}

.add-card-horizontal .img-profile{
	height:60px;
	width:60px;
	}

.add-card-horizontal .content,
.add-card-horizontal .info {
	padding:0px!important;
	width:10%!important;
	}

.add-card-horizontal .content > *,
.add-card-horizontal .info > *{
	justify-content:flex-start;
	text-align: left;
	}




/*-----
/ END /
-----*/


/*-------------------------------------------------------------------------- 
//////////////////////////////////////////////// ---------- / END ELEMENTOS
--------------------------------------------------------------------------*/