/*
Theme Name: Dalia Monroy
Theme URI: http://#
Description: Dalia Monroy
Version: 1
Author: Zabdiel
Author URI: http://poeticavisua.com
*/

/* RESET */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }body {line-height: 1; }ol, ul {list-style: none; }blockquote, q {quotes: none; }blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none; }:focus {outline: 0; }ins {text-decoration: none; }del {text-decoration: line-through; }table {border-collapse: collapse; border-spacing: 0; } * {padding: 0; margin: 0; border: 0; }

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, textarea, p, blockquote, th, td { 
	padding:0;
	margin:0; }

fieldset, img { border:0 }

ol, ul, li { list-style:none }

:focus { outline:none }

:root {
	--color: #FE9A2E;
	--color1: #FE9A2E;
	--color2: #d9ba85;
	--color3: #E56114;
	--color4: #a7d8df;
	--contraste1: #222;
	--contraste2: #105f68;
	--contraste3: #0d3f46;
	--blanco: #fff;
	--negro: #000;
	--gris: #999;
	--rata: #555;
	--alfa: #f3f3f3;
	--hover: #FEB1F1;
}

html{
	background-color: var(--negro);
	scroll-behavior: smooth;
}

body,
input,
textarea,
select {
	font-family: "Lato", Arial, sans-serif;
	font-size: 16px;
	line-height: 22px;
	font-weight: 200;
	color: var(--blanco);
}

a { text-decoration:none; }
a, a:visited {	text-decoration: none; }
a:hover { text-decoration: none; }

.izqueirda, .left { float:left; }
.derecha, .right { float:right; }
.centro, .center { text-align: center; }
.clear { clear: both; }
.inline { display: inline-block; }
.ocultar { display: none; }
.ocultar a { color: var(--blanco); }

img.alignright { margin: 3px 0 10px 20px; display: inline; }
img.alignleft { margin: 3px 20px 10px 0; display: inline; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
img.centered { display: block; margin-left: auto; margin-right: auto; }

.alignleft { float: left; }
.alignright { float: right; }
.aligncenter { text-align:center; }

.salto { height: 70px; }

#wrap {
	max-width:1024px;
	margin:0px auto 0px;
	clear: both;
	overflow: hidden;
}

/*--------------------------------------------------------------
# preload
--------------------------------------------------------------*/

#page-loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: var(--negro) none repeat scroll 0% 0%;
}
#page-loader .preloader-interior {
	display: block;
	position: relative;
	left: 50%;
	top: 50%;
	width: 80px;
	height: 80px;
	margin: -40px 0 0 -40px;
	border-radius: 50%;
	border: 8px solid transparent;
	border-top-color: var(--color);
 
	-webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
		  animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@-webkit-keyframes spin {
	0%   { 
		-webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: rotate(0deg);  /* IE 9 */
		transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
	}
	100% {
		-webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: rotate(360deg);  /* IE 9 */
		transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
	}
}
@keyframes spin {
	0%   { 
		-webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: rotate(0deg);  /* IE 9 */
		transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
	}
	100% {
		-webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: rotate(360deg);  /* IE 9 */
		transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
	}
}

/*--------------------------------------------------------------
# header
--------------------------------------------------------------*/

header {
	width: 100%;
	height: 70px;
	z-index: 100;
	display: block;
	position: fixed;
	border-bottom: 1px solid #000;
	}

#cabeza {
	margin:0px auto 0px;
	background: rgba(12, 11, 9, 0.8);
	border-bottom: 1px solid rgba(12, 11, 9, 0.6);
}

.menuvacio { height: 80px; visibility: hidden; }

.topnav {
	overflow: hidden;
	padding: 7px 0 10px 0; 
	display: block;
	margin-left: 20px;
	z-index: 100;
	text-align: right;
}
	.topnav a {
		color: var(--blanco);
		padding: 12px 8px;
		text-decoration: none;
		font-weight: 200;
		font-size: 16px;
		line-height: 50px;
	}
	.topnav a:hover {
		text-decoration: none;
		color: var(--color2);
	}
	.topnav .icon {
		display: none;
		font-size: 20px;
		line-height: 20px;
		margin-right: 15px;
	}

	.topnav a.oculto {
		display: none;
	}


