﻿
a, a span, h1, h2, .search h2, .body h3 {
    color: #00585b;
}

.scorebar { padding:0; }
.scorebar .green { background:#5ea045; }
.scorebar .orange { background:#ec9601; }
.scorebar .red { background:#d90606; }

.cijfer {
    color: #00585b;
}

body{
    background:#fff;
}
#vanlanschot{
    width:961px;
}
.header{
    height:73px;
}
#content_container {
    padding: 10px 0 10px;
}
#vanlanschotContent {
/*border-left:1px solid #CDCDCD;
border-right:1px solid #CDCDCD;*/
overflow:hidden;
padding:0 10px;
width:941px;
}
#columns{
    border-top:0;
}
.breadcrumbsBox{
    border:0;
    /*background:red;*/
    padding-top:0;
    padding-bottom:0;
    margin:4px 0;
}
    .breadcrumbsBox .underline {
        text-decoration: none;
        color: #00585b;
    }
.breadcrumbsBox .underline:hover{
    text-decoration:underline;
}
.whitebox{
    border:0;
}
.breadcrumbsBox ~ .whitebox{
    margin-top:0;
}
h1 {
    color: #00585b;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 45px;
    line-height: 50px;
    border-bottom: 1px dotted #666;
    font-weight: normal;
    padding-bottom: 2px;
    margin-bottom: 10px;
    display: block;
    /*text-indent:15px;*/
}
h2{
    color: #333;
    display: block;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 26px;
    font-style: italic;
    font-weight: normal;
    padding-bottom: 3px;
    border-bottom:1px dotted #666;
    margin-bottom:10px;
}

.floatLeft h1,
.floatLeft h2{
    display: block;
    width: 911px;
    /*margin-left: -15px;
    padding-left: 15px;*/
    text-indent:0;
}
.breadcrumbsBox ~ .whitebox > .floatLeft h1,
.breadcrumbsBox ~ .whitebox > div:first-child .floatLeft h1{
    margin-top:-15px;
}

.detailboxBlock.floatLeft h1,
.detailboxBlock.floatLeft h2{
    margin:0;
    padding:0;
    width:100%;
}
.detailboxBlock.floatLeft h2,
.detailboxBar h2 {
    font-size: 20px;
    font-style: italic;
    line-height: normal;
    margin-bottom: 10px;
}

.detailboxBlockCijfer.floatLeft h1,
.detailboxBlockCijfer.floatLeft h2{
    margin:0;
    padding:0;
    width:100%;
}
.detailboxBlockCijfer.floatLeft h2,
.detailboxBar h2 {
    font-size: 20px;
    font-style: italic;
    line-height: normal;
    margin-bottom: 10px;
}

/* Reset some inline styling */
.whitebox > div:first-child{
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
}
.whitebox > .floatLeft h1 + span[id]{
    display:block;
    margin-bottom:15px;
}

span.dottedLine {
    color: #00585b;
    border: 0;
    font-weight: normal;
}
span.dottedLine:hover{
    text-decoration:underline;
}
span.dottedLine + img{
    margin-left:2px;
}

.arrowLink,
.arrowLinks a,
#cboxLoadedContent div.data a,
.arrowBack {
    background: url("/App_Themes/VanLanschot/images/arrow.gif") no-repeat 0 6px;
    padding-left: 12px;
    color: #00585b;
}

.arrowBack{
    background-image: url("/App_Themes/VanLanschot/images/arrow-back.gif");
}    

.line {
    background:none;
    border:0;
}

img[id$="contentMain_imgLogo"] {
    position: absolute;
    right: 75px;
    top: 100px;
}

.detailboxBlock{
    margin:0 0 30px;
    padding:0;
}

.detailboxBlockCijfer{
    margin:0 0 30px;
    padding:0;
}

.detailboxBlock.sameSize{ width:445px;  }
.detailboxBlock.sameSize + .sameSize{ float:right; }

.productLine { padding:0; }
.productSpecs .title, .productSpecs .data{
    margin-bottom:9px;
}
.detailboxBar .productSpecs{
    margin-top:12px;
}

.detailboxBar {
    margin:0 0 30px;
    padding:0;
}

.cijfer{
    font-weight:normal;
}

