.filtersection {
    display: none;
    margin-top: 15px;
    padding: 10px;
    background: #444;
    border-radius: 7px;
}
.filters {
    cursor: pointer;
    padding-right: 10px;
}
.filters .fa {
    font-size: 26px;
    padding: 5px;
    border: 3px solid #fff;
    border-radius: 5px;
	/* background: #4d8547; */
}
.filterblock {
    position: relative;
    margin-top: 10px;
    background: #333;
    border-radius: 7px;
    padding: 10px;
	overflow: hidden;
}

.filtertitle {
    position: relative;
    font-size: 24px;
    padding: 2px 4px 8px 20px;
    font-weight: 500;
    background: #222;
    margin: -10px -10px 5px;
}

.filterchecks {
    box-sizing: border-box;
    /* padding: 15px 15px 15px 15px; */
    padding: 10px;
    position: relative;
    margin-top: 10px;
}


.tentoonstelling {
	padding: 10px;
	margin-bottom: 10px;
	background: #444;
}

h3{
	font-size: 20px;
}

.details {
	padding: 5px 20px 30px;
	background: #333;
}

.details a {
	text-decoration: none;
}
.details h2 {
    border-bottom: 1px solid #aaa;
    margin-top: 30px;
    padding: 6px 6px 6px 0;
    font-weight: 500;
    color: #eee;
    font-size: 23px;
    background: none;
    /* text-align: center; */
    /* font-style: italic; */
}

.regel.wide {
    background: #444;
    margin: 15px 0px;
    padding: 10px 0;
}
.details-title {
	text-transform: none;	
	font-weight: 400;
	font-style: italic;
	color: #ddd;
}
.details-title.wide {
	/* font-size: 24px; */
	font-style: italic;
	font-weight: 400;
}
.details-value {
	font-weight: 400;
}
.details-value.wide {
	font-weight: 400;
}

.row.regel.user {
    background: #a83636;
    margin: 0px;
}


/* complete block with title and selectors */

.txtzoek {
    text-align: left;
    width: 100%;
    margin: 10px 0px;
    background: #ededed;
    border-radius: 6px;
    margin-bottom: -40px;
    margin-top: 40px;
}

.txtzoek form,
.txtzoek input {
    margin: 0px;
    padding: 0px;
}

.txtzoek img {
    vertical-align: middle;
}

.txtzoek #search {
    font-size: 16px;
    font-weight: 500;
    border: 0px;
    background: transparent;
    width: 80%;
}

.txtzoek .zoeker {
    padding: 15px 12px;
    border: 0px;
    color: #fff;
    font-size: 16px;
    font-weight: 900;
    cursor: pointer;
}

.txtzoek #zoekknop {
    background-color: #a9a9a9;
    float: left;
    border-radius: 6px 0px 0px 6px;
    margin-right: 15px;
}

.item {
	display:none;
	background: #282828 !important;

}

span.thumbtext {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #333a;
    padding: 7px;
    font-size: 80%;
    width: 100%;
}


::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: rgba(0, 0, 0, 0.3);
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: rgba(0, 0, 0, 0.3);
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: rgba(0, 0, 0, 0.3);
}



/* title */


/* container for dropdown */

.filterselect {}


/* dropdown list */

.filterlist {}


/* checkbox container */


.name_muziekgenre .filterchecks {
    background: #ededed;
}


/* input field + value in span */

.filtercheckval {
    position: relative;
    /* width: 33.32%; */
    width: 20%;
    display: inline-block;
    padding-left: 30px;
    margin-bottom: 5px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-sizing: border-box;
}

@media only screen and (max-width:420px) {
.filtercheckval {
    position: relative;
    display: inline-block;
    padding-left: 30px;
    margin-bottom: 8px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-sizing: border-box;
}

}

.ltekst {
    width: 100px;
    float: left;
}


.grijsvlak {
    background: #ededed;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 40px 25px 10px 35px;
    position: relative;
    top: -30px;
}

@media screen and (max-width: 1200px) {
    .filtercheckval {
        width: 33.32%;
    }
}

@media screen and (max-width: 991px) {
    .filtercheckval {
        width: 33.32%;
    }
    .labelplaatje img {
        width: 50%;
        max-width: 418px;
        margin-left: 25px;
        position: relative;
        top: 15px;
        z-index: 10000;
    }
}

@media screen and (max-width: 1120px) {
    .filtercheckval {
        width: 50%;
    }
}

@media screen and (max-width: 768px) {
    .filtercheckval {
        width: 50%;
    }
    .filterblock {
        position: relative;
        width: 100%;
        margin-left: 0%;
        float: none;
        margin-bottom: 10px;
        border-radius: 6px;
    }
    .filterblock:first-of-type {
        margin-right: 0%;
        margin-left: 0% !important;
    }
    .labelplaatje img {
        width: 65%;
        max-width: 218px;
        margin-left: 25px;
        position: relative;
        top: 15px;
        z-index: 10000;
    }
}