a.logo {
	background: url(images/logo.png) no-repeat top center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	width:250px;
	height:52px;
	margin: 0px;
	padding: 0px;
	display:block;
	float:left;
	}
	a.logo:hover {
		background-color: none;
	}

/*--------------------------------------------------------------
# generales
--------------------------------------------------------------*/

h1 {
	letter-spacing:1px;
	display: inline-block;
	box-sizing: border-box;
	font-size: 45px;
	line-height: 55px;
	font-weight: bold;
	color: var(--color1);
	margin: 0px 0px 0px 0px;
	clear:both;
}
h2, h2 a {
	box-sizing: border-box;
	font-family: "Playfair Display", serif;
	font-size: 28px;
	line-height: 38px;
	font-weight: normal;
	letter-spacing: 1px;
	color: var(--color1);
	margin: 0px 0px 10px 0px;
	clear:both;
}
h2 a:hover { color: var(--color3); }
h3, h3 a {
	display: inline-block;
	box-sizing: border-box;
	font-family: "Playfair Display", serif;
	font-size: 26px;
	font-weight: normal;
	line-height: 34px;
	margin: 0px 0px 0px 0px;
	color: var(--color1);
	clear:both;
}
h2 a:hover { color: var(--color3); }
h4 {
	font-size: 22px;
	line-height: 30px;
	font-weight:normal;
	clear:both;
	margin:10px 0px 10px 0px;
	clear:both;
}
h5 {
	font-size: 20px;
	line-height: 26px;
	font-weight:normal;
	clear:both;
	margin-bottom:10px;
	clear:both;
} 
h6 {
	font-size: 18px;
	line-height: 24px; 
	text-transform: uppercase;
	font-weight: 200;
	letter-spacing:2px;
	margin-bottom: 30px;
	clear:both;
} 

p {
	font-size: 18px;
	line-height: 26px;
	margin-bottom: 10px;
}

.color1 { color: var(--color1); }
.color2 { color: var(--color2); }
.color3 { color: var(--color3); }
.color4 { color: var(--color4); }

.blanco { color: var(--blanco); }
.negro { color: var(--negro); }
.gris { color: var(--gris); }
.rata { color: var(--rata); }

.bg-color { background: var(--color); }
.bg-color1 { background: var(--color1); }
.bg-color2 { background: var(--color2); }
.bg-color3 { background: var(--color3); }
.bg-color4 { background: var(--color4); }
.bg-contraste1 { background: var(--contraste1); }
.bg-contraste2 { background: var(--contraste2); }
.bg-blanco { background: var(--blanco); }
.bg-gris { background: var(--gris); }
.bg-alfa { background: var(--alfa); }

.bg-imagen {
	width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
}
.bg-imagen1, .bg-imagen2, .bg-imagen3 { 
	width: 100%;
	background-image: url(images/bg-1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
}
.bg-imagen2 { background-image: url(images/bg-2.jpg); }
.bg-imagen3 { background-image: url(images/bg-3.jpg); }

.bg-degradado1 { 
	background: rgb(7,159,174);
	background: linear-gradient(0deg, rgba(7,159,174,1) 30%, rgba(167,216,223,1) 100%);
}
.bg-degradado2 { 
	background: rgb(7,159,174);
	background: linear-gradient(0deg, rgba(167,216,223,1) 30%, rgba(7,159,174,1) 100%);
}

.linea1, .linea, .lineacolor { 
	width: 100px;
	height: 1px;
	margin: 15px auto 15px;
	border-bottom: 1px solid #fff;
}
.lineacolor { border-bottom: 1px solid var(--color1); }
.linea1 { border-bottom: 1px solid var(--color1); margin: 15px 0px; }

.radio { border-radius: 8px; }

.margen { padding: 35px 20px 30px 20px; }
.margen20 { padding: 15px 20px 10px 20px; }
.margen40 { padding: 30px 40px 30px 40px; }
.margen-page { padding: 0px 30px 0px 30px; }

.flex {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.icon {
	display: block;
	text-align: center;
	margin-bottom: 20px;
	font-size: 40px;
}

.opacity3 { background-color: rgba(0,10,10, 0.3); }
.opacity5 { background-color: rgba(0,10,10, 0.5); }
.opacity7 { background-color: rgba(0,10,10, 0.7); }
.opacity9 { background-color: rgba(0,10,10, 0.9); }

/*--------------------------------------------------------------
# video
--------------------------------------------------------------*/

.showcase {
	position: relative;
	height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: 0 20px;
	color: #000;
}

.video-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: var(--primary-color) url('images/slider01.jpg') no-repeat center center/cover;
}

.video-container video {
	min-height: 100%;
	min-width: 100%;
	object-fit: cover;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.video-container:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.1); 
}

