@charset "UTF-8";
/* CSS Document */




body { font-family: Arial, Helvetica, sans-serif; font-size:16px; font-weight:300; color:#555; margin:0; padding:0; }
body {background-color: #87898a; }

#page { max-width: 1200px; margin:0 auto; position: relative; background-color: #d8d8d3  }


/* Text */

h1 { margin:0 0 1em 0; font-size: 2.8em; font-weight: 700;}
h2 { margin:0 0 .5em 0; font-size: 1.6em; font-weight: 700; line-height: 1.1em; }
h3 { margin:0 0 .5em 0; font-size: 1.3em; font-weight: 700; }
h4 { margin:0 0 1.5em 0; font-size: 1.6em; font-weight: 300; color: #FFF }
h5 { margin:0 0 1.5em 0; font-size: 1.2em; font-weight: 300; color: #FFF }

p { margin: 0 0 1em 20;}

a { color: #007eff; }
a:visited { color: #65blff; }

/* header */

header { height: 627px; background: #aeb0af url(../images/Carlo-portret-small.jpg) no-repeat center bottom; position: relative; }

header div.text { position: absolute; width: 45%; top: 130px; left: 10%; }
header div.text h4 {line-height: 1.6em; margin: 0 0 30px 0; }
header div.text::before {
	content: '\201c'; color: #fff;
	position: absolute;
	top: -40px; left: 0px;
	font-size: 5em;
	font-family: "MS Serif", "New York", serif; }


/* section - All */

section { padding: 0 30px; }
section::after { content:''; display: block; clear: both; }


/* section - Main */

section.main { margin-top: -60px; margin-bottom: 30px; padding: 30px; }
section.main aside { width: 33%; float: left; text-align: left; }

section.main .content { margin: 15px; background: no-repeat center top; background-size: 40px 40px; padding-top: 50px; }


/* footer */


footer {font-size: .9em; margin: 40px; color: #999; text-align: center; }
footer .content { display: inline; }


/* media queries */

@media screen and (max-width: 800px) {
	
	/* Header */
	header { height: 427px; background: #aeb0af url(../images/Carlo-portret-small-800.jpg); position: relative; }
	header div.text h4 { font-size: 1.0em; top: 80px; }
	header div.text { position: absolute; width: 52%; top: 80px; left: 10%; }
	
}

/* Section - Main */

@media screen and (max-width: 800px) {
section.main aside {width: 100%; float: none; text-align: left; }


}