/* input field */

.filtercheck {
    display: none;
    vertical-align: middle;
    cursor: pointer;
}


/* span for input value */

.filtervalue {
    position: relative;
    padding: 0 5px;
    display: inline-block;
    font-weight: normal;
    cursor: pointer;
    font-size:0.8em;
}

.filtervalue.checked {
    color: #c0392b;
}


/* button */

.filtersubmit {
    padding: 5px 15px;
    border: 1px solid #ccc;
    background: #ddd;
    border-radius: 3px;
    box-sizing: border-box;
}


/* complete block with title and selectors */

.filternothing {
    padding: 10px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}

.loader {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 9999;
}


/* Create custom checkboxes */

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    box-sizing: border-box;
    padding: 0px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #aaa;
    -webkit-transition: background-color 100ms linear;
    -ms-transition: background-color 100ms linear;
    transition: background-color 100ms linear;
}


/* On mouse-over, add a grey background color */

.filtercheckval:hover input ~ .checkmark {
    background-color: #ccc;
}


/* When the checkbox is checked, add a blue background */

.filtercheckval input:checked ~ .checkmark {
    background-color: #fff;
}


/* Create the checkmark/indicator (hidden when not checked) */

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}


/* Show the checkmark when checked */

.filtercheckval input:checked ~ .checkmark:after {
    display: block;
}


/* Style the checkmark/indicator */


/* 
.filtercheckval .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
 */

.filtercheckval .checkmark:after {
    top: 5px;
    left: 5px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    /* background: #df0275; */
    background: #900;
}

/*
  CSS definition for WebsiteBaker module: OneForAll
  Copyright (C) 2017, Christoph Marti

  This CSS file is free software. You can redistribute it and/or modify it 
  under the terms of the GNU General Public License - version 2 or later, 
  as published by the Free Software Foundation: http://www.gnu.org/licenses/gpl.html.

  This CSS file is distributed in the hope that it will be useful, 
  but WITHOUT ANY WARRANTY; without even the implied warranty of 
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
  GNU General Public License for more details.
*/


/* Frontend Stylesheet Module OneForAll */


/* ************************************ */


/*
NOTE:
Modify the HTML of the main page and the item page in the layout section of the OneForAll page settings.
Modify the CSS of the main page and the item page in this stylesheet.
*/


/* GENERAL */

div[id^="mod_schilderijen_wrapper_"] {}


/* Section specific wrapper(s) using the section id */


/* Replace 22 by the section id you like to address */

#mod_schilderijen_wrapper_22_f {}


/* OVERVIEW OR MAIN PAGE */

.mod_schilderijen_item_loop_f {}

.mod_schilderijen_group_wrapper_f {}

.mod_schilderijen_main_thumb_f {
    border: none;
}

.thumbs {
    margin: 20px 20px 0 0;
}

.mod_schilderijen_main_img_f {
    border: none;
    width:100%; height:auto;
}

.mod_schilderijen_main_title_f {
    font-weight: normal;
    width: 100%;
    padding: 0px;
    /* background: #eee; */
    margin-bottom: 0px;
}

.mod_schilderijen_none_found_f {
    margin-top: 100px;
    font-weight: bold;
}

.mod_schilderijen_pagination_f {}


/* DETAIL OR ITEM PAGE */

.mod_schilderijen_item_f {}

.mod_schilderijen_item_thumb_f {
    border: none;
    width: 23.5%;
    height: auto;
/*     float: left; */
    margin-right: 0.5%;
    margin-bottom: 3px; 
    overflow: hidden;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 0.3s ease;
    overflow:hidden;
}

 

.mod_schilderijen_item_thumb_f:hover
{
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    overflow:hidden;
}


.mod_schilderijen_item_img_f {
    border: none;
}

.mod_schilderijen_item_caption_f {}

.mod_schilderijen_item_title_f {}

.mod_schilderijen_prev_next_links_f {}

.mod_schilderijen_no_item_found_f {
    color: red;
}


/* PLACEHOLDERS */

.mod_schilderijen_field_label_f {}

.mod_schilderijen_field_content_f {}

.mod_schilderijen_text_f {}

.mod_schilderijen_textarea_f {}

.mod_schilderijen_wysiwyg_f {}

.mod_schilderijen_wb_link_f {}

.mod_schilderijen_url_f {}

.mod_schilderijen_email_f {}

.mod_schilderijen_media_f {}

.mod_schilderijen_datepicker_f {}

.mod_schilderijen_datepicker_start_end_f {}

