/*
Theme Name: Twenty Thirteen Child
Description: Twenty Thirteen Child Theme
Author: Leon van Dijk
Template: twentythirteen
*/

/* Colors
------------------*/
.green{ color:#00451E; } .grey{ color:#C2C3C3; } .lightGrey{ color:#ececec; } .darkGrey{ color:#484847; }

/* Fonts
------------------*/
body, h1, h2, h3, h4, h5, h6, p, li, a{ font-family: 'Open Sans', sans-serif; }
h1, h2, h3, h4, h5, h6{ font-size:18px; color:#484847; }
h1{ z-index:2; position:relative; display:block; margin:50px 0 18px; line-height:150%; }
h1:before{ content:''; display:block; z-index:-1; position:absolute; left:-100vw; right:0; width:200vw; height:100%; background:#ececec; }
p, li{ color:#787878; hyphens:none; }
li{ list-style-type:disc; }
.underline{ text-decoration:underline; }

p.hugeMe{ font-size:33px; color:#37774e; hyphens:none; }

#content ol, #content ul{ padding-left:40px; }

/* General
------------------*/
html, body{ min-width:300px; background-color:#00451E; }
* { -moz-hyphens:none; -ms-hyphens:none; -webkit-hyphens: none; hyphens:none; }
a, button{ cursor:pointer; }
a:hover, a:active, a:focus{ outline:0; }
.site{ max-width:none; }
#page{ max-width:none; overflow:hidden; }
/* Form */
label{ color:#000; }
input[type="text"], input[type="email"], textarea{ border:2px solid #c3c4c4; }
input:focus, textarea:focus{ border:2px solid #00451E; }
input[type="submit"]{ display:block; float:right; position:relative; background:#00451E; border:none; border-radius:0; overflow:visible; }
input[type="submit"]:hover, input[type="submit"]:focus{ background:#910B00; border:none; }
form div.wpcf7-response-output{ float:left; margin:0; width:100%; border-radius:16px; }
form span.wpcf7-not-valid-tip{ font-size:0.8em; }


/* Header
------------------*/
#page .site-header{ background-image:none; }
#page .contentWrap{ margin:0 auto; max-width:1080px; }
#page header{ margin-top:66px; }

/* left & right */
header #leader{ position:relative; float:left; width:100%; background-color:#ececec; }
header #leader .logo, header #leader .description{ float:left; position:relative; padding:60px 20px; }
header #leader .logo{ width:45%; background-color:#00451E; }
header #leader .logo .home-link{ z-index:1; position:relative; margin:0; padding:0; height:140px; min-height:0; }
header #leader .logo .home-link img{ max-width:100%; height:140px; }

header #leader .description{ width:55%; background-color:#c3c4c4; }
header #leader .description p{ z-index:1; position:relative; margin:0; padding:0; height:140px; font-size:38px; line-height:120%; white-space:nowrap; color:#000; font-family: 'Open Sans Condensed', sans-serif; }
header #leader .description p span{ display:block; }
header #leader .description p span:nth-child(1){ margin-left:18px; }
header #leader .description p span:nth-child(2){ margin-left:9px; }
header #leader .description p span:nth-child(3){}

header #leader .logo:after{ display:block; content:''; position:absolute; top:0; right:0; width:100vw; height:100%; background-color:#00451E; }
header #leader .description:before{ z-index:2; display:block; content:''; position:absolute; top:0; left:-55px; width:11px; height:100%; background-color:#fff; transform: skewX(-20deg); }
header #leader .description:after{ display:block; content:''; position:absolute; top:0; left:-50px; width:100vw; height:100%; background-color:#c3c4c4; transform: skewX(-20deg); }

/* nav */
#navbar{ z-index:10; position:fixed; top:0; margin:0 auto; padding:13px 0; max-width:none; background:#fff; }
#navbar.floatMe{ box-shadow:0 0 5px rgba(0,0,0,.75); }
#navbar nav{ max-width:none; min-height:auto; background:#ececec; }
#navbar nav .nav-menu{ margin:0 auto; max-width:1080px; background: url(images/arm.svg) no-repeat right top; background-size:auto 102%; background-position-x:790px; }
#navbar nav .nav-menu li{}

#navbar nav .nav-menu li a, #navbar nav .nav-menu li a:focus, .nav-menu li:hover > a, .nav-menu li a:hover, .nav-menu li:focus > a, .nav-menu li a:focus{ padding:13px 20px; color:#484847; font-style:normal; background:none; }
#navbar nav .nav-menu li a:hover, #navbar nav .nav-menu li a.active{ color:#ececec; background-color:#00451E; }

/* content */
#content .entry-content{ margin:0 auto; padding:0 20px; max-width:1080px; }
#content .hentry{ padding:10px 0 15px; }
#content .entry-content .hugeMe:first-child{ margin:12px 0 0; }
#content .entry-content .hugeMe:first-child + #about h1{ margin-top:40px; }

/* footer */
footer.site-footer{ text-align:left; overflow:hidden; }
footer .contentWrap{ padding:0 20px; }
footer .upperBar, footer .bottomBar{ position:relative; background-color:#00451E; }
footer .barLeft, footer .barRight{ float:left; }
footer .barLeft{ width:80%; }
footer .barRight{ width:20%; }
/* upperbar */
footer .upperBar{ margin-bottom:2px; padding:4px 0 2px; }
footer .upperBar .barLeft{  }
footer .upperBar .barLeft h2{ margin:0; color:#C2C3C3; font-size:100%; font-weight:normal; text-transform:uppercase; }
footer .upperBar .barRight{ z-index:1; position:relative; margin-top:-4px; margin-bottom:-2px; height:24px; }
footer .upperBar .barRight:before{ z-index:1; content:''; display:block; position:absolute; left:10px; width:100vw; height:100%; background:#ececec; transform: skewX(-20deg); }
footer .upperBar .barRight:after{ z-index:2; content:''; display:block; position:absolute; left:-20px; width:100%; min-width:100px; height:100%; background: url(images/arm.svg) no-repeat left top; background-size:contain; }
/* bottombar */
footer .bottomBar{ padding:20px 0; }
footer .bottomBar .barLeft{}
footer .bottomBar .barRight{ position:relative; left:-20px; }
footer .bottomBar .barRight img{ height:64px; }
footer .bottomBar p{ margin-bottom:0; color:#fff; line-height:180%; }
footer.site-footer a{ color:#fff; }

/* Contact Page */
body.page-template-contact header #leader .description p{ text-transform:uppercase; font-size:30px; color:#333; font-family: 'Open Sans', sans-serif; white-space:normal; }
body.page-template-contact header #leader .description p span{ margin:0; margin-left:-3px; text-transform:none; font-style:italic; font-size:95%; }
body.page-template-contact .contactHalf{ float:left; width:50%; }
body.page-template-contact .contactHalf textarea{ width:100%; }


@media screen and (max-width: 1090px){
	/* logo */
	header #leader .logo .home-link, 
	header #leader .logo .home-link img, 
	header #leader .description p{ height:12.5vw; font-size:3.5vw; }
	/* menu */
	#navbar nav .nav-menu{ background-position-x:88%; }
	/* Contact Page */
	body.page-template-contact header #leader .description p{ font-size:2.7vw; }
}

@media screen and (max-width: 969px){
	/* menu */
	#navbar nav .nav-menu{ background-position-x:94.5%; }
	#navbar nav .nav-menu li a, #navbar nav .nav-menu li a:focus, .nav-menu li:hover > a, .nav-menu li a:hover, .nav-menu li:focus > a, .nav-menu li a:focus{ padding:13px 2.2vw; }
}

@media screen and (max-width: 768px){
	header #leader .logo, header #leader .description{ padding:30px 20px; width:100%; }
	header #leader .logo .home-link{ height:auto; }
	header #leader .logo .home-link img{ height:140px; }
	header #leader .description p{ height:auto; font-size:24px; }
	header #leader .description p span{ display:inline; margin:0 !important; white-space:normal; }
	header #leader .logo:after, header #leader .description:before, header #leader .description:after{ display:none; }
	/* menu */
	#navbar nav .nav-menu{ background-position-x:97%; }
	#navbar nav .nav-menu li a{ padding:13px 1.3vw; }
	/* footer */
	footer .barLeft{ width:60%; }
	footer .barRight{ width:40%; }
	/* Contact Page */
	body.page-template-contact header #leader .description p{ font-size:18px; }
	body.page-template-contact .contactHalf{ float:left; width:90%; }
}

@media screen and (max-width: 643px){ 
	/* menu */
	.menu-toggle, .menu-toggle:hover, .menu-toggle:focus, .menu-toggle:active{ margin:0; padding: 8px 0 8px 20px !important; }
	#site-navigation.toggled-on .menu-anchore-menu-container{ z-index:100; padding-top:13px; background:#fff; }
	#site-navigation.toggled-on .menu-anchore-menu-container:after{ z-index:-1; content:''; display:block; position:fixed; top:0; left:0; right:0; bottom:0; background-color:#000; opacity:0.84; filter: alpha(opacity=84); }
	#navbar nav{ margin:0 auto; padding:0; max-width:1080px; min-height:0; background:#ececec url(images/arm.svg) no-repeat right top; background-size:auto 102%; }
	#navbar nav .nav-menu{ background-color:#c3c4c4; background-image:none; }
	#navbar nav .nav-menu ul{}
	#navbar nav .nav-menu ul li{}
	#navbar nav .nav-menu li a{ padding:13px 1.2vw; }
	/* Contact Page */
	/*body.page-template-contact header #leader .description p{ font-size:40px; }*/
}

@media screen and (max-width: 480px){
	/* footer */
	footer .bottomBar .barLeft,
	footer .bottomBar .barRight{ width:100%; }
	footer .bottomBar .barRight{ position:static; margin-top:15px; }
}

@media screen and (max-width: 260px){
	#navbar nav{ background-image:none; }
}



/* Clearfixing
------------------*/
#page .contentWrap:before, #page .contentWrap:after,
header:before, header:after,
#leader:before, #leader:after
{ display:table; content:''; }
#page .contentWrap:after,
header:after, #leader:after
{ clear:both; }
