/* COLORS */

:root {
	--black: #000000;
	--white: #FFFFFF;
	--mint: #0CC492;
}

/* MANDATORY */

* {margin:0px; padding:0px; box-sizing:border-box; background-repeat:no-repeat; background-position:0px 0px;}
html, body {top:0; left:0; right:0; height:100%; -moz-hyphens:auto; -o-hyphens:auto; -webkit-hyphens:auto; -ms-hyphens:auto; hyphens:auto;}
table {border:none; border-collapse:collapse;}
table td, table th {padding:0;}
ul, ol {list-style-type:none;}
img, iframe {border:none;}
input, textarea, select {-webkit-appearance:none; -moz-appearance:none; border-radius:0px;}

/* GLOBAL */

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 20px;
	line-height: 160%;
	text-align: center;
	color: var(--white);
	background-color: var(--black);
}

a, a:link, a:visited, a:focus, a:active {
	color: var(--white);
	text-decoration: none;
	transition: color 0.2s linear, background-color 0.2s linear, opacity 0.2s linear, border-color 0.2s linear;
}

a:hover {
	color: var(--mint);
}

p {
	width: 100%;
	margin: 20px 0px;
	display: block;
	float: left;
	clear: both;
}

p a {
	text-decoration: underline !important;
}

p a:hover {
	color: var(--mint) !important;
}

b, strong {
	color: var(--mint);
}

h1, h2, h3, h4, h5 {
	width: 100%;
	float: left;
	clear: both;
	font-size: 30px;
	font-weight: normal;
	line-height: 120%;
	margin: 20px 0px;
	display: block;
	-moz-hyphens: none;
	-o-hyphens: none;
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

h1 {
	font-size: 40px;
}

/* ELEMENTS */

div.bg-main,
div.main {
	width: 100%;
	float: left;
	clear: none;
	position: relative;
}

div.main {
	background-color: var(--black-80);
	padding: 70px 0px;
}

div.main img {
	width: 100%;
	max-width: 600px;
	height: auto;
}

span.caption {
	display: block;
	font-size: 14px;
	line-height: 100%;
	opacity: 0.35;
	margin-bottom: 20px;
}

/* MEDIA-QUERIES */

@media screen and (max-width:1000px) {
	div.main {padding:40px 0px;}
}

@media screen and (max-width:800px) {
	body {font-size:18px;}
	div.main {padding:40px 20px;}
}

@media screen and (max-width:600px) {
	body {font-size:16px;}
	div.main {padding:30px 15px;}
}

@media screen and (max-width:400px) {
	div.main {padding:40px 10px;}
	p {margin:10px 0px;}
}