/*
Theme Name: Earl Grey
Theme URI: http://bldng.nl/
Description: Portfolio
Version: 1
Author: Sebas van den Brink
Author URI: http://bldng.nl/
Tags: bldng, bldng, bldng
*/

/* RESET */
html {
    color:#fff;
    background:#333;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {
    margin:0;
    padding:0;
}

body {
	padding: 0;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

fieldset,img {
    border:0;
}

address,caption,cite,code,dfn,strong,th,var {
    font-style:normal;
    font-weight:normal;
}

li {
    list-style:none;
}

caption,th {
    text-align:left;
}

h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
}

q:before,q:after {
    content:'';
}

abbr,acronym {
    border:0;
    font-variant:normal;
}

/* to preserve line-height and selector appearance */
sup { vertical-align:text-top; }
sub { vertical-align:text-bottom; }
input,textarea,select { font-family:inherit;font-size:inherit;font-weight:inherit; }

/*to enable resizing for IE*/
input,textarea,select{ *font-size:100%; }

/*because legend doesn't inherit in IE */
legend { color:#000; }

/* RESET */
html {
	overflow-x: hidden;
	overflow-y: scroll;
}


body {
	height: 100%;
    font-family: Trebuchet, "Trebuchet MS", Trebuchet, Tahoma, Arial, serif;
	color: #fff;
	background-color: #333;
}

/* *** TEXT *** */
/* ALGEMEEN */
a:link { color: #2486eb; text-decoration: none; }
a:visited { color: #2486eb; text-decoration: none; }
a:hover { color: #fff; text-decoration: underline; }
a:active { color: #fff; text-decoration: underline; }

.clr {
	clear: both;
}

p {
    margin: 0;
    padding: 0;
}

.left_entry_about p {
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
}

	.left_entry_about p.naar_info {
		font-weight: bold;
		margin-bottom: 0 !important;
	}

#info_links p {
	max-width: 900px;
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
}

#info_links blockquote {
	margin-left: 30px;
	background-color: #333;
	max-width: 800px;
	padding: 0 5px 0 5px;
	border-left: 5px solid #2486eb;
}

#info_links blockquote p {
	font-size: 100% !important;
	font-weight: bold;
	font-style: oblique;
	color: #eaeaea !important;
}

#info_rechts {
	font-size: 0.7em;
}

#credits p {
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
}

#main_bar_content h2 {
	float: left;
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
	font-weight: bold;
	width: auto;
	display: block;
	background-color: #000;
	padding: 0 5px 0 5px;
}	

#main_bar_content var {
	float: left;
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
	width: auto;
	display: block;
	background-color: #2486eb;
	padding: 0 3px 0 3px;
}	

	#main_bar_content var.new {
		color: #000 !important;
		background-color: #ff0 !important;
	}

	#main_bar_content var.win {
		color: #fff !important;
		background-color: #db1b1c !important;
	}

#blog_box p {
	color: #333;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
}

#blog_box h2 {
	float: left;
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
	font-weight: bold;
	width: auto;
	display: block;
	background-color: #000;
	padding: 0 5px 0 5px;
}	

#blog_box var {
	float: left;
	color: #fff;
	font-size: 0.8em;
	margin-bottom: 20px;
	line-height: 2em;
	width: auto;
	display: block;
	background-color: #2486eb;
	padding: 0 3px 0 3px;
}

#blog_box blockquote {
	margin-left: 30px;
	background-color: #efefef;
	max-width: 800px;
	padding: 0 5px 0 5px;
	border-left: 5px solid #2486eb;
}

#blog_box blockquote p {
	font-size: 100% !important;
	font-weight: bold;
	font-style: oblique;
	color: #666 !important;
}

	
/* *** LISTS & THEIR LINKS *** */
#info_rechts ul li {
	margin: 5px 0 5px 0;
}

