@charset "utf-8";

#portada {
	margin: 60px auto 0;
	position: relative;
	background: var(--naranja);
}
#portada.blck {
	background: var(--negro);
	overflow: hidden;
}
#portada.fondo {
	height:72vh;
	overflow: hidden;
}
#portada.onTop {
	margin: 0 auto;
}
#portada.fondo img {
	width: 102%;
	height:102%;
	object-fit: cover;
	animation-duration: 1.3s;
	animation-delay: 0.9s;
	z-index: 1;
}
#portada.fondo .botones {
	position: absolute;
	left: 50%;
	bottom:30px;
	transform: translateX(-50%);
	animation-duration: 1.3s;
	animation-delay: 0.9s;
	z-index: 3;
}
#portada.fondo .botones a {
	width: 48px;
	height:48px;
	background: var(--blanco);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0 9px;
}
#portada.fondo .botones a.active,
#portada.fondo .botones a:hover {
	color: var(--naranja);
}
#portada.fondo .botones a.active span::after {
	opacity: 1;
}
#portada.fondo .botones a:last-child {
	margin: 0;
}
#portada.fondo .botones a span {
	font-size: 33px;
}
#portada.fondo .botones a span.icon-corazon {
	transform: translateY(1px);
}
#portada.fondo .botones a small span {
	font-size: 30px;
}

#owl {
	animation-duration: 1.5s;
	animation-delay: 0.6s;
}
.owl-carousel {
	width: 100%;
	position:relative;
	display:block;
	cursor: grab;
	margin: 0 auto;
	overflow: hidden;
	transition: all 0.3s ease-in-out;
	z-index: 3;
}
.owl-carousel:active {
	cursor: grabbing;
}
.owl-carousel div {
	float:left;
}
.owl-carousel .item {
	width: 100%;
	position: relative !important;
	display: flex;
	justify-content: center;
	z-index: 1;
}
.owl-carousel .item > div {
	position: relative;
}
.owl-carousel .item .info {
	width: 100%;
	position: absolute;
	left: 0;
	bottom:60px;
}
.owl-carousel .item .fondo {
	width: 100%;
	height:690px;
	background: var(--negro);
	overflow: hidden;
}
.owl-carousel .item .fondo::after {
	content: '';
	width: 100%;
	height:420px;
	background-image: linear-gradient(to bottom, rgba(35,31,32,0), rgba(35,31,32,1));
	position: absolute;
	left: 0;
	bottom:0;
	z-index: 3;
}
.owl-carousel .item div img {
	width: 102%;
	height:102%;
	object-fit: cover;
	position: relative;
	z-index: 1;
}
.owl-carousel .item main {
	animation-duration: 1.2s;
	animation-delay: 0.9s;
	padding:0 0 18px;
	z-index: 3;
}
.owl-carousel .item main h2 {
	font-size: 2.1em;
	color: var(--naranja);
	display: block;
	margin: 0 0 18px;
}
.owl-carousel .item main p {
	color: var(--blanco);
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.owl-carousel .item main a {
	color: var(--naranja);
}
.owl-carousel .item main a:hover {
	color: var(--naranjaFuerte);
}

.owl-carousel .owl-item.active .fondo {
	animation: fadeIn ease-in-out 1.2s 0.3s both;
}
.owl-carousel .owl-item.active main {
	animation: fadeInUp ease-in-out 1.2s 0.3s both;
}
.owl-carousel .owl-item.active h1,
.owl-carousel .owl-item.active p {
	animation: fadeIn ease-in-out 1.5s 0.9s both;
}
.owl-carousel .owl-item.active .btn {
	animation: zoomIn ease-in-out 1.5s 0.9s both;
}

.owl-dots {
	width: 100%;
	height:0;
	text-align: center;
	position: absolute;
	left: 0;
	bottom:30px;
	display: flex;
	justify-content: center;
	padding:0 0 12px;
	z-index: 9;
}
.owl-dots .owl-dot {
	width: 12px;
	height:12px;
	border-radius: 50% !important;
	background: var(--blanco);
	position: relative;
	margin: 0 12px 0 0;
	cursor: pointer;
}
.owl-dots .owl-dot:last-child {
	margin: 0;
}
.owl-dots .owl-dot.active, 
.owl-dots .owl-dot:hover {
	background: var(--naranja);
}

#content {
	padding:30px 0 90px;
}
#content.extra {
	padding:30px 0 240px;
}