/*--------------------------------------------------------------
# input y button
--------------------------------------------------------------*/

input[type=text], input[type=date], input[type=number], input[type="email"], input[type=password],
textarea {
	padding: 10px;
	margin-bottom: 20px;
	width: 100%;
	display: block;
	outline: none;
	color: var(--blanco);
	background: var(--negro);
	border: 1px solid var(--color2);
	opacity: .8;
	font-weight: normal;
	font-size: 16px;
}

button, .vermas a {
	background: var(--color);
	padding: 10px 35px;
	color: #fff;
	transition: 0.4s;
	border-radius: 50px;
}
	button:hover, .vermas a:hover { 
		background-color: var(--rata);
		background-image: -webkit-gradient(linear,left top,left bottom,color-stop(10%,var(--color3)),to(var(--color1)));
		background-image: linear-gradient(var(--color3) 10%,var(--color1) 100%);
		-webkit-box-shadow: none; 
		-moz-box-shadow: none; 
		box-shadow: none;
	}

a.mas {
	width: 100px;
	margin: 20px auto 2px;
	text-align: center;
	border: 1px solid var(--gris);
	padding: 5px 10px;
	border-radius: 20px;
	color: var(--gris);
	font-size: 12px;
	line-height: 30px;
	letter-spacing: 1px;
	font-weight: bold;
	text-transform: uppercase;
}
	a.mas:hover { background-color: var(--rata); color: var(--blanco); border: 1px solid var(--rata); }

.vermas {
	margin-top: 30px;
	margin-bottom: 20px;
}

/*--------------------------------------------------------------
# transiciones
--------------------------------------------------------------*/

.transform_up { transform: translateY(20%); }
.transform_down { transform: translateY(-20%); }
.transform_left { transform: translateX(10%); }
.transform_right { transform: translateX(-10%); }

.aparece {
	opacity: 1;
	transform: none;
}

h1, h2, h3, h4, h5, h6, p, span, button, hr,
.item, .galeria-item {
	transition: all 2s;
}

/*--------------------------------------------------------------
# bloques
--------------------------------------------------------------*/

.dos, .tres, .cuatro, .cinco, .esquema {
	display: grid;
	grid-gap: 30px;
	grid-auto-flow: dense;
}

.dos {
	grid-template-columns: repeat(2, 1fr);
}
.tres {
	grid-template-columns: repeat(3, 1fr);
}
.cuatro {
	grid-template-columns: repeat(4, 1fr);
}
.cinco {
	grid-template-columns: repeat(5, 1fr);
}

.esquema {
	grid-template-columns: 1fr 2fr 1fr;
}

/*--------------------------------------------------------------
# content
--------------------------------------------------------------*/
.contenido-frase {
	padding: 30px 20px 40px 20px;
}
.contenido-frase strong.blanco { font-weight: bold; color: var(--blanco); }

.contenido {
	padding: 100px 20px 80px 20px;
}
.content {
	padding: 50px 20px 50px 20px;
}
.content p { color: var(--blanco); padding-bottom: 5px; }
.content a { color: var(--color1); }
.content a:hover { color: var(--color2); }
.content strong { font-weight: bold; color: var(--color2); }
.content em { font-style:italic; color: var(--blanco); }



