/* Stylesheet */

/* Font Banner */

@font-face {
    font-family: 'ZagBoldRegular';
    src: url('/files/fonts/zag_bold-webfont.eot');
    src: url('/files/fonts/zag_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/files/fonts/zag_bold-webfont.woff') format('woff'),
         url('/files/fonts/zag_bold-webfont.ttf') format('truetype'),
         url('/files/fonts/zag_bold-webfont.svg#ZagBoldRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ZagRegular';
    src: url('/files/fonts/zag_regular-webfont.eot');
    src: url('/files/fonts/zag_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/files/fonts/zag_regular-webfont.woff') format('woff'),
         url('/files/fonts/zag_regular-webfont.ttf') format('truetype'),
         url('/files/fonts/zag_regular-webfont.svg#ZagRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* Globals */
html {overflow: -moz-scrollbars-vertical;}
body { font-family:arial; font-size:12px;margin:0; padding:0; background:#d8d8d8; color:#4b4b4b;}
form {display:inline;}
img {border:0; display:block;}
td {vertical-align:top;}
a {text-decoration:none; outline:0;}
p {line-height:18px; margin: 0 0 15px 0;}
p a, li a {color:#4b6c0d; text-decoration:underline;}
p a:hover, li a:hover {color:#000;}
ul, ol {margin:10px 0; padding:0 0 0 15px; list-style-position:outside;}
ul li, ol li { line-height:18px; }
ul br { clear:both; }


/* 'buttons' */
a span.button1 { display:inline-block; padding:4px 11px; text-decoration:none; color:#fff; font-weight:bold; font-size:15px; background-color:#d54c33; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; background-image:-webkit-gradient(linear, 0% 20%, 0% 100%, from(#e26b55), to(#b9422c)); background-image:-moz-linear-gradient(0% 95% 90deg, #b9422c, #e26b55); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#e26b55, endColorstr=#b9422c); box-shadow:0 0 6px #fff; -moz-box-shadow:0 0 6px #fff; -webkit-box-shadow:1px 1px 6px #fff; }
a:hover span.button1 { color:white; color:#ddd; box-shadow:0 0 6px #555; -webkit-box-shadow:0 0 6px #555; -moz-box-shadow:0 0 6px #555; }


/* Divs */
.p0-klanten #wrapper {background-color: #d6d6d6;}
#wrapper { border:solid 1px #c2c2c2; border-width:0 1px; width:1152px; margin:0 auto; background-color:#e4e4e4; }
#header { height:316px; background:transparent url(/images/layout/header_standaard.jpg) no-repeat center center; }
#header div.padder { height:316px; margin-left:106px; position:relative; }
#header h3{ position:absolute; bottom:0; left:100px; width:235px; height:70px; background:url(/images/layout/logo.png) no-repeat; text-indent:-9999px; }
#menu { position:absolute; height:37px; bottom:6px; left:360px; }
#menu ul { height:33px; list-style:none; margin:0; padding:0; }
#menu ul li { position:relative; float:left; padding:0 2px 0 0; }
/*#menu ul > li { position:absolute; left:auto; bottom:0; }*/
#menu ul li a { padding-bottom:8px; display:block; text-decoration:none; font-size:12px; text-transform:uppercase; color:#000; font-weight:bold; }
#menu ul li a span { cursor:pointer; }
#menu ul li a span.out { display:block; height:21px; padding:5px 9px 0; background-color:rgba(255, 255, 255, 0.4); /**/border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px;/**/ }
#menu ul li.active a { background:transparent url(/images/layout/menu_bottom.png) no-repeat center bottom; }
#menu ul li.active a span.out, #menu ul li a:hover span.out, #menu ul li:hover a span.out { background-color:#000; color:#fff; }
#menu ul li a:hover span, #menu li ul a:hover { color:#ddd; }

#menu li ul { height:auto; margin-bottom:-5px; padding:4px 0 1px; border-radius:7px 7px 0 0; display:none; /**position:absolute; bottom:29px;/**/ }
#menu li:hover ul { display:block; background-color:#000; }
#menu li ul li { background-color:#000; float:none; padding:0; margin:0; display:block; height:18px; }
#menu li ul li a { background-color:transparent; display:block; *display:inline; _display:inline; color:#fff; padding:0 8px; border-radius:0; height:auto; }
#menu li ul li a span { position:relative; top:-2px; }

.p0-klanten .content {padding: 0; 	}
.p0-klanten .content .inner2 {padding-top: 36px;}
.content { width:940px; margin:0 auto; text-align:left; padding:36px 0 40px; position:relative; }
.content h2 {margin:0 0 15px 0;}
.content p, .content .inner2 { margin-left:108px; margin-right:88px; }
.content .inner2 p ,.content .inner2 h2, .content .inner2 ul, .content #image p { margin-left:0; margin-right:0; }
#main .inner h2 { margin-top: -28px; }
.content p img[border] { border:solid 8px #bbb; }
#content {position:relative;}
#ctstart { float:left; position:relative; top:-36px; }

#main {background:url('/images/layout/bg_content.png'); height:273px;}
#main .corners {background:url('/images/layout/content_left.png') no-repeat;}
#main .corners .right {background:url('/images/layout/content_right.png') top right no-repeat; height:297px;}
#main .inner {width:940px; margin:0 auto; text-align:left; position:relative;}
#main .inner p , #main .inner h2, #main .inner ul, .content ul {margin-right:300px; margin-left:108px;}
#main .inner { padding-top:105px; }
#main .inner h2 { }

#waarom { background:url('/images/layout/waarom.png') no-repeat scroll -4px 27px transparent; }
body#klanten #waarom, body.p0-klanten #waarom { background:none; }
#referenties #waarom {background:url('/images/layout/gallery.png') no-repeat scroll 50px 67px transparent}
body#contact #waarom { background-image:none; }
body.p0-feest #waarom, body.p0-uitnodiging #waarom { background-image:url(/images/layout/wolkje.png); }
#punten { list-style:none; width:819px; margin:0; padding:0; }
#punten li {float:left; width:273px;}
#punten li p {margin:0 62px 15px 0;}
.wanneer {clear:both; margin: 0 0 0 108px;}
.wanneer a {font-size:14px; font-weight:bold; text-decoration:underline; color:#d54c33;}

div.bar { height:93px; }
div.active-bar { border-top:1px solid #000; }
div.bar h1, div.bar h2, div.bar h3 { margin:0; padding:0; }
div.bar a { background-color:#000; font-size:54px; display:block; height:93px; text-transform:uppercase; }
div.bar a span.padder { display:block; padding:17px 0 0 212px; color:#fff; }
#bar-1 a, #bar-1 a span, #bar-13 a, #bar-13 a span { background-color:#93c13d; color:#ffffff; }
#bar-2 a, #bar-2 a span, #bar-8 a, #bar-8 a span { background-color:#36a13e; color:#ffffff; }
#bar-3 a, #bar-3 a span, #bar-9 a, #bar-9 a span { background-color:#7e174b; color:#ffffff; }
#bar-4 a, #bar-4 a span, #bar-10 a, #bar-10 a span { background-color:#fa4bea; color:#ffffff; }
#bar-5 a, #bar-5 a span, #bar-11 a, #bar-11 a span { background-color:#d94d34; color:#ffffff; }
#bar-6 a, #bar-6 a span, #bar-12 a, #bar-12 a span { background-color:#2da3c4; color:#ffffff; }
#bar-7 a, #bar-7 a span, #bar-7 a, #bar-7 a span { background-color:#edef22; color:#ffffff; }
.clear { clear:both; }

#geeltje {position:absolute; left:640px; top:-21px; width:243px; height:213px; background:url('/images/layout/geeltje.png') no-repeat; }
#gevonden-worden {position:absolute; left:20px; top:-21px; width:483px; height:101px; background:url('/images/layout/gevonden-worden.png') no-repeat; }
body.p0-feest #gevonden-worden, body.p0-uitnodiging #gevonden-worden { background-image:url(/images/layout/party.png); left:-30px; top:15px; }

.gallery #description {float:left; width:320px; min-height:230px; height:auto !important; height:230px; margin-bottom: 50px;}
.gallery #description.loading {background:url('/images/layout/ajax-loader.gif') right 40px no-repeat;}
.gallery #image {float:right; width:468px; }
.gallery #image img {border:10px solid #cecece; width: 365px; height: 240px;}
.thumbs {clear:both; position:relative;/* margin:30px 44px 0 32px;*/  left: -106px; padding: 40px 0; padding-left: 130px; width: 1022px; background-color: #dfdfdf;}
.thumbs a.next, .thumbs a.previous { top:100px; display:block; text-indent:-9999px; position:absolute; }
.thumbs a.next {right:106px; width:50px; height:37px; background:url('/images/layout/arrow_right.png') no-repeat; }
.thumbs a.previous {left:132px; width:49px; height:40px; background:url('/images/layout/arrow_left.png') no-repeat; }
.thumbsgallery { margin:0 60px; width:750px; }
.thumbsgallery ul { margin:0; padding:0; height:140px; list-style:none; }
.thumbsgallery li { float:left; height:140px; padding:10px 0; width:225px; margin-bottom:15px; margin-right: 20px; margin-left: 20px; }
.thumbsgallery li a {  }
.thumbsgallery li img { border:3px solid #cecece; display:block; margin:0 auto; width: 210px; height: 140px;  }
.thumbsgallery li.active img { box-shadow:0 0 15px #999; -webkit-box-shadow:0 0 15px #888; -moz-box-shadow:0 0 15px #888; -o-box-shadow:0 0 15px #888; }
.thumbsgallery li.active img, .thumbsgallery li a:hover img { border-color:#888; }

/* Content */
h1, h2, h3 { margin:0; }

#whiteout {
  position: absolute;
  top: 506px;
  left: 242px;
  width: 246px;
  height: 40px;
  background-color: white;
  z-index: 9999999;
}


.klantquote h2 { width: 335px; font-size: 16px; color: #404040; line-height: 20px; font-weight: normal; font-style: italic; margin: 0; padding: 0;}
.klantquote {font-size: 12px; width: 335px; color: #404040; line-height: 20px; font-weight: bold; font-style: normal; background: url(/images/layout/klantquote.png) top left no-repeat; padding-left: 45px;
}

#badge {
  position: absolute; right: 20px; top: 20px;
}

/* Banner top */

#bannertop .content {
  padding: 10px 0 0 212px;
}

#bannertop .content a {
  color: #ffffff;
  text-decoration: none;
  font-size: 40px;
  font-family: 'ZagBoldRegular';
}

#bannertop {
  background: url('/images/layout/bannerbackground.png') no-repeat;
  height: 70px;
  position: fixed;
  z-index: 99;
}

#bannertop .content span {
  font-size: 30px;
}