/* 
# getfurther.nl css voor de 2011-site 
# auteur: getfurther
# jaar: 2011 
# copyright getfurther 
*/


/* reset margin & padding */

@font-face{ 
	font-family: 'jesaya';
	src: url('js/jesaya_free-webfont.eot');
	src: url('js/jesaya_free-webfont.eot?#iefix') format('embedded-opentype'),
	     url('js/jesaya_free-webfont.woff') format('woff'),
	     url('js/jesaya_free-webfont.ttf') format('truetype'),
	     url('js/jesaya_free-webfont.svg#webfont') format('svg');
}

*{
margin: 0;
padding: 0;
}

/* general css */

html, body
{
background-image: url(media/bg.gif);

}

/* overig */

img
{
border: none;
}

.bird{ /* twitter vogel */
z-index: 50;
position: absolute;
margin-left: 160px;
margin-top: -50px;

}

#diensten
{
list-style-image:url("media/check.png");
margin-left: 20px;
}

#diensten li
{
margin-bottom: 10px;
}

/* divisions */

#wrap
{
width: 900px;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
}

#title
{
float: left;
width: 49%;
height: 50px;
}

#menu
{
width: 220px;
float: right;
height: 50px;
}

#header
{
float: left;
width: 900px;
padding-bottom: 30px;
border-bottom: 1px solid #ddd;
}

#slideshow
{
float: left;
background: #fff;
width: 900px;
height: 300px;
margin-top: 10px;
margin-bottom: 50px;
box-shadow: 0px 20px 55px -11px #888; /* CSS3 schaduw */
-moz-box-shadow: 0px 20px 55px -11px #888;
-webkit-box-shadow: 0px 20px 55px -11px #888;
border: 1px solid #ddd;
}

#content
{
width: 556px;
float: left;
text-align: justify;
line-height: 150%;
background: #fff;
font-family: arial;
font-size: 12px;
padding: 20px;
height: 150px;
color: #666;
}

#contact
{
width: 254px;
float: right;
text-align: justify;
line-height: 150%;
background: #fff;
font-family: arial;
font-size: 12px;
padding: 20px;
height: 150px;
color: #666;
}

#block1
{
padding: 20px;
width: 253px;
float: left;
margin-right: 10px;
height: 253px;
background: #fff;
margin-top: 10px;
font-family: arial;
font-size: 12px;
color: #666;
}

#block2
{
padding: 20px;
width: 253px;
float: left;
margin-right: 10px;
height: 253px;
background: #fff;
margin-top: 10px;
font-family: arial;
font-size: 12px;
color: #666;
}

#block3
{
padding: 10px;
width: 274px;
float: right;
height: 273px;
background: #fff;
margin-top: 10px;
font-family: arial;
font-size: 12px;
color: #666;

}

#lint
{
position: absolute;
z-index: 100;
margin-top: 100px;
margin-left: 764px;
height: 63px;
width: 160px;
background-image: url(media/lint.png);
background-repeat:  no-repeat;
padding-top: 32px;
padding-left: 20px;
color: #323232;
font-family: arial;
font-size: 12px;
}

#panel
{
position: absolute;
width: 100%;
height: 500px;
top: 0px;
background: #ddd;
padding-top: 20px;
border-bottom: 1px dotted #323232;
z-index: 5000000;
display: none;
box-shadow: 0px 20px 55px -11px #888; /* CSS3 schaduw */
-moz-box-shadow: 0px 20px 55px -11px #888;
-webkit-box-shadow: 0px 20px 55px -11px #888;
}

#panelcontent
{
width: 900px;
height: 500px;
margin-left: auto;
margin-right: auto;
}

#quote
{
width: 100%;
float: left;
text-align: center;
margin-bottom: 20px;
}

#footer
{
float: left;
width: 860px;
margin-top: 10px;
padding-left: 20px;
padding-top: 20px;
font-family: arial;
font-size: 12px;
color: #999;
}

#portfolio
{
float: left;
margin-top: 10px;
width: 860px;
padding: 20px;
background: #fff;
font-family: arial;

color: #666;
font-size: 12px;
}

#portfolio p
{
font-size: 12px;
}

#tekst
{
float: left;
width: 300px;
text-align: justify;
}

#portfolio img
{
border: 1px solid #ddd;
box-shadow: 0px 0px 15px #ddd;
}

#portfolioimage
{
float: right;
}

#navigator
{
float: right;
margin-top: 20px;
}

#navigator li
{
float: left;
margin-left: 23px;
}

#navigator ul
{
list-style: none;
}

/* titles & text */

h3{
font-family: jesaya;
margin-bottom: 15px;
color: #555;
font-size: 22px;

}

h1.title
{
font-family: jesaya;
font-size: 40px;
text-decoration: none;
}

#block1 p, #block2 p, #block3 p
{
margin-top: 10px;
}

.tweet
{
color: #aaa;
padding-bottom: 10px;
border-bottom: 1px dotted #ddd;
}

#quote h3{
font-size: 28px;
}

/* navigatie */  

#menu ul
{
list-style: none;
margin-top: 26px;
margin-left: 15px;
}

#menu li
{
float: left;
margin-left: 30px;
margin-top: 0px;
}

#mainNavigation {
	float:left;
	list-style:none;
	font-size:16px;
	}

.overview
{
margin-right: 30px;
margin-bottom: 30px;
}

#mainNavigation li a {
	float:left;
	color:#666;
	text-decoration:none;
}

#mainNavigation li a:hover {
	color:#323232;
}

#mainNavigation li a.active {
	color:#111;

}

a:link, a:visited {
	color:#666;
	text-decoration: underline;
}

a:active, a:hover {
	color: #323232;
	text-decoration: none;
}

#mainNavigation li a.active {
	color:#111;
}

#contact_form ul
{
list-style: none;
}

input
{
float: left; 
clear: both;
width: 300px;
padding: 10px;
border: 1px dotted #323232;
background: #ededed;
margin-bottom: 5px;
font-size: 12px;
}

textarea
{
font-family: arial;
clear: both;
padding: 10px;
float: left;
width: 300px;
border: 1px dotted #323232;
height: 250px;
background: #ededed;
margin-bottom: 5px;
font-size: 12px;
}

.submit_btn
{
float: left;
width: 100px;
}

#contactweg
{
float: right;
margin-top: 350px;
}

#gegevens
{
margin-top: 4px;
float: left;
height: 500px;
width: 300px;
font-family: arial;
font-size: 12px;
color: #666;
line-height: 150%;
}

#gegevens p
{
margin-bottom: 10px;
}

#contact_form
{
float: left;
font-family: arial;
font-size: 12px;
width: 400px;
height: 500px;
}

a.homelink
{
text-decoration: none;
}

.portfoliolink
{
position: absolute;
background-image: url(media/button.gif);
background-repeat: no-repeat;
width: 182px;
display: block;
color: #ddd;
height: 25px;
padding-top: 9px;
padding-left: 15px;
top: 780px;
border: none;
}

.portfoliolink:hover
{
background-position: 0 -34px;
}

a.portfoliolink
{
color: #ddd;
}

#nav { z-index: 50; position: absolute; bottom: 20px; right: 20px; font-size: 12px; }
#nav a { margin: 0 5px; padding: 3px 5px; background: #eee; text-decoration: none; font-family: arial;}
#nav a.activeSlide {	background:none repeat scroll 0 0 #34D3F9; }