.content ul {
	list-style: none;
	padding: 0px;
	margin:0px 0px 0px 10px;
}
	.content ul li {
		font-size:18px;
		line-height: 26px;
	}
	.content ul li::before {
		font-family: 'IcoFont' !important;
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		white-space: nowrap;
		word-wrap: normal;
		direction: ltr;
		line-height: 1;
		/* Better Font Rendering =========== */
		-webkit-font-feature-settings: "liga";
		-webkit-font-smoothing: antialiased;

		content: "\ec10";
		color: var(--color1);
		display: inline-block;
		padding-right: 15px;
		font-size: 20px;
		line-height: 25px;
		width: 15px;
	}
	.content ul li a { color: var(--rata); }
	.content ul li a:hover { color: var(--rata); }


.content ol {
	list-style: none;
	margin: 0px;
	counter-reset: item;
}
	.content ol li {
		font-size:18px;
		line-height:26px;
	}
	.content ol li::before {
		color: var(--blanco);
		background-color: var(--color1);
		display: inline-block;
		content: counter(item) ;
		counter-increment: item;
		padding: 8px;
		margin-right: 10px;
		font-size: 12px;
		line-height: 5px;
		font-weight: bold;
		border-radius: 16px;
	}
	.content ol li a { color: var(--rata); }
	.content ol li a:hover { color: var(--rata); }

/*--------------------------------------------------------------
# banner
--------------------------------------------------------------*/

.banner {
	position: relative;
	top: 0px;
	width: 100%;
	height: calc(100vh);
	background-size: cover;
	background-position: center;
	transition: all 0.5s ease-in-out;
	background-image: url('images/slider01.jpg'); 
	animation: banner 20s infinite linear;
}

.banner-content {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	color: #fff;
	background-color: rgba(0,10,10, 0.2);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

@keyframes banner {
	0%{ background-image: url('images/slider01.jpg'); }
	25%{ background-image: url('images/slider01.jpg'); }

	26%{ background-image: url('images/slider02.jpg'); }
	50%{ background-image: url('images/slider02.jpg'); }

	51%{ background-image: url('images/slider03.jpg'); }
	75%{ background-image: url('images/slider03.jpg'); }

	76%{ background-image: url('images/slider04.jpg'); }
	100%{ background-image: url('images/slider04.jpg'); }
}

/*--------------------------------------------------------------
# frases
--------------------------------------------------------------*/

.frase {
	text-align: center;
	transition: all 1s;
}
	.frase span {
		line-height: 160px;
		font-size: 160px;
		font-family: Times;
		font-weight: bold;
		color: var(--color);
		padding: 0;
		margin: 0;
	}
	.frase span.negro { color: var(--negro);  }
	.frase span.blanco { color: var(--blanco);  }
	.frase p {
		font-size: 20px;
		font-weight: 200;
		line-height: 30px;
		text-align: center;
		margin-top: -70px;
		padding: 0px;
	}
	.frase hr {
		content: "";
		width: 120px;
		height: 1px;
		display: inline-block;
		background: rgba(255, 255, 255, 0.2);
		margin: 20px 0px 0px 0px;
	}

	hr.negro, hr.negra {
		background: rgba(0, 0, 0, 1);
	}

	hr.color {
		background: var(--color);
	}

/*--------------------------------------------------------------
# titulo
--------------------------------------------------------------*/
.titulo {
	padding-bottom: 40px;
}

.titulo-archive {
	padding: 0 0 0 0;
}

.titulo p, .titulo-archive p {
	font-size: 14px;
	font-weight: 500;
	padding: 3px 0 0 0;
	line-height: 1px;
	margin: 0 0 5px 0;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--blanco);
	font-family: "Poppins", sans-serif;
}
.titulo-archive p { margin-top: 3px; }

.titulo p::after, .titulo-archive p::after {
	content: "";
	width: 120px;
	height: 1px;
	display: inline-block;
	background: rgba(255, 255, 255, 0.2);
	margin: 4px 10px;
}

.titulo p a, .titulo-archive p a { color: var(--blanco); }
.titulo p a:hover, .titulo-archive p a:hover { color: var(--blanco); }