/* FORM 
================================================== */

input[type="text"],
input[type="select"] { 
    border: 0px solid #999;
    background: #FFF;
}
input:hover,
input:focus {
    background: #F0F0F0;
}

.button,
input[type="submit"] {
    color: #fff;
    display: block;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12px;
    line-height: normal;
    height: auto !important;
    width: auto !important;
    cursor: pointer;
    padding: 7px 5px 6px 4px;
    margin: 0 0 3px;
    text-align: center;
    border: 1px solid #00585b;
    background: #00585b; /* Old browsers */
    /*background: -moz-linear-gradient(top, #7da84f 50%, #669933 53%);*/ /* FF3.6+ */
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #7da84f), color-stop(53%, #669933));*/ /* Chrome,Safari4+ */
    /*background: -webkit-linear-gradient(top, #7da84f 50%, #669933 53%);*/ /* Chrome10+,Safari5.1+ */
    /*background: -o-linear-gradient(top, #7da84f 50%, #669933 53%);*/ /* Opera 11.10+ */
    /*background: -ms-linear-gradient(top, #7da84f 50%, #669933 53%);*/ /* IE10+ */
    /*background: linear-gradient(top, #7da84f 50%, #669933 53%);*/ /* W3C */
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.6);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.6);
}

.button:hover, 
input[type="submit"]:hover{
	text-decoration: none;
	background: #00585b; /* Old browsers */
	/*background: -moz-linear-gradient(top, #669933 50%, #7da84f 53%);*/ /* FF3.6+ */
	/*background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #669933), color-stop(53%, #7da84f));*/ /* Chrome,Safari4+ */
	/*background: -webkit-linear-gradient(top, #669933 50%, #7da84f 53%);*/ /* Chrome10+,Safari5.1+ */
	/*background: -o-linear-gradient(top, #669933 50%, #7da84f 53%);*/ /* Opera 11.10+ */
	/*background: -ms-linear-gradient(top, #669933 50%, #7da84f 53%);*/ /* IE10+ */
	/*background: linear-gradient(top, #669933 50%, #7da84f 53%);*/ /* W3C */ /*color: #fff;*/
}

.button.button-detail:before{
    content: "Toon details"; 
    color:#fff;
}

.button img{
    display:none;
}


/*
Styling for all (javascript) replacement elements of the image buttons     
*/

.vergelijkButton {
    display:none;
}
.vergelijkButton.button {
    display:inline-block;
    margin:-2px 0 0 30px;
    width:auto !important;

}

/*
Style overruling of other button types
*/
.regel_detailbutton a{
    margin-top:11px;
    display:block;
}


/* ZOEKRESULTAAT PAGINA 
================================================== */

.goeddoelRegels{
    border:0;
}
.goeddoelHeader{
    margin-top:25px;
    margin-bottom: 5px;
}
.vergelijkLineCorner {
    border-left: 1px dotted #666;
    border-top: 1px dotted #666;
    height:68px;
}
.vergelijkLine{
    border-left: 1px dotted #666;
}

.goeddoelRegel:last-child .vergelijkLine{
    height:40px;
}
.goeddoelRegel{
    height: 71px;
    border-color:#DCE0DC;
}

.goeddoelRegel:last-child{
    border-bottom:1px solid #DCE0DC; 
}

.goeddoelRegel .border {
    border-right:0;
}
.goeddoelRegel .cell {
    height: 55px;
    border-top:0;
    border-bottom:0;
}
.goeddoelRegel .regel_logo{
    background:#fff;
    padding-top:0;
    padding-bottom:0;
    height:71px;
}
.goeddoelRegel .regel_logo .naam{
    display:table;
    height:71px;
}
.goeddoelRegel .regel_logo .logo{
    display: table-cell;
    vertical-align: middle;
    margin:0;
}
.regel_logo .checkbox input[type="checkbox"] {
    left: -1px;
    top: 29px;
}
.regel_detailbutton{
    width:105px;
    text-align:center;
}
.regel_opinie{
    width:69px;
}

.goeddoelRegel .regel_score {
    background-color: #DFECDA;
}
.scorebarRapport{
    padding-top: 1px;
}
.goeddoelRegels .cell.regel_doelgroep { padding-top:26px; }
.goeddoelRegels .cell.regel_score     { padding-top:17px; }
.goeddoelRegels .cell.regel_opinie    { padding-top:27px; }

