File: D:/HostingSpaces/SBogers10/bvi.komma-mediadesign.nl/wwwroot/css-js/screen.css
@charset "utf-8";
/* CSS Document */
* {
outline:0;
}
body, html, h1, h2, h3, h4, p, ul, ol, li, img{
margin:0;
padding:0;
border:0;
}
body{
font-family: 'Crimson Text', serif;
font-size:12px;
color:#363731;
background-color:#f2f2f2;
}
::selection {
background: #fff; /* Safari */
}
::-moz-selection {
background: #fff; /* Firefox */
}
li{
vertical-align: text-top;
}
.clear_left{
clear:left;
}
.clear_both{
clear:both;
}
.right{
float:right;
}
.left{
float:left;
}
.paddingNul{
padding-bottom:0;
}
strong{
font-weight:700;
}
.disableSelection{
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
.error{
color:red;
}
.headers{
width:395px;
float:left;
padding-top:4px;
}
h1, h2.alsH1{
font-size:40px;
line-height:45px;
font-weight:700;
float:left;
text-decoration:underline;
width:395px;
color:#3379C4;
padding-bottom:0;
font-style:normal;
}
h1.maps{
font-size:22px;
width:110px;
}
h2, span.alsH2{
font-size:40px;
line-height:45px;
font-weight:600;
float:left;
width:395px;
color:#3379C4;
padding-bottom:40px;
font-style:italic;
}
h3{
font-size:17px;
font-weight:600;
line-height:18px;
padding-bottom:18px;
color:#3379C4;
float:left;
}
.headerClearer{
width:100%;
clear:both;
float:left;
margin-bottom:30px;
}
a{
color:#3379C4;
}
a:hover{
color:#C7282D;
}
p{
font-size:16px;
line-height:22px;
padding-bottom:22px;
color:#5B5B5B;
padding-left:40px;
width:355px;
float:left;
}
p.paddingRight{
padding-right:20px;
}
p.maps{
width:110px;
padding-bottom:0;
padding-left:0;
}
#mainframe{
position:relative;
width:820px;
margin:0 auto;
}
#header{
width:800px;
border-left:10px solid #fff;
border-bottom:10px solid #fff;
border-right:10px solid #fff;
float:left;
position:relative;
height:390px;
background-color:#e5e5e5;
}
#header .arrowRight{
position:absolute;
left:790px;
bottom:13px;
width:74px;
cursor:pointer;
}
#header .arrowRight .left{
width:10px;
height:94px;
background:url(/img/bvi_sprite.png) no-repeat -105px -66px;
float:left;
}
#header .arrowRight .right{
width:33px;
height:70px;
background:url(/img/bvi_sprite.png) no-repeat right -291px;
float:left;
margin-top:13px;
}
#header .arrowRight:hover .left{
background:url(/img/bvi_sprite.png) no-repeat -76px -66px;
}
#header .arrowRight:hover .right{
background:url(/img/bvi_sprite.png) no-repeat right -220px;
}
#header .arrowLeft, #header .mapsIcon{
position:absolute;
right:790px;
bottom:13px;
width:74px;
cursor:pointer;
}
#header .arrowLeft .left{
width:33px;
height:70px;
background:url(/img/bvi_sprite.png) no-repeat left -291px;
float:right;
margin-top:13px;
}
#header .mapsIcon .left{
width:33px;
height:70px;
background:url(/img/bvi_sprite.png) no-repeat left -483px;
float:right;
margin-top:13px;
}
#header .arrowLeft .right, #header .mapsIcon .right{
width:10px;
height:94px;
background:url(/img/bvi_sprite.png) no-repeat -118px -66px;
float:right;
}
#header .arrowLeft:hover .left{
background:url(/img/bvi_sprite.png) no-repeat left -220px;
}
#header .mapsIcon:hover .left{
background:url(/img/bvi_sprite.png) no-repeat left -554px;
}
#header .arrowLeft:hover .right, #header .mapsIcon:hover .right{
background:url(/img/bvi_sprite.png) no-repeat -91px -66px;
}
#galleryMenu{
width:100%;
float:left;
height:10px;
margin-top:20px;
}
#galleryMenu ul{
margin: 0 auto;
position: relative;
}
#galleryMenu ul.drieFotos{
width:48px;
}
#galleryMenu li{
display:block;
width:12px;
height:10px;
margin-right:6px;
list-style:none;
background:url(/img/bvi_sprite.png) no-repeat -186px -19px;
cursor:pointer;
float:left;
}
#galleryMenu li.last{
margin-right:0;
}
#galleryMenu li.active, #galleryMenu li:hover{
background:url(/img/bvi_sprite.png) no-repeat -186px -3px;;
}
#content{
float:left;
margin-top:80px;
margin-bottom:85px;
width:820px;
}
#hoofdmenu{
float:left;
margin-top:51px;
position:relative;
z-index:1;
}
#footermenu{
float:left;
margin-top:4px;
position:relative;
z-index:1;
width:820px;
}
#hoofdmenu li, #footermenu li{
float:left;
display:block;
list-style:none;
margin-right:20px;
padding-bottom:7px;
position:relative;
cursor:pointer;
}
#footermenu li.last{
margin-right:0;
}
#footermenu li.right{
float:right;
}
#hoofdmenu li a, #footermenu li a{
color:#3379C4;
font-family: 'Open Sans', sans-serif;
font-weight:700;
text-decoration:none;
text-transform:uppercase;
font-size:11px;
}
#hoofdmenu li .activeLine, #footermenu li .activeLine{ display:none; }
#hoofdmenu li.active .activeLine {
display:block;
width:100%;
height:2px;
background-color:#C7282D;
position:absolute;
left:0;
bottom:-2px;
}
#hoofdmenu li.active .activeLine .arrow {
position:absolute;
display:block;
width:7px;
height:5px;
background:url(/img/bvi_sprite.png) no-repeat -144px -66px;
left:50%;
margin-left:-3px;
margin-top:2px;
}
#footermenu li.active .activeLine {
display:block;
width:100%;
height:2px;
background-color:#C7282D;
position:absolute;
left:0;
top:-8px;
}
#footermenu li.active .activeLine .arrow {
position:absolute;
display:block;
width:7px;
height:5px;
background:url(/img/bvi_sprite.png) no-repeat -156px -66px;
left:50%;
margin-left:-3px;
margin-top:-5px;
}
#hoofdmenu li.active a, #hoofdmenu li:hover a, #footermenu li.active a, #footermenu li:hover a{
color:#C7282D;
}
#logo{
float:right;
width:128px;
height:57px;
background:url(/img/bvi_sprite.png) no-repeat;
margin-top:10px;
}
.lineFull{
width:100%;
float:left;
height:4px;
background:url(/img/bvi_sprite.png) repeat-x 0 -476px;
}
.lineFullGrey{
width:100%;
float:left;
height:4px;
background:url(/img/bvi_sprite.png) repeat-x 0 -469px;
}
#footer .lijnEen{
margin-top:60px;
margin-bottom:30px;
}
#footer .lijnTwee{
margin-top:30px;
margin-bottom:200px;
}
#footer{
float:left;
}
#footerContent{
float:left;
width:820px;
}
#footerContent p{
line-height:20px;
color:#777777;
text-transform:uppercase;
font-family: 'Open Sans', Arial, sans-serif;
font-weight:700;
padding-bottom:0;
padding-left:0;
font-size:11px;
float:none;
width:auto;
}
#footerContent p a{
text-decoration:none;
color:#777777;
}
#footerContent p a.komma{
color:#C1C1C1;
display:block;
}
#footerContent p a.komma:hover{
color:#3379C4;
text-decoration:none;
}
#footerContent p a:hover{
color:#C7282D;
}
#footerContent .right{
text-align:right;
width:235px;
}
#footerContent .logoIcon{
background:url(/img/bvi_sprite.png) no-repeat -145px 0;
width:33px;
height:59px;
float:right;
margin-left:15px;
}
.referentieLijst{
}
.referentieLijst li{
float:left;
width:820px;
list-style:none;
margin-bottom:30px;
position:relative;
cursor:pointer;
}
.referentieLijst .label{
position:absolute;
right:390px;
top:53px;
width:74px;
cursor:pointer;
}
.referentieLijst .label .left{
width:33px;
height:70px;
background:url(/img/bvi_sprite.png) no-repeat left -78px;
float:right;
margin-top:13px;
}
.referentieLijst .label .right{
width:10px;
height:94px;
background:url(/img/bvi_sprite.png) no-repeat -118px -66px;
float:right;
}
.referentieLijst li:hover .label .left{
background:url(/img/bvi_sprite.png) no-repeat left -149px;
}
.referentieLijst li:hover .label .right{
background:url(/img/bvi_sprite.png) no-repeat -91px -66px;
}
.referentieLijst li .image{
width:400px;
height:200px;
background-color:#e3e3e3;
float:left;
position:relative;
}
.referentieLijst li .overlayRO{
width:17px;
height:17px;
position:absolute;
right:0;
bottom:0;
background:url(/img/bvi_sprite.png) no-repeat -182px -40px;
}
.tekstContent{
float:left;
margin-left:30px;
width:380px;
margin-top:20px;
}
.tekstContent ul{
margin-left:30px;
}
.tekstContent li{
float:left;
width:350px;
list-style:none;
margin-bottom:0;
}
.tekstContent li span{
float:left;
width:130px;
font-size:14px;
color:#3379C4;
line-height:22px;
}
.tekstContent li p{
float:right;
width:215px;
font-size:14px;
padding:0;
line-height:22px;
}
.referentieLijst .button{
margin-left:430px;
margin-top:46px;
}
.button{
float:left;
cursor:pointer;
}
.button .text{
float:left;
text-decoration:none;
color:#fff;
text-transform:uppercase;
font-size:10px;
font-family: 'Open Sans', sans-serif;
font-weight:700;
padding-top:5px;
line-height:30px;
padding-bottom:5px;
padding-left:16px;
padding-right:11px;
background:url(/img/bvi_sprite.png) no-repeat 0 -377px;
}
.button .arrow{
float:left;
height:40px;
width:29px;
background:url(/img/bvi_sprite.png) no-repeat -76px -234px;
}
.button:hover .text{
background-position:0 -419px;
}
.button:hover .arrow{
background-position:-76px -185px;
}
.button .arrowTop{
float:left;
height:40px;
width:29px;
background:url(/img/bvi_sprite.png) no-repeat -76px -319px;
}
.button:hover .arrowTop{
background-position:-76px -276px;
}
#citaat{
float:left;
width:355px;
margin-left:40px;
text-align:center;
position:relative;
cursor:pointer;
}
#citaat a{
font-size:28px;
line-height:32px;
font-weight:600;
font-style:italic;
color:#3379C4;
padding-top:12px;
padding-bottom:11px;
float:left;
width:355px;
text-decoration:none;
}
#citaat a strong{
font-weight:700;
}
#citaat .lijn{
float:left;
width:80px;
line-height:1px;
height:1px;
background-color:#3379C4;
margin-left:137px;
}
#citaat:hover a{
color:#C7282D;
}
#citaat:hover .lijn{
background-color:#C7282D;
}
.subcontentLeft{
float:left;
width:395px;
}
.subcontentRight{
float:right;
width:395px;
}
.subcontentLeft h3, .subcontentRight h3{
padding-bottom:8px;
}
.subcontentLeft p, .subcontentRight p{
font-size:14px;
}
p.gegevens{
color:#3379C4;
}
.sitemapLijst{
float:left;
width:200px;
}
.sitemapLijst li{
list-style:none;
float:left;
margin-bottom:22px;
width:200px;
}
.sitemapLijst li span{
display:block;
width:10px;
height:17px;
float:left;
}
.sitemapLijst li a{
float:left;
font-size:17px;
font-weight:700;
line-height:18px;
text-decoration:none;
}
.sitemapLijst li:hover a{
color:#C7282D;
}
.sitemapLijst li:hover span{
background:url(/img/bvi_sprite.png) no-repeat -167px -62px;
}
#photoGallery{
float: left;
height: 100%;
overflow: hidden;
position: relative;
width: 100%;
}
#photoGallery ul{
height: 100%;
left: 0;
position: absolute;
top: 0;
}
#photoGallery li{
float: left;
list-style: none outside none;
position: relative;
}
#markerContent{
width:100px;
}
#googlemaps .gmnoprint{
display:none !important;
}
/*
ColorBox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; width:600px;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
/*
User Style:
Change the following styles to modify the appearance of ColorBox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#333;}
#colorbox{}
#cboxTopLeft{width:25px; height:25px; background:url(/img/images/border1.png) no-repeat 0 0;}
#cboxTopCenter{height:25px; background:url(/img/images/border1.png) repeat-x 0 -50px;}
#cboxTopRight{width:25px; height:25px; background:url(/img/images/border1.png) no-repeat -25px 0;}
#cboxBottomLeft{width:25px; height:25px; background:url(/img/images/border1.png) no-repeat 0 -25px;}
#cboxBottomCenter{height:25px; background:url(/img/images/border1.png) repeat-x 0 -75px;}
#cboxBottomRight{width:25px; height:25px; background:url(/img/images/border1.png) no-repeat -25px -25px;}
#cboxMiddleLeft{width:25px; background:url(/img/images/border2.png) repeat-y 0 0;}
#cboxMiddleRight{width:25px; background:url(/img/images/border2.png) repeat-y -25px 0;}
#cboxContent{background:#fff; overflow:hidden; width:500px;}
.cboxIframe{background:#fff; width:500px;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{margin-bottom:20px; width:500px;}
#cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
#cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;}
#cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
#cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;}
#cboxNext{position:absolute; bottom:0px; left:63px; color:#444;}
#cboxLoadingOverlay{background:#fff url(../img/images/loading.gif) no-repeat 5px 5px;}
#cboxClose{position:absolute; bottom:0; right:0; display:block; color:#444;}
/*
The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
when an alpha filter (opacity change) is set on the element or ancestor element. This style is not applied to or needed in IE9.
See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
/*
The following provides PNG transparency support for IE6
Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(/img/images/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(/img/images/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(/img/images/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(/img/images/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(/img/images/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(/img/images/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(/img/images/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(/img/images/ie6/borderMiddleRight.png);}
.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
_behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}