/*
Title:      Screen styles
Author:     http://ivaldi.nl
Copyright:	2009, Ivaldi, VOF. All rights resevered (please don't re-use without permission).

colors
- Red						ff2b06	rgba(255,43,6)
- Dark Blue block teaser	7A99AE	rgba(0,0,0,0.2);
- Nav bar black				151d23

*/

@import url("reset.css");
@import url("supersized.core.css");


body {
	font-family: "Helvetica Neue", Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", FreeSans, sans-serif;
	font-size: 62.5%;
	color: #000;
	text-align: center;
	background: #fff;
}

#container{
	clear: both;
	text-align: left;
	width: 960px;
	margin: 0 auto;
	font-size: 1.2em;
}

#nevergrow{
	margin-left: 55px;
}

/* header
--------------------------------------------- */

#header-wrap{
	font-size: 1.2em;
	background: #fff;
	/*height: 138px;*/
	height: 154px;
	min-width: 980px;
	width: 100%;
}

#header{
	text-align: left;
	width: 960px;
	margin: 0 auto;
	padding: 30px 0px;
}

#header h1{
	margin: 0;
}

#header h1 a{
	float: left;
	display: block;
	width: 359px;
	height: 80px;
	background: url(../img/logo.png) no-repeat;
	text-indent: -999em;
}

/* search
--------------------------------------------- */
#search{
	float: right;
	margin-right: 20px;
	position: relative;
	width: 125px;
	margin-top: 58px;
}

#search input{
	position: absolute;
	top: 0;
	left: 0;
	width: 102px;
	height: 22px;
	line-height: 22px;
	color: #ff2b06;
	font-weight: bold;
	border: 1px solid #d8d5d5;
	border-right: none;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	padding: 0px 2px;
}

#search button{
	position: absolute;
	top: 0px;
	left: 102px;
	background: url(../img/search-bg.png) no-repeat center center;
	text-indent: -999em;
	width: 23px;
	height: 24px;
	border: 1px solid #d8d5d5;
	border-left: none;
	cursor: pointer;
	-webkit-border-top-right-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-topright: 4px;
	-moz-border-radius-bottomright: 4px;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

/* target webkit only to fix pixel bug
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#search button{
		top: 0px;
	}
	#search{
		margin-top: 56px;
	}
}*/

/* top navigation (top right)
--------------------------------------------- */

#top-nav{
	border-top: 1px solid #666;
	float: right;
	list-style: none;
	width: 110px;
}

#top-nav li{
	border-bottom: 1px solid #e2e2e2;
	margin: 0;
	padding: 2px;
}

#top-nav li a{
	color: #000;
	text-decoration: none;
	font-weight: bold;
}

#top-nav li a:hover{
	color: #ff2b06;
}

#top-nav li.current_page_item a{
	color: #ff2b06;
}

/* navigation bar
--------------------------------------------- */
#nav-bar{
	border-top: 3px solid #ff2b06;
	background: #151d23;
	height: 40px;
	line-height: 40px;
	padding: 0 5px 0 20px;
	margin-top: -3px;
	text-transform: uppercase;
	font-size: 1.2em;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	z-index: 999;
	width: 935px;
	position: relative;
}

#nav{
	float: left;
	list-style: none;
	padding: 0;
}

#nav li{
	float: left;
	margin-left: 0;
}

#nav li a{
	display: block;
	float: left;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	margin-right: 20px;
}

#nav li a span{
	text-transform: lowercase;
}

#nav li.current_page_item a{
	color: #ff2b06;
}

#nav li a:hover, #nav li:hover > a{
	color: #ff2b06;
}

#nav li ul{
	display: none;
	position: absolute;
	top: 100%;
	list-style: none;
}

#nav li:hover ul{
	display: block;
}

#nav li ul li{
	float: none;
}

#nav li ul li a{
	background: #151d23;
	display: block;
	width: 100%;
	padding: 0 20px;
}

#nav li ul li a:hover{
	background: #333;
}

#nav li ul li:last-child a{
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}

#follow{
	float: right;
	height: 40px;
}

#follow h4{
	margin: 0 20px 0 0;
	float: left;
	color: #616161;
	font-size: 0.8em;
}

#follow .socials{
	float: right;
	margin-top: 12px;
}

