@charset "UTF-8";

/* Alles */
* { margin:0; padding:0; }

html { background:url(../images/bg.jpg) no-repeat; }
body { font:12px Verdana, Arial; color:#000; }

h1 { font-size:17px; color:#bb2225; margin:0 0 10px 0;}
h4 { font-size:13px; color:#333; margin:0 0 10px 0;}

a { text-decoration:none; color:#bb2225; display:inline;}

img { border:0; }
p { margin:5px 0; }

span.error { float:none; clear:both; width:auto; color:red; }

/* Wrapper */
div.wrapper { position:relative; overflow:auto; width: 1004px; height: auto; margin:10px auto; z-index:1;}

/* Header */
div.header { position: relative; float:left; width:100%; height:174px; background:url(../images/head_shade.png) no-repeat; z-index:2;}
div.header img { margin:10px 0 0 10px; }
div.header ul { position:relative; float:left; width:auto; list-style:none; margin:0; padding:0; width:164px;}
div.header ul li { position:relative; float:left; display:inline; }

/* Omloop van het menu - schaduw */
div.menu_c { position:relative; float:left; width:100%; height:40px; background:url(../images/verl_shade.png) repeat-y; z-index:500;}

/* Menu */
div.hmenu { position:relative; width:984px; height:40px; margin:0 auto; background:url(../images/menu_verloop.png) repeat-x; z-index:1000;}
div.hmenu li.search { padding:5px 0 0 0; }
div.hmenu form#searchform { margin:2px 0 0 0; }
div.hmenu form#searchform span { color:#fff; font-weight:bold; }
div.hmenu form#searchform input[type=text] { border:1px solid #000;  }

/* Navigatie */
div.nav {position:relative; float:left; width:550px; height:32px; z-index:410; z-index:5;}
div.nav a, a:link, a:visited { display:inline; padding:0; margin:0; background:none; color:#bb2225;}

div.nav-proj {position:relative; float:left; left:330px; width:550px; height:32px; z-index:5;}
div.nav-proj a {display:inline; padding:0; margin:0; background:none; color:#bb2225;}

/* Content - omloop van inhoud pagina's */
div.content { position:relative; float:left; width:100%; min-height:300px; background:url(../images/verl_shade.png) repeat-y; z-index:6;}

/* Banners */
div.banners { position:relative; float:left; width:330px; height:330px; margin:-10px 10px 10px 20px; z-index:10; background:url(../UserFiles/Banners/basisbanner.jpg) no-repeat; }

/* Text */
div.text {position:relative; float:left; width:620px; margin:15px 0;}
div.text a, a:link, a:visited { float:none; display:inline; padding:0; margin:0; color:#bb2225; }
div.text ul { list-style:none; }

div.text fieldset { border:0; width:60%; float:left; border:1px solid #bb2225; padding:10px; margin:0 auto;}
div.text legend { padding:10px; font-size:16px; color:#bb2225; }
div.text fieldset label { float:left; width:100%; margin:4px; }
div.text fieldset span { float:left; width:40%; }
div.text fieldset textarea { width:90%; height:100px; }

div.text ul { list-style-position:inside; list-style-image:url("../images/bullet.png"); list-style-type:square; }
div.text ul li { float:none; margin:0 0 0 5px; }

div.text div.link a.title { display:block; float:left; clear:both; padding:5px 0; }
div.text div.link a.title:hover { text-decoration:underline; color:#000; }
div.text div.link div.small { float:right; font-size:11px; }

/* Projecten */
.projects {position:relative; float:left; margin:0 20px 30px 20px; width:950px;}
.projects h3 {margin:0 0 20px 0; text-align:center;}
.projects .project {width:100%;}
.projects .project ul {list-style:none;}
.projects .project ul li {border-bottom:1px solid #ccc;}
.projects .project ul li a {display:block; padding:3px;}
.projects .project ul li a:hover {color:#333;}
.projects .project .newproj {position:relative; float:left; width:48%; margin:2px;}
.projects .project .oldproj {position:relative; float:left; width:48%; margin:2px;}

.projects div.proj {width:45%; float:left}
.projects .jcarousel-skin-pika .jcarousel-container-horizontal {padding: 10px 30px;}
.projects .jcarousel-skin-pika .jcarousel-container-vertical {width: 90px; height: 245px; padding: 40px 20px;}
.projects .jcarousel-skin-pika .jcarousel-clip-horizontal {height: 90px; width: 460px;}
.projects .jcarousel-skin-pika .jcarousel-clip-vertical {width:  75px; height: 245px;}
.projects .jcarousel-skin-pika .jcarousel-item-horizontal {margin-right: 10px;}
.projects .jcarousel-skin-pika .jcarousel-item-vertical {margin-bottom: 10px;}
.projects .jcarousel-skin-pika .jcarousel-item-placeholder {background: #fff; color: #000;}

.projects ul.proj {position:relative; width:330px; float:left; min-height:200px; margin:0 0 0 20px;}
.projects ul.proj li {margin:5px 0 10px 0}
.projects ul.proj li a {margin:0; padding:0}
.projects ul.proj p {margin:10px 0; line-height:1.4em;}

.projects .pikachoose {position:relative; width:520px; float:right;}
.projects .pika-wrap {width:520px; margin: 0 auto;}
.projects .pika-image {position: relative; height: auto; width: 500px; background: #fafafa; border: 1px solid #e5e5e5; padding: 10px;}
/*position image holders */
.projects .pika-image .animation, .pika-image .main-image {position:absolute; top: 10px; left: 10px;}
.projects .pika-image .animation {display: none;z-index:2;}
.projects .pika-image img {border:0;}
.projects .pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
.projects .pika-imgnav a.previous {background: url(../images/prev.png) no-repeat left 50%; height: 340px; width: 50px; top: 10px; left: 10px;cursor:pointer;}
.projects .pika-imgnav a.next {background: url(../images/next.png) no-repeat right 50%; height: 340px; width: 50px; top: 10px; right: 10px;cursor:pointer;}
.projects .pika-imgnav a.play {background: url(../images/play.png) no-repeat 50% 50%; height: 100px; width: 40px;top:0;left:50%;display: none;cursor:pointer;}
.projects .pika-imgnav a.pause {background: url(../images/pause.png) no-repeat 50% 50%; height: 100px; width: 40px;top:0;left:50%;display:none;cursor:pointer;}
.projects .pika-textnav {overflow: hidden; margin: 10px 0 0 0;}
.projects .pika-textnav a {font-size: 12px; text-decoration: none; font-family:  helvetica, arial, sans-serif; color: #333; padding: 4px;}
.projects .pika-textnav a:hover {background: #e5e5e5; color: #0065B2;}
.projects .pika-textnav a.previous {float: left; width: auto; display: block;}
.projects .pika-textnav a.next {float: right; width: auto; display: block;}
.projects .pika-thumbs {margin: 10px 0 0 0; padding: 0; overflow: hidden; }
.projects .pika-thumbs li {float: left; list-style-type: none; width: 74px; padding: 3px; margin: 0 2px; background: #fafafa; border: 1px solid #e5e5e5; cursor: pointer;}
.projects .pika-thumbs li:last {margin: 0;}
.projects .pika-thumbs li .clip {width: 74px; height: 74px; text-align: center; vertical-align: center; overflow: hidden;position:relative;}

.fotoalbum {position:relative; float:left; padding:2em; width:900px; margin:1em;}
.fotoalbum ul.album {list-style:none; width:100%;}
.fotoalbum ul.album li {display:inline; width:220px; height:180px; float:left;}
.fotoalbum ul.album li img {max-width:200px; max-height:200px; float:none; padding:3px; border:1px solid #ddd;}

div.profile { position:absolute; right:20px; width:100px; height:auto; border:1px solid #bb2225; padding:5px;}
div.profile a, a:link, a:visited { display:inline; color:#bb2225; padding:0 0 5px 0; margin:0; }

/* Footer */
div.footer { position:relative; float:left; width:100%; height:255px; background:url(../images/foot_shade.png) no-repeat; }
div.footer a.baderie { position:absolute; width:105px; height:30px; left:210px; top:170px; }
div.footer a.instal { position:absolute; width:105px; height:30px; left:380px; top:170px; }