/* RESET.CSS */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {	margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit;	font-size: 100%;font-family: inherit; vertical-align: baseline; }
:focus { outline: 0; }

html, body { height: 100%; color: black; background: #222; font-family: Verdana; font-size: 11px; }
.wrapper{margin: 0 auto; width: 988px;}

h1, h2, h3 { color: #FF3333; }
h2 { font-size: 22px; margin-bottom: 10px; }
h3 {font-size: 14px;}
a { color: #FF3333; }
p { line-height: 1.8em; }

/*Header*/
#header {height: 125px; background: #333 url(../images/header_bg.png) bottom repeat-x; border-bottom: 1px solid #FF3333;}
#header .wrapper{ background: transparent url(../images/header_wrapper_bg.png) no-repeat; height: 100%;}
#header h1#logo { background:url(../images/logo.png) no-repeat top left; height:120px; width:250px; margin:0; }
#header h1#logo a { text-indent: -999px; display: block; height:120px; width:250px; margin:0; }

#header .menu { position: absolute; margin: -65px 0 0 320px; z-index: 2; width: 500px; }
#header .menu a { float: left; padding: 20px; margin: 0 10px; font-size: 26px; text-decoration: none; color: #ccc; }
#header .menu a:hover { border-bottom: 5px solid #FF3333; }


#header a#twitter_vogel { position: absolute; top: 85px; right: 5%; width: 50px; height: 50px; background: url('../images/twitter_vogel.png') left top no-repeat;}
#header a#twitter_vogel:hover { background: url('../images/twitter_vogel.png') right top no-repeat; }

#projecten { background: #fff url(../images/portfolio_bg.png) top repeat-x; min-height: 365px; padding-top: 10px; clear: both; }
#nieuw { position: absolute; float: left; margin-left: 450px;  top: 135px; width: 100px; height: 100px; background: url(../images/nieuw.png) no-repeat; z-index: 999; }
#slogan { float: right; width: 380px; padding: 90px 10px;}
#slogan h1, #slogan h2 a { font-size: 26px; }
#slogan h1.grijs { color: #999; margin-bottom: 30px }

#info { background: #444 url(../images/diensten_bg.png) top repeat-x; min-height: 250px; padding: 24px 0 10px 0; clear: both; border-bottom: 1px solid #333; }
#info:after { /* for firefox */ content: ""; display: block; height: 0; clear: both; }
#info h2 { color: #fff; }

#wie-zijn-wij { float: left; width: 240px; min-height: 200px; padding: 10px 10px 0 10px;}
#wie-zijn-wij p { color: #ccc; clear: both;}
#wie-zijn-wij a{ color: #ddd; font-weight: bold}

#wat-doen-wij { float: left; width: 623px; margin-top: 10px; padding: 0 20px; border-left: 1px solid #333; border-right: 1px solid #333; }
#wat-doen-wij table{border-collapse: collapse;}
#wat-doen-wij tr{border: 1px solid #666; padding-bottom: 10px;}
#wat-doen-wij td{background: #EFEFEF; padding: 5px; font-size: 10px;}
#wat-doen-wij td h3{padding-left: 5px; text-align: right}
#wat-doen-wij td p{padding-left: 10px;margin: 0; border-left: 1px solid #FF3333}

/* root element for tabs  */
ul.css-tabs { margin:0 !important; padding:0; height:30px; border-bottom:1px solid #666; }
/* single tab */
ul.css-tabs li { float:left; padding:0; margin:0; list-style-type:none; }
/* link inside the tab. uses a background image */
ul.css-tabs a { float:left; font-size:11px; display:block; padding:5px 19px; text-decoration:none; border:1px solid #666; border-bottom:0px; height:18px; background-color:#efefef; color:#777; margin-right:2px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright:4px; position:relative; top:1px; }
ul.css-tabs a:hover { background-color:#F7F7F7; color:#333; }
/* selected tab */
ul.css-tabs a.current { background-color:#ddd; border-bottom:2px solid #ddd; color:#000; cursor:default; }
/* tab pane */
.css-panes div { display:none; border:1px solid #666; border-width:0 1px 1px 1px; min-height:150px; padding:15px 20px; background-color:#ddd; }
#info .css-panes div h1, #info .css-panes div h2, #info .css-panes div h3 { color: #FF3333; }
#info .css-panes div p a { font-weight: bold; }

.top_btn { float: right; width: 42px; padding: 10px 10px 0 10px; }
.top_btn a {width: 42px; height: 42px; display: block; background: url(../images/top_button.png) left no-repeat; }
.top_btn a:hover { background: url(../images/top_button.png) right no-repeat; }
#portfolio { background: #fff url(../images/info_bg.png) top repeat-x; border-top: 1px solid #FF3333; min-height: 400px; padding: 10px 0 10px 0; clear: both; }
#portfolio:after { /* for firefox */ content: ""; display: block; height: 0; clear: both; }
#portfolio_list { float: left; width: 900px; padding: 0 7px 0 10px; border-right: 1px solid #ccc;}
#portfolio_text { color: #666; }

#contact { background: #fff url(../images/info_bg.png) top repeat-x; border-top: 1px solid #999; min-height: 220px; padding-bottom: 10px; clear: both; }
/* #contact { background: #444 url(../images/diensten_bg.png) top repeat-x; min-height: 250px; padding: 25px 0 10px 0; clear: both; border-bottom: 1px solid #333; color: #fff } */
#contact:after { /* for firefox */ content: ""; display: block; height: 0; clear: both; }
#contactgegevens { float: left; width: 200px; padding: 10px 10px 0 10px; }
#contactgegevens img { margin: 5px 5px 0 0; float: left; }
#contactgegevens h3 { display: block; padding: 15px 0;}
#contactgegevens h3.twee { padding: 5px 0;}

#contactformulier { float: left; width: 300px; padding: 10px 20px 0 20px; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }

#form { width: 299px; float: left; }
#form input { width: 250px; margin: 0 0 20px 0; border: none; background: none; margin: 13px 0 0 8px; padding: 0 0 0 3px; font-size: 1.4em; }
#form .input-bg { background: url(../images/form-sm-bg.png) bottom left no-repeat transparent; height: 45px; margin-bottom: 10px; position: relative; }
#form .active { background: url(../images/form-sm-bg.png) top left no-repeat transparent;}
#form textarea { width: 285px;height: 159px;display: block;border: none;background: none;margin: 0 0 0 10px;padding: 13px 0 13px 0;font-family: Helvetica, sans-serif;font-size: 1.3em;overflow: auto;}
#form .message-bg {background: url(../images/message-bg.png) bottom left no-repeat transparent;width: 299px;height: 188px;}
#form .active {background: url(../images/message-bg.png) top left no-repeat transparent;}
label {display: block;text-indent: 10px;font-weight: bold;}
label.error {position: absolute;top: -16px;right: 49px;padding: 3px;color: #da3939;font-size: 1.0em;text-align: right;font-style: italic;font-weight: normal;}
#form .submit-button {width: 105px;height: 36px;float: right;padding-right: 2px;}
/* error message */
.error {height:15px;background-color:#FF3333;border:1px solid #FF3333;font-size:11px;color:#fff;padding:3px 10px;margin-left:-2px;-moz-border-radius:4px;-webkit-border-radius:4px;-moz-border-radius-bottomleft:0;-moz-border-radius-topleft:0;-webkit-border-bottom-left-radius:0;-webkit-border-top-left-radius:0;-moz-box-shadow:0 0 6px #ddd;-webkit-box-shadow:0 0 6px #ddd;}


#laatste_nieuws { float: left; width: 323px; padding: 10px 20px 0 20px; border-right: 1px solid #ccc; }


/*Footer*/
#footer {background: #222; border-top: 1px solid #ff3333; color: #ccc; padding: 5px 0; width:100%; height: 40px; margin:0px auto;}
#footer p#right { float: right; font-size: 10px; width: 300px; text-align: right; margin-right: 10px}
#footer p#left { float: left; font-size: 10px; width: 300px; text-align: left; margin-left: 10px;}