/* content-teaser
--------------------------------------------- */
#content-teaser{
	margin-top: 50px;
	margin-left: 260px;
	color: #fff;
}

#content-teaser .date{
	font-size: 3em;
	text-transform: uppercase;
	margin: 0;
}

#content-teaser h2{
	font-size: 4em;
	text-transform: uppercase;
	margin: 0;
}

#content-teaser .slogan{
	font-size: 1.6em;
	font-weight: normal;
}

#content-teaser .block{
	padding: 20px;
	padding-right: 200px;
	border-top: 3px solid #ff2b06;
	background: #7A99AE;
	background: rgba(0,0,0,0.2);
}

/* social media icons
--------------------------------------------- */
.socials li{
	margin: 0;
	list-style: none;
	float: left;
	background-repeat: no-repeat;
}

.socials li a{
	display: block;
	width: 16px;
	height: 16px;
	text-indent: -999em;
	margin-right: 5px;
}

.socials .fb{ background: url(../img/socials/fb.png) no-repeat }
.socials .tw{ background: url(../img/socials/tw.png) no-repeat }
.socials .in{ background: url(../img/socials/in.png) no-repeat }
.socials .vm{ background: url(../img/socials/vm.png) no-repeat }
.socials .yt{ background: url(../img/socials/yt.png) no-repeat }
.socials .gp{ background: url(../img/socials/gp.png) no-repeat }
.socials .fl{ background: url(../img/socials/fl.png) no-repeat }
.socials .insta{ background: url(../img/socials/insta.png) no-repeat }

.share{
	margin: 0;
	padding: 0;
	float: right;
}

.share li {
	display: inline;
	margin: 0;
	padding: 0;
}

.share li a{
	font-size: 11px;
}

.share li.linkedin{
	position: relative;
	top: -13px;
	left: -5px;
}

.share li img{
	vertical-align: middle;
}

.share li.del{
	position: relative;
	top: -6px;
}

.share li.fb {
	position: relative;
	top: 5px;
	left: 10px;
}



/* content
--------------------------------------------- */

#content, #blog-content{
	clear: both;
	float: left;
}

#blog-content{
	width: 980px; /* 20 more pixels! - not visually used though! */
}

/* full-post (article page) - post (blog)
--------------------------------------------- */
.fullwidth{
	width: 920px !important;
}

.full-post, .post{
	position: relative;
	width: 680px;
	background: #fff;
	padding: 20px 20px 0 20px;
	border: 1px solid #e2e2e2;
	margin-bottom: 20px;
}

.post{
	width: 428px; /* two on a row */
	margin-right: 20px;
}

.post-half-width{
	position: absolute;
	float: left;
}

.full-post h2, .post h2{
	color: #ff2b06;
	margin-bottom: 0;
	text-transform: uppercase;
	font-size: 2em;
}

.full-post h3, .post h3{
	color: #ff2b06;
	font-size: 1.2em;
	text-transform: uppercase;
}

.full-post h4, .post h4{
	font-size: 1.2em;
}

.full-post a, .post a{
	color: #ff2b06;
}

.full-post a:hover, .post a:hover{
	color: #000;
	text-decoration: underline;
}


/* used for the 'x' in TEDx */
#blog-content h2 span, #content h2 span{
	text-transform: lowercase;
}

p.author{
	font-style: italic;
	padding-bottom: 10px;
	border-bottom: 1px solid #e2e2e2;
	margin-bottom: 10px;
	background: url(../img/klok.png) no-repeat;
	padding-left: 20px;
}

p.intro{
	font-weight: bold;
}

p.meta{
	border-top: 1px solid #e2e2e2;
	padding-top: 10px;
	color: #ff2b06;
	font-style: italic;
}

p.meta a{
	text-decoration: none;
	color: #ff2b06;
}

p.meta a:hover{
	text-decoration: underline;
}

span.cat{
	visibility: hidden;
}

span.cat em { /* abs pos top right */
	visibility: visible;
	position: absolute;
	background: #ff2b06;
	color: #fff;
	top: -10px;
	right: -10px;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	padding: 2px 8px;
	text-transform: uppercase;
	font-size: 0.9em;
	letter-spacing: 0.1em;
	font-style: normal;
}

