* {
	box-sizing: border-box;
}
body {
	margin: 0;
	font-family: 'Merriweather', serif;
}


#esp-open {
	height: 100vh;
	background: url(img/esp-rep-abre.jpg) no-repeat center bottom fixed;
	background-size: cover;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}
	.esp-open-wrapper {
		text-align: center;
		color: #fff;
		max-width: 1024px;
		z-index: 1000;
		padding: 0 16px;
	}
		.esp-open-wrapper h1 {
			font-size: 60px;
			margin: 0;
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			color: #FDD835;
			text-shadow: 0 0 10px #000;
		}
		.esp-open-wrapper .esp-lead {
			font-size: 20px;
			line-height: 32px;
			font-weight: 300;
			margin: 40px 0;
			text-shadow: 0 0 20px #000;
		}
		.esp-open-wrapper .esp-author p {
			font-size: 14px;
			line-height: 20px;
			font-weight: 300;
			margin: 0;
		}
			.esp-open-wrapper .esp-author p {
				margin-bottom: 4px;
			}
			
		.esp-go-arrow {
			z-index: 1000;
			position: absolute;
			bottom: 40px;
			left: 50%;
			margin-left: -18px;
			display: block;
			width: 36px;
			height: 36px;
			border-radius: 50%;
			border: 2px solid #fff;
			opacity: .4;
			background: rgba(255,255,255,.1) url(img/esp-ic_arrow_downward_white_24dp_1x.png) no-repeat center center;
			transition: .2s;
		}
			.esp-go-arrow:hover {
				opacity: 1;
			}
		#esp-open::before {
			content: '';
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			background: linear-gradient(to top, rgba(0,0,0,1) 0, rgba(0,0,0,0) 80% )
		}
		
#esp-nav {
	width: 100vw;
	height: 60px;
	border-top: 1px solid rgba(255,255,255,.1);
	background: rgba(0,0,0,.9);
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 2px solid #FDD835;
}
	#esp-nav a {
		text-decoration: none;
		margin: 0 16px;
		font-size: 14px;
		color: #fff;
		opacity: .8;
		transition: .2s;
	}
		#esp-nav a:hover {
			opacity: .9;
		}
		#esp-nav a.active {
			opacity: 1;
		} 
	#esp-nav.fixed {
		position: fixed;
		top: 0;
		z-index: 1001;
	}
	#esp-nav.fixed + section {
		margin-top: 60px;
	}

.esp-header {
	padding: 350px 0 50px;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	background-size: cover;
}
	.esp-header-title-wrapper {
/* 		max-width: 1024px; */
/* 		margin: 0 auto; */
		margin-left: 16px;
		padding: 0 16px;
	}
		.esp-header-title-wrapper h2 {
			font-size: 60px;
			margin: 0;
			display: flex;
			flex-wrap: wrap;
			color: #FDD835;
			text-shadow: 0 0 10px #000;
		}
/*
			.esp-header-title-wrapper h2 span {
				background: rgba(0,0,0,.6);
				padding: 0 8px;
			}
*/


.esp-article-wrapper {
	max-width: 752px;
	margin: 0 auto;
	padding: 100px 16px;
	color: rgba(0,0,0,.6);
}
	.esp-article-wrapper p {
		font-size: 20px;
		line-height: 36px;
		font-weight: 400;
		letter-spacing: -.2px;
		margin-bottom: 36px;
	}
		.esp-article-wrapper p:first-child {
			margin-top: 0;
		}
		.esp-article-wrapper p:last-child {
			margin-bottom: 0;
		}
	.esp-article-wrapper strong {
		color: rgba(0,0,0,.9);
	}
	.esp-article-wrapper a {
		color: inherit;
	}

/*
.esp-article .esp-article-wrapper:first-child p:first-child::first-letter {
	font-size: 100px;
	line-height: 100px;
	float: left;
}
*/

.esp-gallery {
	background: #FDD835 url(img/esp-pattern.png);
	display: flex;
	align-items: center;
	justify-content: center;
}
	.esp-gallery.esp-gallery-dark {
		background-color: #222;
	}
	.esp-gallery-control {
		width: 96px;
		height: 96px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		opacity: .4;
		transition: .5s;
		background-repeat: no-repeat;
		background-position: center center;
	}
		.esp-gallery-control:hover {
			opacity: 1;
		}
	.esp-control-prev {
		background-image: url(img/esp-ic_keyboard_arrow_left_black_48dp_2x.png);
	}
	.esp-gallery-dark .esp-control-prev {
		background-image: url(img/esp-ic_keyboard_arrow_left_white_48dp_2x.png);
	}
	.esp-control-next {
		background-image: url(img/esp-ic_keyboard_arrow_right_black_48dp_2x.png);
	}
	.esp-gallery-dark .esp-control-next {
		background-image: url(img/esp-ic_keyboard_arrow_right_white_48dp_2x.png);
	}