.bg-grisBlanco > #content.extra {
	padding:30px 0 240px;
}
.bg-grisBlanco > #content.extra2 {
	padding:30px 0 300px;
}

.titulo {
	width: 100%;
	text-align: center;
	margin: 0 auto 24px;
}
.titulo h2 {
	font-size: 2.1em;
	color: var(--naranja);
	padding:0 24%;
	animation-duration: 1.3s;
	animation-delay: 0.9s;
}
.bg-grisBlanco .titulo {
	margin: 24px auto 48px;
}
.bg-grisBlanco .titulo h2 {
	font-size: 2.1em;
}

.total img {
	width: 100%;
	animation-duration: 1.3s;
	animation-delay: 0.9;
}

#siemens {
	width: 100%;
	position: relative;
	display: flex;
	justify-content: space-between;
}
#siemens .box {
	width: calc(50% - 15px);
	position: relative;
	display: flex;
	gap: 9px;
}
#siemens .box > div {
	width: 50%;
	border: solid 1px var(--azul);
	position: relative;
}
#siemens .box > div img {
	width: 100%;
}
#siemens .box .texto {
	color: var(--blanco);
	background: var(--azul);
	padding:12px;
	display: flex;
	flex-wrap: wrap;
	gap:15px;
	align-content: space-between;
}
#siemens .box .texto > div {
	width: 100%;
}
#siemens .box .texto p {
	font-size: 0.7em;
}
#siemens .box .texto .top p {
	font-weight: bold;
}

#content > .texto {
	padding:30px 0 0;
}
#content > .texto h1 {
	font-size: 2.4em;
	color: var(--naranja);
	margin: 0 0 24px;
}
#content > .texto h2,
#content > .texto h3 {
	font-size: 1.8em;
	color: var(--naranja);
	margin: 0 0 15px;
}
#content > .texto h3 {
	font-size: 1.5em;
}
#content > .texto p {
	margin: 0 0 15px;
}
#content > .texto img {
	width: 100%;
	animation-duration: 1.3s;
	animation-delay: 0.9s;
}
#content > .texto > *:last-child {
	margin: 0;
}
#content ul {
	list-style: none;
	padding:0 0 0 18px;
}
#content ul li {
	position: relative;
	margin: 0 0 6px;
}
#content ul li:last-child {
	margin: 0;
}
#content ul li::before {
	content: '';
	width: 3px;
	height:3px;
	background: var(--negro);
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left:-18px;
	transform: translateY(-50%);
	z-index: 3;
}

@media screen and (max-width:666px) {
	
	#portada.fondo {
		height:69vh;
	}
#portada.onTop {
	margin: 0 auto;
}
#portada.fondo .botones {
	position: absolute;
	left: 50%;
	bottom:30px;
	transform: translateX(-50%);
	animation-duration: 1.3s;
	animation-delay: 0.9s;
	z-index: 3;
}
#portada.fondo .botones a {
	width: 48px;
	height:48px;
	background: var(--blanco);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 0 9px;
}
#portada.fondo .botones a.active,
#portada.fondo .botones a:hover {
	color: var(--naranja);
}
#portada.fondo .botones a.active span::after {
	opacity: 1;
}
#portada.fondo .botones a:last-child {
	margin: 0;
}
#portada.fondo .botones a span {
	font-size: 33px;
}
#portada.fondo .botones a span.icon-corazon {
	transform: translateY(1px);
}
#portada.fondo .botones a small span {
	font-size: 30px;
}
	
	.owl-carousel .item .fondo {
		height:600px;
	}
	.owl-carousel .item main h2 {
		font-size: 1.9em;
	}
	
	#content.extra {
		padding:30px 0 180px;
	}

.bg-grisBlanco > #content.extra {
	padding:30px 0 240px;
}
.bg-grisBlanco > #content.extra2 {
	padding:30px 0 300px;
}

	.titulo h2 {
		font-size: 1.8em;
		padding:0 30px;
	}
.bg-grisBlanco .titulo {
	margin: 24px auto 48px;
}
	.bg-grisBlanco .titulo h2 {
		font-size: 1.9em;
	}
	
}