/*-------------------------------------------------------------------- 
         DAUGHTER
         By Ge Ricci, 2014
-------------------------------------------------------------------- */


/* ------------------------------ 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, figure, 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;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, picture {
    display: block;
}

body {overflow-y: scroll;}

/* --------------------------------------------------------------------------- */
/* -------------------------- THEME'S DEFAULT VALUES ------------------------- */
/* --------------------------------------------------------------------------- */

/*These files are part of the free font collection offered by Carrois Type Design GbR.
Please received a copy of the GNU General Public License here: http://www.gnu.org/licenses/*/


@font-face {
    font-family: 'colaborate-mediumregular';
    src: url('ColabMed-webfont.eot');
    src: url('ColabMed-webfont.eot?#iefix') format('embedded-opentype'),
         url('ColabMed-webfont.woff') format('woff'),
         url('ColabMed-webfont.ttf') format('truetype'),
         url('ColabMed-webfont.svg#colaborate-mediumregular') format('svg');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'forumregular';
    src: url('forum-regular-webfont.eot');
    src: url('forum-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('forum-regular-webfont.woff') format('woff'),
         url('forum-regular-webfont.ttf') format('truetype'),
         url('forum-regular-webfont.svg#forumregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


body {
	font: 100%/1.2 forumregular, Georgia, "Times New Roman", Times, serif;
	color: #1e0b19;
	background: #EEE; 
}


header {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 10;
}
h1 {
	font: 18vw colaborate-mediumregular, sans-serif;
	text-transform: uppercase;
	text-align: center;
	margin-left: 0.2em;
	color: #fef7eb;
	opacity: .8;
}
h2 {font: 2.5em colaborate-regularregular, sans-serif; padding-bottom: 0.8em;}

img {max-width: 100%; height: auto; border: none; vertical-align: baseline;}

p {font-size: 1.5em;}
p + p {margin-top: 0.8em;}

a, a:link {color: #555;}
a:visited {opacity: .8;}

div.slide {position: relative; clear: both;}
div.verse {
	width: 80%;
	padding: 10%;
}
div.content {
	max-width: 40em;
	margin: 0 auto; 
}

div.slide01 { 
	background: rgba(17,0,11,1);
}

.slide01 picture::before {
	display: block;
	position: absolute;
	width: 100%;
	height: 5px;
	bottom: 0;
	left: 0;
	content: "";
	background: rgba(208,131,113,.8);
	transform: rotate(2deg);
}
.slide01 picture::after {
	display: block;
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 1px;
	left: 0;
	content: "";
	background: rgba(255,255,255,.7);
	transform: rotate(-.5deg);
}

div.slide01 picture {position: relative;}
div.slide01 .verse {
	color: #EEE;
	background: rgba(17,0,11,.9);
}
div.slide02 .verse {background: rgba(0, 0, 0,1);}

div.slide02 {color: #EEE; background: #000; border-top: 4px solid #FFF;}

div.slide03 picture {background: #000; text-align: center;}

footer {
	text-align: center;
	background: #FFF;
	padding: 2rem 5%;
	margin: 2rem 0;
}
	footer p {font: 0.85em colaborate-mediumregular, sans-serif; color: #444;}

/* --------------------------------- MEDIA QUERIES --------------------------------- */

@media screen and (min-width: 1550px) {
	body {font-size: 150%;}
	div.slide02 .verse {
		position: absolute;
		width: 20%;
		right: 0;
		top: 10%;
		background: transparent;
	}
}


@media screen and (min-width: 1300px) {
	h1 {font-size: 10em; text-align: left; margin-left: .1em;}	

}