.cycle-slideshow {
/* 	max-width: 960px; */
	height: calc(100vh - 150px);
	display: flex;
	justify-content: center;
}
	.cycle-slideshow img {
/* 		max-width: 100%; */
		max-height: 100%;
	}
	
	.cycle-pager { 
    text-align: center;
    width: 100%;
    z-index: 500;
    position: absolute;
    bottom: 12px;
    overflow: hidden;
	}
	.cycle-pager span {
			font-family: Arial, sans-serif;
	    font-size: 24px;
	    width: 16px;
	    height: 16px; 
	    display: inline-block;
	    color: rgba(255,255,255,.4);
	    cursor: pointer; 
	}
	.cycle-pager span.cycle-pager-active {
		color: rgba(255,255,255,1);
	}
	.cycle-pager > * {
		cursor: pointer;
	}
	
.esp-figure {
	height: calc(100vh - 200px);
	display: flex;
	justify-content: center;
}
	.esp-figure img {
		max-height: 100%;
	}

.esp-mob {
	display: none;
}
.esp-figure-full {
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	width: 100vw;
	height: 100vh;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}
	.esp-figure-full .esp-figure-full-caption {
		max-width: 840px;
		text-align: center;
		font-size: 13px;
		line-height: 20px;
		font-style: italic;
		padding: 12px 16px;
		color: #fff;
		background: rgba(0,0,0,.8);		
		margin-bottom: 16px;
	}

.esp-caption {
	max-width: 840px;
	margin: 0 auto;
	text-align: center;
	font-size: 14px;
	line-height: 20px;
	font-style: italic;
	padding: 20px 16px;
	color: rgba(0,0,0,.4);
}
	.esp-caption:after {
		content: '';
		display: block;
		width: 40px;
		height: 4px;
		background: rgba(0,0,0,.1);
		margin: 20px auto 0;
		border-radius: 2px;
	}


.esp-video {
	background: #000;
/* 	height: calc(100vh - 200px); */
	display: flex;
	align-items: center;
	justify-content: center;
}
	.esp-embed-container {
		width: 720px;
		height: 405px;
		background: red;
	}
	.esp-embed-container iframe,
	.esp-embed-container object,
	.esp-embed-container embed {
/* 		position: absolute; */
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}


/*
.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
} 
.embed-container iframe,
.embed-container object,
.embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
*/

.esp-blockquote {
	max-width: 880px;
	margin: 0 auto;
	font-size: 28px;
	line-height: 40px;
	text-align: center;
	font-weight: 900;
	font-style: italic;
	padding: 0 16px 100px;
}
	.esp-blockquote::before {
		content: '“';
		display: block;
		width: 40px;
		height: 40px;
		font-size: 60px;
		background: #FDD835;
		border-radius: 50%;
		margin: 0 auto;
	}
	.esp-blockquote + .esp-article-wrapper {
		padding-top: 0;
	}
	
.esp-footer {
	background: #FDD835;
	height: 100px;
}

.cover {
	position: relative;
	display: none;
}
.cover img {
	max-width: 100%;
}
.cover h2 {
	position: absolute;
	left: 16px;
	bottom: 24px;
	font-size: 36px;
	line-height: 1;
	color: #FDD835;
	text-shadow: 0 0 10px #000;
	margin: 0;
}

.abre {
	display: none;
	height: 100vh;
	background: url(img/esp-rep-abre.jpg) no-repeat center center;
	align-items: center;
	justify-content: center;
	position: relative;
}
.abre::before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: linear-gradient(to top, rgba(0,0,0,1) 0, rgba(0,0,0,0) 80% )
}
.abre-info {
	color: #fff;
	text-align: center;
	padding: 0 16px;
	z-index: 1000;
}
.abre-info h1 {
	margin: 0;
	font-size: 36px;
	color: #FDD835;
	text-shadow: 0 0 10px #000;
}
.abre-info .lead {
	font-size: 15px;
	line-height: 24px;
	margin: 24px 0;
}
.abre-info .author p {
	font-size: 12px;
	line-height:16px;
	margin: 0;
}

@media(max-width: 763px) {
	#esp-open {
		display: none;
	}
	.abre {
		display: flex;
	}
	.cover {
		display: block;
	}
	.esp-header {
		display: none;
	}
	.cycle-slideshow {
		width: auto;
		height: auto;
		display: inline;
	}
	.cycle-slideshow img {
		max-width: 100%;
		height: auto;
	}
	
	.esp-gallery-control {
		display: none;
	}
	
	.esp-figure {
		width: 100vw;
		height: auto;
		display: inline;
	}
		.esp-figure img {
			height: auto;
			max-width: 100%;
		}
	.esp-open-wrapper h1 {
		font-size: 36px;
	}
	.esp-open-wrapper .esp-lead {
		font-size: 15px;
		line-height: 24px;
		margin: 24px 0;
	}
	.esp-open-wrapper .esp-author p {
		font-size: 12px;
		line-height:16px;
	}
	.esp-article-wrapper {
		padding: 40px 16px;
	}
		.esp-article-wrapper p {
			font-size: 16px;
			line-height: 28px;
		}
	.esp-header-title-wrapper h2 {
		font-size: 32px;
	}
	.esp-blockquote {
		font-size: 22px;
		line-height: 32px;
		padding-bottom: 40px;
	}
	.esp-figure-full {
		display: none;
	}
	.esp-mob {
		display: block;
	}
	.esp-desk {
		display: none;
	}
	#esp-nav {
		display: none;
		
	}
		
		
		
		
		
}