.post object{
	margin-left: -21px;
}

.post.video p.author,
.post.video p.meta{
	border: none;
}

object, embed, iframe{
	margin-bottom: 10px;
}

/* post comment div (on article page)
--------------------------------------------- */
.post-comment{
	width: 670px;
	background: #fff;
	padding: 20px 20px 0 20px;
	border: 1px solid #e2e2e2;
}

.post-comment h3{
	font-size: 2em;
	color: #ff2b06;
	margin-bottom: 0;
	text-transform: uppercase;
	clear: both;
}

.comment-notes{
	font-style: italic;
	padding-bottom: 10px;
	border-bottom: 1px solid #e2e2e2;
}

#respond label{
	float: left;
	width: 125px;
	padding: 4px 0;
}

.comment-form-author,
.comment-form-email,
.comment-form-url,
.comment-form-comment,
.form-allowed-tags{
	float: left;
	width: 100%;
	clear: left;
}

#respond input, #respond textarea{
	background: url(../img/form-bg.png) repeat-x;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

#respond input{
	float: left;
	padding: 4px;
}

#respond textarea{
	float: left;
	width: 532px;
	padding: 4px;
}

#respond #submit{
	clear: left;
}

.form-submit{
	clear: left;
	width: 100%;
}

.form-submit #submit{
	float: right;
	color: #fff;
	text-transform: uppercase;
	background: #ff2b06;
	border: none;
	padding: 4px 8px;
	cursor: pointer;
}

.comment-form-author .required,
.comment-form-email .required{
	float: right;
}

#commentform{
	margin-bottom: 20px;
}

#commentform:after{
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* comments itself
--------------------------------------------- */

h3#comments-title{
	padding-bottom: 10px;
	border-bottom: 1px solid #e2e2e2;
}

ol.commentlist{
	float: left;
	list-style: none;
	margin-top: 20px;
	margin-bottom: 20px;
}

ol.commentlist li{
	margin-left: -20px;
	float: left;
	border-bottom: 1px solid #e2e2e2;
	width: 670px;
	padding: 10px 20px 0 20px;
}

ol.commentlist li li{
	margin-top: 10px;
	border-bottom: none;
	background: #e2e2e2;
	margin-bottom: -9px;
	list-style: none;
}

ol.commentlist li li.odd{
	background: #e2e2e2;
}

ol.commentlist .odd{
	background: #eee;
}

.comment-author{

}

.comment-author a{
	color: #ff2b06;
}

.comment-author img{
	float: left;
	margin: 0 20px 20px 0;
}

.comment-author .fn{
	color: #ff2b06;
	font-size: 1.3em;
	font-style: normal;
}

.comment-author .says{
	display: none;
}

.comment-meta{
	font-size: 0.9em;
}

.comment-meta a{
	text-decoration: none;
}

.comment-body{
	margin-top: 10px;
}

.reply{
	display: none;
}

/* show more
--------------------------------------------- */
#showmore{
	width: auto;
	background: none;
	padding: 0;
	border: none;
	margin-bottom: 0;
}


/* sidebar
--------------------------------------------- */

#sidebar{
	float: right;
	width: 185px;
	background: #fff;
	padding: 20px 20px 0 20px;
	border: 1px solid #e2e2e2;
}

#archives{
	list-style: none;
}

#sidebar h4{
	font-size: 1.4em;
	color: #ff2b06;
	padding-bottom: 10px;
	border-bottom: 1px solid #e2e2e2;
	text-transform: uppercase;
	margin-bottom: 10px;
}

#archives li{
	margin-left: 0;
	margin-bottom: 8px;
}

#archives li a{
	text-decoration: none;
	color: #000;
}

#archives li a:hover{
	color: #ff2b06;
}

/* footer
--------------------------------------------- */

#footer-wrap{
	clear: both;
	margin-top: 150px;
	background: #000;
	background: rgba(0,0,0,0.8);
	color: #fff;
	text-align: center;
	height: 90px;
	position: ;
	bottom: 0;
	min-width: 980px;
	width: 100%;
}

#footer{
	width: 960px;
	text-align: left;
	margin: 0 auto;
	padding: 20px 10px;
	text-transform: uppercase;
	font-weight: bold;
}