.titulo h1, .titulo h1 a, 
.titulo-archive h1, .titulo-archive h1 a {
	margin: 0;
	padding: 0;
	font-size: 36px;
	line-height: 50px;
	letter-spacing: 1px;
	font-weight: 700;
	font-family: "Playfair Display", serif;
	color: var(--color);
}
.titulo-archive h1, .titulo-archive h1 a { margin-top: 0px; }
.titulo h1 a:hover, 
.titulo-archive h1 a:hover { color: var(--color2); }

/*--------------------------------------------------------------
# about
--------------------------------------------------------------*/
	
.about-img {
	position: relative;
	transition: .5s;
}

.about-img img {
	max-width: 100%;
	border: 4px solid rgba(255, 255, 255, 0.2);
	position: relative;
}

.about-img::before {
	position: absolute;
	left: 20px;
	top: 20px;
	width: 60px;
	height: 60px;
	z-index: 1;
	content: '';
	border-left: 5px solid var(--color);
	border-top: 5px solid var(--color);
	transition: .5s;
}

.about-img::after {
	position: absolute;
	right: 20px;
	bottom: 20px;
	width: 60px;
	height: 60px;
	z-index: 2;
	content: '';
	border-right: 5px solid var(--color);
	border-bottom: 5px solid var(--color);
	transition: .5s;
}

.about-img:hover {
	transform: scale(1.03);
}

.about-img:hover::before {
	left: 10px;
	top: 10px;
}

.about-img:hover::after {
	right: 10px;
	bottom: 10px;
}

/*--------------------------------------------------------------
# galeria
--------------------------------------------------------------*/

.galeria {
	display: grid;
	grid-template-columns: repeat(6, 1fr); /*repeat(auto-fill, minmax(130px, 1fr)); /*repeat(4, 1fr); */
	grid-auto-rows: 120px; /*minmax(200px, auto);*/
	grid-gap: 30px;
	/*grid-auto-flow: dense;*/
}

.galeria-item { position: relative; }

.alignnone { /* imagen */
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.principal { grid-column: span 4; grid-row: span 3; }
.vertical { grid-column: span 2; grid-row: span 3; }
.horizontal { grid-column: span 3; grid-row: span 2;}
.cuadro { grid-column: span 2; grid-row: span 2; }

.lupa {
	position: absolute;
    top: 50%;
    left: 50%;
}

.nover { display: block; }

/*--------------------------------------------------------------
# footer
--------------------------------------------------------------*/
#footer {
	border-top: 1px solid #37332a;
	background: var(--negro);
	color: var(--blanco);
	padding: 30px 20px;
	text-align: center;
	
}
#footer p { font-size: 14px; line-height: 16px; }
#footer .copyright a { color: var(--blanco); font-weight: normal; }
#footer .creditos a { color: var(--color); }

#login {
	padding: 20px 30%;
}

/*--------------------------------------------------------------
# iconos
--------------------------------------------------------------*/

.iconos {
	margin-bottom: 20px;
	display: block;
	float: left;
	width: 100%;
	color: var(--blanco);
}
.iconos i {
	font-size: 30px;
	font-weight: bold;
	display: inline-block;
	float: left;
	width: 50px;
	height: 50px;
	background: var(--color);
	border-radius: 25px;
	padding: 10px;
	color: var(--blanco);
	text-align: left;
}

.iconos h4 {
	font-size: 18px;
	font-weight: bold;
	width: 250px;
	display: inline-block;
	margin: -50px 0 2px 20px;
}

.iconos p {
	width: 250px;
	display: inline-block;
	margin: 0px 0 5px 20px;
	font-size: 16px;
	line-height: 22px;
	color: var(--color2);
}

@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot');
	src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('fonts/icomoon.woff') format('woff'),
		url('fonts/icomoon.ttf') format('truetype'),
		url('fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	color: var(--color1);
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-mail:before {
	content: "\e9da";
}
.icon-location:before {
	content: "\e9d2";
}
.icon-mapa1:before {
	content: "\eac9";
}
.icon-mapa2:before {
	content: "\eacc";
}
.icon-zoom:before {
	content: "\eb08";
	color: var(--blanco);
	opacity: 0.7;
}