.mod_schilderijen_datetimepicker_f {}

.mod_schilderijen_datetimepicker_start_end_f {}

.mod_schilderijen_droplet_f {}

.mod_schilderijen_select_f {}

.mod_schilderijen_group_f {}

.googlemap {
    width: 25%;
    float: right;
    margin-left: 15px;
}

.opsomming {
    background-color: #ededed;
    border-radius: 5px;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.opsommingdatum {
    color: #e6007e;
    font-size: 1.8em;
    line-height: 1.0em;
    text-transform: uppercase;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.detaildatum {
    color: #e6007e;
    font-size: 2.4em;
    line-height: 1.0em;
    text-transform: uppercase;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.detailnaamzaal {
    color: #000000;
    font-size: 2.4em;
    line-height: 1.0em;
    text-transform: uppercase;
    font-weight: 700;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.opsommingplaats {
    color: #ffffff;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
  }

.extraline {
    font-size: 0.8em;
    font-weight: 700;
    color: #e6007e;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.extraline2 {
    font-size: 0.8em;
    font-weight: 700;
    color: White;
    padding:0px 6px;
    border-radius: 7px;
    background-color: #e6007e;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.afgelast {
    font-size: 0.8em;
    font-weight: 700;
    color: #e1007a;
    padding:0px 6px;
    border-radius: 7px;
    background-color: Yellow;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.redactieblok {
    border:1px solid #e1007a; 
    box-sizing: border-box;
    width:50%;
    margin-top:30px;
    padding:10px;
    color:#e1007a;
}
.extraline3 {
    font-size: 1em;
    font-weight: 600;
    color: #e1007a;
    box-sizing: border-box;
    -webkit-transition: all .1s ease-out;
    -moz-transition: all .1s ease-out;
    -o-transition: all .1s ease-out;
    transition: all .1s ease-out;
}
.extraline3:hover {
    color: #90004d;
    -webkit-transition: all .1s ease-out;
    -moz-transition: all .1s ease-out;
    -o-transition: all .1s ease-out;
    transition: all .1s ease-out;
}

.aanvangoverzicht {
    font-size: 0.8em;
    font-weight: 500;
    color: #333333;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.aanvangoverzicht:hover {
    font-size: 0.8em;
    font-weight: 500;
    color: #cdcdcd;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.opsomming:hover {
    background-color: #e6007e;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out; 
}

.opsomming:hover .extraline
{
    color: Yellow;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.opsomming:hover .extraline2
{
    color: #e6007e;
    border-radius: 7px;
    padding:0px 6px;
    background-color: White;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.opsomming:hover .aanvangoverzicht
{
    color: #cdcdcd;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.opsomming:hover .opsommingdatum,
.opsomming:hover .opsommingplaats
{
    color: #ffffff;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}


/* LIGHTBOX2 (compressed) */

#lightboxOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: black;
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=85);
    opacity: 0.85;
    display: none;
}

#lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
    font-weight: normal;
}

#lightbox img {
    width: auto;
    height: auto;
}

#lightbox a img {
    border: none;
}

.lb-outerContainer {
    position: relative;
    background-color: white;
    *zoom: 1;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}

.lb-outerContainer:after {
    content: "";
    display: table;
    clear: both;
}

.lb-container {
    padding: 10px;
}

.lb-loader {
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
}

.lb-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
}

.lb-container > .nav {
    left: 0;
}

.lb-nav a {
    outline: none;
}

.lb-prev,
.lb-next {
    width: 49%;
    height: 100%;
    background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
    /* Trick IE into showing hover */
    display: block;
}

.lb-prev {
    left: 0;
    float: left;
}

.lb-next {
    right: 0;
    float: right;
}

.lb-prev:hover {
    background: url(js/lightbox2/images/prev.png) left 48% no-repeat;
}

.lb-next:hover {
    background: url(js/lightbox2/images/next.png) right 48% no-repeat;
}

.lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    *zoom: 1;
    width: 100%;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -ms-border-bottom-left-radius: 4px;
    -o-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -ms-border-bottom-right-radius: 4px;
    -o-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
    content: "";
    display: table;
    clear: both;
}

.lb-data {
    padding: 0 10px;
    color: #bbbbbb;
}

.lb-data .lb-details {
    width: 85%;
    float: left;
    text-align: left;
    line-height: 1.1em;
}

.lb-data .lb-caption {
    font-size: 13px;
    font-weight: bold;
    line-height: 1em;
}

.lb-data .lb-number {
    display: block;
    clear: left;
    padding-bottom: 1em;
    font-size: 11px;
}

.lb-data .lb-close {
    width: 35px;
    float: right;
    padding-bottom: 0.7em;
    outline: none;
}

.lb-data .lb-close:hover {
    cursor: pointer;
}