#footer a{
	color: #fff;
	text-decoration: none;
}

#footer .license{
	float: left;
}

#bottom-nav{
	float: right;
	list-style: none;
}

#bottom-nav li{
	display: inline;
	margin-left: 10px;
}

#footer .socials{
	clear: both;
	float: right;
	margin-top: -10px;
	margin-right: -5px;
}

#footer .socials li a{
	margin-right: 0;
	margin-left: 5px;
}




/* basis text formatting
--------------------------------------------- */

a, a:visited {
	color: #000;
}

a:hover{
	text-decoration: none;
}

h1{ font-size: 2em; }
h2{ font-size: 1.8em; }
h3{	font-size: 1.6em; }
h4{ font-size: 1.4em; }
h5{	font-size: 1.2em; }
h6{ font-size: 1em; }

ul{
	list-style: disc;
}

ol{
	list-style: decimal;
}

li{
	margin-left: 30px;
}

p{
	line-height: 1.5em;
}

p.intro{
	font-size: 1.1em;
}

p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset {
	margin-bottom: 20px;
}

table thead td{
	background: #eee;
	font-weight: bold;
}

table td{
	border: 1px solid #ccc;
	padding: 10px;
}

pre {
	font-family: "Courier 10 Pitch", Courier, monospace;
}

code {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}


/* wordpress
--------------------------------------------- */

img.alignleft{
	float: left;
	margin: 10px 10px 10px 0;
}

.alignleft{
	float: left;
	margin: 10px 10px 10px 0;
}

img.alignright{
	float: right;
	margin: 10px 0 10px 10px;
}

.alignright{
	float: right;
	margin: 10px 0 10px 10px;
}



/* misc.
--------------------------------------------- */

a img{
	border: none;
}

hr {
	border: 0 solid #ccc;
	border-top-width: 1px;
	clear: both;
	height: 0;
}


.round{
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.hide{
	display: none;
}

.clear{
	clear: both;
}

.group:after{
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.mc_custom_border_hdr{
	font-weight: bold !important;
}

.mc_input{
	width: 200px !important;
}

.mc_signup_submit{
	text-align: left !important;
}

#mc_signup_submit{
	margin-top: 0 !important;
	margin-bottom: 1.5em !important;
	width: auto !important;
}


/* Post full width
--------------------------------------------- */
.first-full-post a:hover, .first-full-post a:visited{
	color: #fff;
}

.first-full-post{
	margin-top: 20px;
}

.post-full-width{
	width: 920px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.post-full-width h2{
	margin-top: 10px;
	margin-bottom: 10px;
}

.post-full-width .alignleft{
	margin-right: 20px;
}

.post-full-width .alignright{
	margin-left: 20px;
}

.no-border{
	border: 0 !important;
}

.bg-dark{
	background: #151D23;
	color: #fff;
}

.bg-dark-link{
	text-decoration: none;
}

.bg-dark-link:hover{
	color: #fff !important;
}

/* Twitter cards
--------------------------------------------- */
.twitter-tweet{
	width: 430px;
	float: left;
}

.twitter-tweet{
	margin-right: 20px !important;
}

/* Cycle
--------------------------------------------- */
.cycle-next, .cycle-prev{
	display: block;
	position: absolute;
	background: #151D23;
	color: #fff;
	top: 48%;
	width: 25px;
	height: 28px;
	text-indent: -9999px;
}

.cycle-next{
	right: -26px;
	background: url(../img/cycle-next.png);
}

.cycle-prev{
	left: -26px;
	background: url(../img/cycle-prev.png);
}
.cycle-slide{
	vertical-align: top;
}
.twitter-tweet-rendered{
	border: none !important;
	box-shadow: none !important;
}

/* Video
--------------------------------------------- */

.play-video-container{
	position: relative;
}

.play-video{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -43px;
	margin-top: -32px;
	width: 85px;
	height: 64px;
	background: url(../img/play.png) no-repeat;
	text-indent: -9999px;

}



.post-half-width{
	height: 235px;
	position: relative;
}

.post-half-width .meta{
	position: absolute;
	bottom: 0;
	margin-bottom: 0;
	padding-top: 5px;
	left: 20px;
	right: 20px;
	padding-bottom: 5px;
}

.post-full-width{
	height: auto;
}