@font-face {
	font-family: "Rokkitt-SemiBold";
	src: url("../font/Rokkitt-SemiBold.ttf") format("truetype");
}

html, body {
	display: block;	
	box-sizing: border-box; 	
	padding: 0;
	border: 0;
	color: rgb(134, 134, 134);
	background-color: rgb(12, 12, 12);
	font-family: "Arial", "Lato-Light", "Times New Roman";	
	font-size: 1em;	
}

.topPicture {						
	background-image: url(natureMain.jpg);
	content: '';	
	background-size: 100% 100%;
	-moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	height: calc(25mm + 25vw);
	padding-left: 10vw;
}

.presentation { margin: 0; }

.staticBack { margin: 0; }

h1 { 
	font-family: "Rokkitt-SemiBold";	
	font-size: calc(5mm + 3vw);
	letter-spacing: -0.01em;
	line-height: 0.8;
	text-align: right;
	margin-top: calc(-5mm - 7vw);
	margin-right: 5vw;
}

h1Sub {
	font-size: calc(3mm + 2vw);
}

h3 {
	font-family: "Ranga-Regular";
	font-weight: 100;
	line-height: 0.9;
	font-size: calc(5mm + 1vw);
	text-align: left;
	margin-top: calc(-6mm - 4vw);
	margin-left: 5vw;
}

h2 {		
	font-family: "Ranga-Regular";
	font-weight: 100;
	line-height: 0.9;
	font-size: calc(5mm + 1vw);
	padding-top: 3vw;
	padding-right: 3vw;
}

.firstcharacter {
    color: (196, 134, 0);
	font-family: Georgia;
	font-style: italic;
	font-size: calc(7mm + 3vw);
	line-height: 0.2;	
	letter-spacing: -0.01em;
	color: rgb(94, 50, 216);
}

.hdot { color: rgb(94, 50, 216);}

.txtArea {	
	margin-left: 1mm;
	margin-right: 0mm;
	font-size: 5mm;
	line-height: 1.5;
	word-spacing: 0.12em;
	letter-spacing: 0em;
	
}

.breakArea {
	background: url(natureBreak.jpg) center repeat fixed;		
	background-size: contain;
	height: 30mm;
	text-align: right;
	font-family: "Ranga-Regular";
	font-size: 10mm;
	color: rgb(190, 190, 190);
}

@media screen and (max-width: 800px) {

	.presentation { max-width: 600px; margin: auto; }

	.txtArea { font-family: "Lato-Light"; }

	.breakArea { height: 15mm; padding-top: 4mm;}
}

@media screen and (max-width: 1280px) and (min-width: 800px) {

	.presentation { max-width: 800px; margin: auto; }

	.txtArea { font-size: 6mm; }

	.breakArea { font-size: 7mm; padding-top: 5mm;}
}

@media screen and (min-width: 1280px) {

	.presentation { max-width: 1024px; margin: auto; }

	.txtArea { font-size: 7mm; }

	.breakArea { font-size: 9mm;}
}