.goeddoelRegels .cell.regel_opinie .dottedLine {
    font-weight:bold;
    color:#000;
}

.goeddoelRegels .dottedLine + .arrowLink{
    margin-top:1px;
}

.pager{
    margin-top:16px;
}
    .pager .pagerActive,
    .pager .pagerInActive {
        background: none;
        border: 1px solid #00585b;
        border-radius: 11px;
        width: 20px;
        height: 20px;
        padding: 0;
        line-height: 20px;
        font-size: 12px;
        margin: 0 3px 0 2px;
        color: #00585b;
    }
.pager .pagerActive {
    font-weight:bold;    
}
.pager .pagerActive:hover,
.pager .pagerActive{
    border: 1px solid #474747;
    color:#474747;
}
    .pager .pagerInActive:hover {
        background: #00585b;
        color: #fff;
    }
    .pager .pagerVolgende,
    .pager .pagerVorige {
        background: url("/App_Themes/VanLanschot/images/arrow.gif") no-repeat right 6px;
        padding: 0 7px 0 0;
        color: #00585b;
        display: inline-block;
    }
.pager .pagerVolgende:hover,
.pager .pagerVorige:hover{
    text-decoration:underline;
}

    .pager .pagerVorige {
        background: url("/App_Themes/VanLanschot/images/arrow-back.gif") no-repeat left 6px;
        padding: 0 0 0 7px;
        color: #00585b;
        display: inline-block;
    }

/* FILTERCONTROL 
================================================== */
.grayBar{
    display:none;
}

#vanlanschot.has-filter{
    padding-right:242px;
}
#vanlanschot.has-filter.is-closed{
    padding-right:20px;
}

.filterControl.is-column.is-closed{
    height:350px;
}
.filterControl.is-column.is-closed{
    width:4px;
    border-radius:3px;
}
.filterControl.is-column.is-closed ul{
    display:none;
}
.filterControl.is-column{
    position:absolute;
    display:block;
    width:220px;
    top:83px;
    left:20px;
    background: #474747;
    border:dotted 1px #fff;
    border-radius:6px;
    padding:1px 0 10px;
}
.filterControl + #content_container{
    padding-left:242px;
}
.filterControl.is-closed + #content_container {
    padding-left:20px;
}

.filterControl.is-column ul{
    list-style-type:none;
}
.filterControl.is-column ul,
.filterControl.is-column li{
    padding:0;
    margin:0;
}

.filterControl.is-column li .label{
    display:block;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    color:#fff;
    margin-left:10px;
    width:210px;
    padding: 1px 0 0px;
}

.filterControl.is-column ul li.is-first .label{
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 20px;
    line-height: 24px;
    color: #9C0;
    padding: 4px 0;
    border-bottom:dotted 1px #fff;
}

.filterControl.is-column .field{
    display:block;
    padding: 2px 10px 4px 10px;
}

.filterControl.is-column .triggers .field{
    padding-bottom:0px;
}

.filterControl.is-column .triggers .field{
    padding-top:6px;
    padding-bottom:6px;
}

.filterControl input,
.filterControl select {
    width: 100% !important;    
}
.filterControl select{
    background:#DFECDA;
}

.filterControl select.is-active{
    background:#5EA045;
    color:#fff;
}

.filter-toggle{
    display:block;
    background:#474747;
    position: absolute;
    top: 50%;
    height: 35px;
    width: 20px;
    margin: -17px 0 0 -21px;
    border-radius:6px 0 0 6px;
}
.filter-toggle:hover{   
    background:#693;
}

.filter-toggle span{
	width: 0; 
	height: 0; 
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 7px solid #fff;
    display:block;
    margin:12px auto 0 8px;
}

.is-closed .filter-toggle{
    margin-left:-20px;
}
.is-closed .filter-toggle span{
	border-right: 7px solid #fff;
    border-left:0;
    margin-left:7px;
}


/* COLORBOX 
================================================== */
#cboxOverlay{
    opacity:0.7 !important;
}

#cboxWrapper #cboxClose{
    top:12px;
    right:16px;
}