#browser_box  ul li {
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	list-style-type: none;
	display: inline;
	margin-right: 15px;
	/*background-color: #2486eb;*/
	
}

	#browser_box a { padding: 0 5px 0 5px; }
	#browser_box a:link { color: #fff; text-decoration: none; background-color: #2486eb; }
	#browser_box a:visited { color: #fff; text-decoration: none; background-color: #2486eb; }
	#browser_box a:hover { color: #2486eb; text-decoration: none; background-color: #fff; }
	#browser_box a:active { color: #2486eb; text-decoration: none; background-color: #fff; }

#contact_bar_left ul li {
	font-size: 0.7em;
	color: #8d8d8d;
	list-style-type: none;
	display: inline;
	margin-right: 30px;
}

	#contact_bar_left a:link { color: #8d8d8d; text-decoration: underline; }
	#contact_bar_left a:visited { color: #8d8d8d; text-decoration: underline; }
	#contact_bar_left a:hover { color: #fff; text-decoration: underline; }
	#contact_bar_left a:active { color: #fff; text-decoration: underline; }

#contact_bar_right ul li {
	font-size: 0.7em;
	color: #fff;
	list-style-type: none;
	display: inline;
	margin-left: 30px;
	color: #8d8d8d;
}

	#contact_bar_right a:link { color: #8d8d8d; text-decoration: underline; }
	#contact_bar_right a:visited { color: #8d8d8d; text-decoration: underline; }
	#contact_bar_right a:hover { color: #fff; text-decoration: underline; }
	#contact_bar_right a:active { color: #fff; text-decoration: underline; }

.footer_list ul li {
	font-size: 0.7em;
	margin: 10px 0 10px 0;
	color: #535353;
}

	.footer_list a:link { color: #535353; text-decoration: none; }
	.footer_list a:visited { color: #535353; text-decoration: none; }
	.footer_list a:hover { color: #2486eb; text-decoration: underline; }
	.footer_list a:active { color: #fff; text-decoration: underline; }
	
/* *** DIVS *** */
.announcement {
	width:50%;
	background-color:yellow;
	padding:5px;
	color:black;
	font-weight:bold;
	border-bottom:1px solid #000;
	border-left:1px solid #000;
	position:fixed;
	z-index:100;
	top:0;
	right:0;
}

#big_blank {
	height: 570px;
	width: 100%;
	position: absolute;
	z-index: 50;
	top:0;
	left:0;
}

	#big_blank img {
		height: 570px;
		width: 100%;
	}

#intro_top {
	width: 100%;
	height: 570px;
	background-color: #fff;
	background-image: url("images/entry_bg.jpg");
	background-repeat: no-repeat;
	background-position: top right;
}

	#intro_top_bar {
		width: 100%;
		height: 175px;
	}

		#intro_top_bar_logo {
			margin: 60px 0 0 80px;
			float: left;
			width: 121px;
			position: absolute;
			z-index: 75;
			top:0;
			left:0;
		}
		
		#into_entry_text {
			margin-left: 80px;
		}

#top_bar {
	width: 100%;
	height: 175px;
	background-color: #fff;
}

	#top_bar_logo {
		margin: 60px 0 0 80px;
		float: left;
		width: 121px;
	}

	#top_bar_menu {
		margin: 60px 0 0 0;
		float: left;
	}
	
		#top_bar_menu .menu_item {
			margin-left: 70px;
			float: left;
		}

#blog_bar  {
	width: 100%;
	background-color: #fff;
	padding-top: 25px;
}	

	#blog_box {
		padding: 30px 80px 30px 80px;
		max-width: 900px;
	}
		
#main_bar {
	width: 100%;
	background-color: #3f3f3f;
	border-top: 20px solid #000;
}	

	#main_bar_content {
		border-top: 5px solid #2486eb;
		padding: 30px 80px 20px 80px;
	}
		
		#info_links {
			float: left;
			clear: both;
			width: 74%;
		}
		
		#info_rechts {
			float: right;
			clear: right;
			width: 24%;
		}
	
		#entry_points {
			/* tbd */
		}
		
			#entry_points_left {
				float: left;
				/*clear: both;*/
				width: 49%;
				min-width: 650px;
				margin-right: 10px;
				margin-bottom: 10px;
			}
			
				.left_entry_item {
					float: left;
					width: 205px;
					margin-right: 10px;
				}
			
				.left_entry_about {
					float: left;
					width: 410px;
					margin-right: 10px;
				}
		
			#entry_points_right {
				float: left;
				/*clear: right;*/
				max-width: 340px;
				min-width: 233px;
			}

	#browser_box {
		/* tbd */
	}
	
