@font-face {
	font-family: 'TitilliumText';
	src: url('http://www.pep-up.nl/font/TitilliumText22L003-webfont.eot');
	src: local(' '), url('http://www.pep-up.nl/font/TitilliumText22L003-webfont.woff') format('woff'), url('http://www.pep-up.nl/font/TitilliumText22L003-webfont.ttf') format('truetype'), url('http://www.pep-up.nl/font/TitilliumText22L003-webfont.svg#webfontHRGKS7uh') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'DigitalDream';
	src: url('http://www.pep-up.nl/font/DIGITALDREAM-webfont.eot');
	src: local(' '), url('http://www.pep-up.nl/font/DIGITALDREAM-webfont.woff') format('woff'), url('http://www.pep-up.nl/font/DIGITALDREAM-webfont.ttf') format('truetype'), url('http://www.pep-up.nl/font/DIGITALDREAM-webfont.svg#webfontHRGKS7uh') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {height:100%; margin:0;padding:0; font-family:TitilliumText, Arial, Verdana; overflow-x:hidden; overflow:hidden; background-color:#bcc5c1; background-image:url(../img/site_bg.png); background-repeat:no-repeat; background-position:top center; background-attachment:fixed;}
#container {width:960px; margin:0 auto;}
#wrapper {float:left; width:960px; height:100%; position:absolute; overflow:hidden;}
#mask {width:960px; height:500%;}
.item {width:960px; height:20%; float:left; font-size:36px; background-color:#bcc5c1; background-image:url(../img/bg.png); background-repeat:repeat-y;} 
.content {float:left; width:720px; height:580px; left:200px; position:relative; overflow:hidden;}
.content a:link {color:#b03434; text-decoration:none;}
.content a:visited {color:#b03434; text-decoration:none;}
.content a:active {color:#b03434; text-decoration:none;}
.content a:hover {color:#282828; text-decoration:underline;}

a:link {color:#282828; text-decoration:none;}
a:visited {color:#282828; text-decoration:none;}
a:active {color:#282828; text-decoration:none;}
a:hover {color:#282828; text-decoration:underline;}

/* LEFT PANEL */
#navigation {float:left; width:162px; top:20px; left:19px; position:relative; font-size:12px; text-transform:uppercase;}
#navigation a:link {color:#fff; text-decoration:none;}
#navigation a:visited {color:#fff; text-decoration:none;}
#navigation a:active {color:#fff; text-decoration:none;}
#navigation a:hover {color:#fff; text-decoration:none;}
#logo {float:left; width:161px; height:159px; font-size:24px; margin:79px 0 0 0;}
#bediening {float:left;	width:162px; margin:0 0 0 0;}
.panel {float:left; display:block; height:36px; width:162px; line-height:36px; vertical-align:middle; text-align:left; margin:10px 0 0 0;}
a.panel {width:162px; height:36px; display:block; text-decoration:none; background-image:url(../img/panel_rollover.png); outline:none;}
a.panel:hover {background-position: 162px 0;}
.panel span {float:left; width:152px; padding: 0 0 0 10px;}
span.panel_nr {float:right; height:36px; width:34px; line-height:36px; text-align:center; color:#282828;}
.selected {text-decoration:underline; display:block; width:162px; height:36px; background-image:url(../img/panel_rollover.png); outline:none; background-position:324px 0;}
.selected span.panel_nr {color:#d1f33a;}
.panel_contact {float:left; display:block; height:36px; width:162px; line-height:36px; vertical-align:middle; text-align:left; margin:10px 0 0 0;}
a.panel_contact {width:162px; height:36px; display:block; text-decoration:none; background-image:url(../img/panel_rollover_contact.png); outline:none;}
a.panel_contact:hover {background-position: 162px 0;}
.panel_contact span {float:left; width:152px; padding: 0 0 0 10px;}

/* TOP PANEL */
#panel_top {float:left; width:428px; height:51px; background-image:url(../img/panel_top.png); margin:21px 0 0 107px;}
#panel_top_l {float:left; width:343px; height:51px;}
#panel_top_r {float:left; width:85px; height:51px;}
#panel_top_r span {float:left; display:block; width:20px; height:20px; margin:15px 0 0 4px;}
#panel_top_l p {font-family:DigitalDream, TitilliumText, Arial, Verdana; float:left; width:290px; height:20px; margin:16px 0 0 23px; line-height:20px; color:#d1f33a; font-weight:bold; padding:0 10px 0 10px; text-transform:uppercase; font-size:14px;}
#panel_top_l p span {float:right; width:24px; height:20px; text-transform:uppercase; font-size:14px; text-align:right;}

/* VAST */
.content_kelder {background-image:url(../img/kamer_-1.jpg);}
.content_beganegrond {background-image:url(../img/kamer_bg.jpg);}
.content_beganegrond_NIEUW {background-image:url(../img/kamer_bg_NIEUW.jpg);}
.content_eersteverdieping {background-image:url(../img/kamer1.jpg);}
.content_tweedeverdieping {background-image:url(../img/kamer2.jpg);}
.content_zolder {background-image:url(../img/kamer3.jpg);}
iframe {float:left; width:292px; height:223px; overflow:hidden;}

.content_links {float:left; width:300px; height:500px; margin:0 0 0 40px;}
.content_links ul {float:left; font-size:11px; line-height:20px; width:300px; text-align:justify; font-family:Helvetica, Arial, Verdana; height:100px; list-style-type:none; margin:6px 0 0 -20px;}
.content_links ul li {background-image:url(../img/bullet_home.png); background-repeat:no-repeat; padding:0 0 0 30px; font-weight:bold; font-style:italic;}
.content_links iframe {margin:116px 0 0 3px;}
.content_links object {float:left; margin:120px 0 0 42px;}
.content_links h1 {float:left; width:300px; font-size:24px; line-height:30px; overflow:hidden; margin:100px 0 0 0;}
.content_links p {float:left; font-size:12px; line-height:18px; width:300px; text-align:left; font-family:Helvetica, Arial, Verdana;}
.content_rechts {float:left; width:300px; height:580px; margin:0 0 0 40px;}
.content_rechts h1 {float:left; width:300px; font-size:24px; line-height:30px; overflow:hidden; margin:100px 0 0 0;}
.content_rechts p {float:left; font-size:12px; line-height:18px; width:300px; text-align:left; font-family:Helvetica, Arial, Verdana;}
.content_breed {float:left; width:329px; height:580px;}
#slider {float:left; width:329px; height:275px; margin:2px 0 0 0;}
#slider h1 {float:left; width:329px; height:26px; margin:14px 0 0 0; line-height:26px; vertical-align:middle; font-size:12px; text-align:center; color:#fff; background-color:#282828;}
#slider iframe {width:292px; height:223px; margin:8px 0 0 19px;}
.kelder_knop {float:left; display:block;}
a.kelder_knop {text-decoration:none; background-image:url(../img/kelder_knop.png); cursor:pointer; outline:none; margin:101px 0 0 25px; height:78px; width:250px;}
a.kelder_knop:hover {background-position:-250px 0;}
.intro {float:left; display:block;}
a.intro {text-decoration:none; background-image:url(../img/youtube_main.jpg); cursor:pointer; outline:none; margin:31px 0 0 33px; height:172px; width:234px;}
a.intro:hover {background-position:-234px 0;}

/* VARIABEL */
.content_kelder .content_breed {margin:100px 0 0 197px;}
.content_beganegrond .content_rechts h1 {margin:110px 0 0 10px;}
.content_beganegrond .content_rechts p {margin:10px 0 0 10px;}
.content_tweedeverdieping .content_rechts h1 {width:264px; margin:132px 0 0 30px; font-size:16px;}
.content_tweedeverdieping .content_rechts p {width:264px; margin:0 0 0 30px;}
.content_tweedeverdieping .content_rechts ul {float:left; font-size:12px; line-height:18px; width:264px; text-align:justify; font-family:Helvetica, Arial, Verdana;}
.content_zolder .content_rechts h1 {width:264px; margin:132px 0 0 30px; font-size:16px;}
.content_zolder .content_rechts p {width:264px; margin:0 0 0 30px;}
.content_zolder .content_rechts ul {float:left; font-size:12px; line-height:18px; width:264px; text-align:justify; font-family:Helvetica, Arial, Verdana; height:100px;}

.paneel_l {float:left; background-color:#bcc5c1; width:200px; height:1440px; background-repeat:repeat-y; background-image:url(../img/site_left.png); position:relative;}
.paneel_r {float:left; background-color:#bcc5c1; width:40px; height:1440px; background-image:url(../img/site_right.png); position:relative; top:-80px;}
#top {float:left; background-color:#bcc5c1; width:720px; position:relative; background-image:url(../img/site_top.jpg); font-size:10px; height:80px;}
#bottom {float:left; background-color:#bcc5c1; top:500px; width:720px; position:relative; background-image:url(../img/site_bottom.png); font-size:10px; height:800px;}
#footer_info {float:left; width:720px; height:20px; color:#717f81; margin:20px 0 0 0;}
#footer_info p {line-height:20px; text-align:center; font-size:10px; font-family:Arial, Verdana;}
#footer_info a:link {color:#717f81; text-decoration:none;}
#footer_info a:visited {color:#717f81; text-decoration:none;}
#footer_info a:active {color:#717f81; text-decoration:none;}
#footer_info a:hover {color:#717f81; text-decoration:underline;}

/* OVERLAYS */
.overlay {float:left; width:600px; min-height:360px; background-color:#fff;}
.overlay h1 {padding:7px 10px 5px 10px; font-size:16px; text-align:justify; width:280px; display:block; background-color:#282828; color:#fff; height:16px; line-height:16px; vertical-align:center;}
.overlay p {padding:10px; font-size:12px; text-align:left; font-family:Helvetica, Arial, Verdana; line-height:18px;}
.overlay img {margin:10px; vertical-align:bottom;}
.overlay_links {float:left; width:300px;}
.overlay_rechts {float:left; width:300px;}
.overlay_xl {float:left; width:400px; min-height:40px; background-color:#fff;}
.overlay_xl h1 {padding:7px 10px 5px 10px; font-size:16px; text-align:justify; width:380px; display:block; background-color:#282828; color:#fff; height:16px; line-height:16px; vertical-align:center;}
.overlay_xl p {padding:10px; font-size:12px; text-align:left; font-family:Helvetica, Arial, Verdana; line-height:18px;}

/* FORMULIEREN */
#formulier {float:left; width:280px; padding:0 10px 10px 10px; font-family:Helvetica, Arial, Verdana;}
.inputveld {float:left; width:278px; height:24px; overflow:hidden; margin:8px 0 0 0; border:1px solid #282828;}
.inputarea {float:left; width:278px; height:204px; overflow:hidden; margin:8px 0 0 0; border:1px solid #282828;}
.formtekst {font-size:12px; color:#3b3b3b; margin-top:4px;}
.formtekst_rood {float:left; font-size:12px; color:#ff0000; font-style:italic; margin:13px 0px 0px 0px; padding:0 10px 0 10px;}
.formtekst_zwart {float:left; font-size:12px; color:#282828; font-style:italic; margin:13px 0px 0px 0px; padding:0 10px 0 10px;}
.formveld {background-color:#fff; width:274px; font-size:12px; border:none; color:#aaa; font-style:italic; padding:5px 2px 0 2px; font-family:Helvetica, Arial, Verdana;}
.form_veld_active {background-color:#fff; width:274px; font-size:12px; border:none; color:#282828; padding:5px 2px 0 2px; font-family:Helvetica, Arial, Verdana;}
.formtekstarea {background-color:#ffffff; width:274px; height:300px; font-size:12px; border:none; line-height:18px; color:#282828; font-family:Helvetica, Arial, Verdana; padding:0 2px 0 2px;}
.formtekstarea_inactive {background-color:#ffffff; width:274px; height:300px; font-size:12px; border:none; margin:4px 0 0 0; line-height:18px; color:#aaa; font-style:italic; font-family:Helvetica, Arial, Verdana; padding:0 2px 0 2px;}
#formbutton {float:left; font-size:12px; width:280px; height:24px; color:#fff; cursor:pointer; margin-top:8px; text-align:center; background-color:#282828; border:none; line-height:24px; vertical-align:middle;}

/* FOTOALBUM */
.fotolink {float:left; display:block; height:54px; width:280px; margin:0 0 0 20px; overflow:hidden;}
.fotoreportage {float:left; display:block; height:54px; width:280px;}
/*
	jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider
	Copyright (c) 2009 Niall Doherty
	This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/

/* Most common stuff you'll need to change */
.coda-slider-wrapper { padding: 0 }
.coda-slider { /* background: #fff; */ }
/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
.coda-slider-no-js .coda-slider { height: 275px; overflow: auto !important; padding-right: 20px }
/* Change the width of the entire slider (without dynamic arrows) */
.coda-slider, .coda-slider .panel { width: 329px; }
/* Change margin and width of the slider (with dynamic arrows) */
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 329px; height:275px; }
.coda-slider-wrapper.arrows .coda-slider { margin: 0 }
/* Arrow styling */
.coda-nav-left a { width: 100px; height:70px; position:absolute; z-index:20; margin:35px 0 0 -130px;}
.coda-nav-right a { width: 100px; height:70px; position:absolute; z-index:20; margin:35px 0 0 25px;}
/* Tab nav */
.coda-nav ul li a.current { overflow:hidden; background-image: url(../images/bol_act.png); background-repeat: none; }
/* Panel padding */
.coda-slider .panel-wrapper {  }
/* Preloader */
.coda-slider p.loading { padding: 20px; text-align: center }
/* Miscellaneous */
.coda-slider-wrapper { clear: both; overflow:hidden; }
.coda-slider { float: left; overflow: hidden; position: relative }
.coda-slider .panel { display: block; float: left }
.coda-slider .panel-container { position: relative }


/*filter:alpha(opacity=50); -moz-opacity:0.50; -khtml-opacity: 0.50; opacity: 0.50; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)"; */