#cboxWrapper #cboxTopLeft,
#cboxWrapper #cboxTopCenter,
#cboxWrapper #cboxTopRight,

#cboxWrapper #cboxMiddleLeft,
#cboxWrapper #cboxMiddleRight,

#cboxWrapper #cboxBottomLeft,
#cboxWrapper #cboxBottomCenter,
#cboxWrapper #cboxBottomRight{
    background: url(none);
}

#cboxWrapper #cboxLoadedContent{
    margin-bottom:0;
    /*padding:0 20px;*/
    overflow: hidden !important;
}

#cboxWrapper #cboxContent{
    padding:20px;
    border:1px solid #B5B6BA;
    -webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.15);
    -moz-box-shadow:    0px 0px 9px 0px rgba(0, 0, 0, 0.15);
    box-shadow:         0px 0px 9px 0px rgba(0, 0, 0, 0.15);
}

#cboxWrapper h1 {
    font-size: 34px;
    line-height: 44px;
}

#cboxWrapper i{
    margin: 0 0 10px 0;
    line-height: 1.4em;
    display:block;
}

#cboxWrapper .rapport{
    width:100%;
}
#cboxWrapper .rapport td{
    padding-top:10px;
    padding-bottom:12px;
    vertical-align:top;
}

/* 
9-19-2014
Problem : Colorbox gets a fixed height and overflow is set to hidden, in some cases not all content will be displayed because of this.
Solution : set the colobox heights to auto and where necessary overflow to visible.
*/
#colorbox{ overflow: visible; }
#cboxWrapper{ overflow: visible; height:auto !important; }
#cboxContent{ height:auto !important; }
#cboxLoadedContent { height: auto !important; }


/* VERGELIJK 
================================================== */

.goeddoelVergelijkHeader{
    border-right:1px solid #fff;
}
.goeddoelVergelijk{
    margin:0;
    border:0;
    border-right:1px solid #fff;
}

.goeddoelVergelijk > .cellSmall:first-child,
.goeddoelVergelijkHeader > .cellSmall:first-child {
    background:transparent;
    position:absolute;
} 
.goeddoelVergelijk > .cellSmall:first-child input{
    padding: 2px 7px 2px 6px;
    display: inline-block;
}
.goeddoelVergelijk > .cellSmall:first-child + .cellBig{
    height:86px;
    background:#fff;
    display: table-cell;
    vertical-align: middle;
    border-bottom:1px dotted #666;
}
.goeddoelVergelijkHeader > .cellSmall:first-child + .cellBig{
    height:86px;
    display: table-cell;
    vertical-align: middle;
}
.goeddoelVergelijk > .cellSmall:first-child + .cellBig + .cellBig{
    font-weight:bold;
}

.goeddoelVergelijk .cellHuge,
.goeddoelVergelijkHeader .cellHuge{
    height:110px;
}

    .goeddoelVergelijk a {
        color: #00585b;
    }


/* DETAIL  
================================================== */

/* Hack to remove unnecessary breaks */
.whitebox > a ~ .floatRight > br + br
{
    display:none;
}
.beoordeling{
    border-top:1px dotted #666;
}
h1 + .productSpecs .details .productLine span,
h1 + .productSpecs .details .productLine div{
    overflow:hidden;
    display:block;
    line-height:28px;
    margin:0;
    height:auto;
}
h1 + .productSpecs .details .productLine{
    padding-top: 4px;
}
h1 + .productSpecs .details .productLine span{
    margin-right:10px;
    color:#000;
}

.beoordeling > .cijfer + .floatLeft{
    display:block;
    width:100%;
    margin-top:5px;
}
.beoordeling > .cijfer + .floatLeft i{
    padding-bottom:5px;
    display:inline-block;
    color:#B2B2B2;
}

/* Sumo Select */
.SumoSelect > .CaptionCont { border: 1px solid #A4A4A4; background-color: #DFECDA !important;}
.SumoSelect.open > .optWrapper {width: auto; min-width: 200px; background-color: #DFECDA;}
.SumoSelect .select-all {
    background-color: #00585b !important;
}
.SumoSelect>.CaptionCont>span.placeholder { color: #000000 !important;}