#contact_bar {
	background-color: #535353;
	padding: 15px 80px 18px 80px;
}

	#contact_bar_left {
		float: left;
		clear: both;
		width: 69%;
	}

	#contact_bar_right {
		float: right;
		clear: right;
		text-align: right;
		width: 29%;
	}
		
#footer_bar {
	width: 100%;
	background-color: #333;
}

	#footer_bar_box {
		margin: 30px 0 30px 80px;
	}
	
		.footer_list {
			float: left;
			width: 160px;
			padding-right: 10px;
		}

/* *** TABLES *** */
#credits table {
	max-width: 530px;
	background-color: #222;
	font-size: 0.7em;
}
		
/* *** IMAGES *** */
img {
	border: 0;
}

.pag_kop {
	margin-bottom: 20px;
}

.entry_kop {
	margin-bottom: 5px;
}

.footer_list  img {
	margin-bottom: 5px;
}

/* *** THUMBNAIL PAGINA'S *** *//* text */
h4 {
    font-size: 0.7em;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    color: #fff;
    position: absolute;
    top: 105px;
    left: 0;
    z-index: 2;
}

h4 b {
	font-weight: normal;
        color: #2486eb;
}

	.port___item p {
        font-size: 0.7em;
        line-height: 1.2em;
        color: #fff;
        position: absolute;
        top: 118px;
        left: 0;
        z-index: 2;
    }
    
    .port___item p b {
        color: #2486eb;
        font-weight: normal;
    }

	.port___item p a:link { color: #888; text-decoration: none; }
	.port___item p a:visited { color: #888; text-decoration: none; }
	.port___item p a:hover { color: #888; text-decoration:  none; }
	.port___item p a:active { color: #888; text-decoration:  none; }

    .port___item var {
        font-size: 0.75em !important;
        line-height: 1.2em;
        color: #000 !important;
        display: block;
        background-color: #ffcc00 !important;
        padding: 3px 4px 1px 3px !important;
        font-style: normal;
		font-weight: bold;
        text-transform: uppercase;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 4;
    }

    .port___item dfn {
        font-size: 0.7em;
        line-height: 1.2em;
        color: #fff;
        display: block;
        background-color: #db1b1c;
        padding: 2px;
        font-style: normal;
        text-transform: uppercase;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 4;
    }
	
	/* speciaal voor op de gemengde index pagina: */
	
    /*.port___item var.index {
        top: 16px;
		padding-top: 2px !important;
    }*/

    .port___item var.cat {
		font-weight: normal;
        text-transform: lowercase;
        background-color: #94a5b5 !important;
		padding-top: 2px !important;
		color: #fff !important;
    }

    /*.port___item dfn.index {
        top: 16px;
    }*/
	
/* divs */
.port___item {
	float: left;
	position: relative;
	height: 138px;
	width: 205px;
}
            
.port___tm_dobbelganger {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	height: 128px;
}

.port___thumb {
    width: 205px;
    height: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#port___viewbox {
	margin-top: 10px;
	position: relative;
}
				
.image_only {
	padding-bottom: 10px;
}	

#port___viewbox .ontop {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

#port___viewbox .onbottom {
   position: relative;
    /*top: 0;
    left: 0;
    z-index: 1;*/
}

/* *** ONMOUSEOVER *** */
.over1 {
    opacity: 0.75;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=75);

}
.over2{
    opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);

}

/* *** BOXOVER *** */
.dvhdr1 {
	background:#f3f0e7;
	font-size: 0;
	padding: 0;
}
		 
.dvbdy1 {
	background:#2486eb;
	font-size: 0.8em;
	color: #fff;
	padding:5px;
	font-weight: bold;
}