.header.small .headerimg {height: 297px;}
.header.small .headerimg div {background: url(/img/smallhead.jpg) no-repeat center / cover; height: 100%; z-index: 2; position: relative;}

/*ACTIVITEIT INFO*/
.info {
    z-index: 5;
    padding: 0;
/*    margin-top: -25px; */
}
.info .half {
    padding: 150px 0;
    text-align: left;
    float: left;
    /*margin-bottom: 10px;*/
}
.info .half:nth-of-type(1) {background-color: #f0f0f0; -webkit-clip-path: polygon(0 0, 100% 0, 96% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0, 96% 100%, 0% 100%); width: 60%; position: relative;}
.info .half:nth-of-type(2) {
    background-color: #1894aa;
    margin-left: -5%;
    width: 45%;
/*    margin-top: 40px;  */
}
.info .half .linkbtn.fill {position: absolute; top: 0; margin-top: 0; right: 0; padding: 20px 50px;}
.eventinfo {padding: 0 20%;}
.eventinfo .fa-book {margin-right: 10px;}
.generalinfo {padding: 0 20%;}
.generalinfo .title {color: #FFF; text-align: center;}
.generalinfo table td {padding: 5px 0; color: #FFF;}
.generalinfo table td:nth-of-type(1) {padding-right: 30px;}

.reserve {padding: 250px 0; text-align: center; z-index:4;}
.background {position: absolute; top: -200px; right: 0; width: 329px; height: 1477px; background: url(/img/logobg.png) no-repeat right top / 329px 1477px; z-index: 1; opacity: 0.2;}
.reserve h1 {color: #626eab; text-transform: uppercase; font-weight: 700; font-size: 36px;}
.reserve .content {display: table; width: 100%; padding: 30px 0 0; padding-bottom: 0px; text-align: left;}
.reserve .content .left {width: 50%; display: table-cell; padding-right: 2%;}
.reserve .content .right {width: 50%; display: table-cell; padding-left: 2%;}
.reserve .content .right .placeholder {height: 50px; border:none;}
.reserve .content .form div {float: left;}
input, textarea {padding: 9px; font-size: 15px; width: 100%; border: #626eab 1px solid; margin-bottom: 20px; background-color: rgba(255, 255, 255, 0);}
input:hover, textarea:hover, input:focus, textarea:focus {background-color: #dee2f6;}
.reserve .content label {position: relative; float: left; width: 100%; display: block; margin: 6px 0 0;}
.reserve .content label span {display: inline-block;}
.reserve .content label span.wpcf7-form-control-wrap {display:block;}
.reserve .content label.radio {padding-left: 20px; cursor: pointer;}
.reserve .content label.radio .control {position: absolute; top: 8px; left: 0; height: 14px; width: 14px; background: #FFF center / 0px 0px; border-radius: 50%; border: #5d6db1 1px solid;}
.reserve .content label.radio input {position: absolute; z-index: -1; opacity: 0; width: auto; height: auto; margin: 0; top: 11px;}
input[type="checkbox"], input[type="radio"] {width: auto !important; height: auto !important; margin: 8px 14px 0 0; padding: 0 !important; vertical-align: top;}
.reserve .content label.radio .control::after {content: ""; position: absolute; top: 50%; left: 50%; margin: -4px 0 0 -4px; width: 8px; height: 8px; border-radius: 50%; transition: All 0.3s ease;}
.reserve .content label.radio:hover input ~ .control::after{background:#aab4df;}
.reserve .content label.radio input:checked:focus ~ .control::after,
.reserve .content label.radio input:checked ~ .control::after,
.reserve .content label.radio:hover input:checked ~ .control::after{background-color:#5d6db1;}
.reserve .content label.radio.checkbox .control {border-radius:4px;}
.reserve .content label.radio.checkbox .control::after {border-radius:2px;}
.reserve .content .right .number {border: none; line-height: 42px; margin-bottom: 20px; clear:both;float:left;}
.reserve .content .right .number input {width: 60px; border: #5d6db1 1px solid; float: none; margin: 0 10px;}
.reserve .linkbtn {background-color: #1894aa; font-size:18px; color: #FFF; border: none; padding: 8px 44px; margin-top: 50px;}

/*ABOUT*/
.newsimg {background: url(/img/news.jpg) no-repeat center / cover; height: 297px;}
.about h1 {margin-bottom: 10px;}
.about h2 {margin:50px 0 20px 0; font-family: 'Crimson Text', serif; font-weight: 400; color: #1894aa; font-size:32px; line-height:34px; letter-spacing: 1px; text-transform: inherit;}
.one_third, .two_third {position: relative; float: left;}
.about .image {width: 100%; height: 400px; background: url(/img/news.jpg) no-repeat center / cover; margin: 40px 0;}
.about .two_third {background-color: #FFF; width: 60%;}
.about .two_third p {margin: 0 0 20px 0;}
.about .two_third a {color: #5d6db1;}
.about .two_third table {margin-top: 40px; width: 100%;}
.about .two_third table caption {text-align: left; font-weight: 700; margin-bottom: 10px;}
.about .two_third table tr:nth-child(even){background-color: #f2f2f2;}
.about .two_third table tr:hover {background-color: #ddd;}
.about .two_third table tr td {padding: 10px;}
.about .one_third {width: 26%; margin-left: 4%; float: right;}
.about .one_third .title {margin: 0 10px 30px 10px; text-align: center;}
.about .side {float: left; width: 100%; margin-bottom: 50px; background: #f0f0f0; padding: 30px 0;}
.about .side strong {font-size: 20px;}
.about .side.news .text {text-align: left; padding: 0 20px; display: block; width: 100%;}
.about .side.news .text p {color: #000 !important;}
.about .side.news .text p:nth-of-type(1) {color: #5d6db1 !important;}
.about .side.news .img {height: 200px; position: relative;}
.about .side .linkbtn {margin-top: 20px;}
.about .side.agen .linkbtn.fill {text-align: center; margin: 30px auto 0; display: table;}
.about .agen .items {padding: 9px 40px;}
.about .agen .items p {margin: 0 0 0 40px;}

/*AGENDA*/
.specialevents .itemcont {width: 100%; margin-top: 60px;}
.specialevents .item {width: 45%; display: inline-block; overflow: hidden; transition:0.3s ease; margin-top: 40px;}
/*.specialevents .item:nth-of-type(2) {float: right;}*/
/*.specialevents .item:nth-child(even) { float: right; }*/
/*.specialevents .item:nth-child(1n+2) { margin-top: 40px; }*/


.specialevents .itemmcont .mix.hidden {display:none !important;}

.specialevents .item div {width: 50%; float: left; background-color: #f0f0f0;}
.specialevents .item .text {padding: 8%; top: 17px; position: relative; width: 52%; margin-left: -1%; color: #000;}
.specialevents .item .text i {font-size: 14px; line-height: 24px; margin-right: 5px;}
.specialevents .item .text p {font-size: 15px; margin: 0; line-height: 24px;}
.specialevents .item .text p:nth-of-type(1) {color: #1894aa; font-weight: 700; font-size: 16px; margin: 0 0 10px 0;}
.specialevents .item .image {-webkit-transform: skew(-3deg); -moz-transform: skew(-3deg);  -o-transform: skew(-3deg); transform: skew(-3deg);background:#5d6db1; overflow: hidden; position: relative; margin: 0 0 0 -11px; z-index: 2; height: 320px;}
.specialevents .item .image .date {-webkit-transform: skew(-3deg); -moz-transform: skew(3deg);  -o-transform: skew(3deg); transform: skew(3deg); position: relative; z-index: 3; margin-left: 5px;}
.specialevents .item .image div {position: absolute; top: -20px; right: -8px; bottom: 0px;  -webkit-transform: skew(3deg);-moz-transform: skew(3deg);-o-transform: skew(3deg);transform: skew(3deg); width: 100%; background: url(/img/uitgelicht2.jpg) no-repeat center / cover;  z-index:2;}
.specialevents .item:hover .image div {opacity: 0.8; transition:0.3s ease;}
.specialevents .item:nth-of-type(2) .image div {background: url(/img/uitgelicht3.jpg) no-repeat center / cover;}

.page.agenda {padding: 150px 0 200px 0; background-color: #f0f0f0; margin-bottom: -25px;}
.page.agenda .filters {margin-bottom: 40px;}
.page.agenda .filters .title {color: #5d6db1;}
.page.agenda .filters a {margin-right: 40px;}
.page.agenda .filters span {margin-right: 10px; line-height: 30px; font-size: 18px;}
.agenda .controls{margin-top:42px; float:left; width:100%; text-align:center; padding:20px 0; margin-bottom:30px; background:#9185be; border-radius:5px; position: relative;}
.agenda .controls h2{font-family:'Open Sans', sans-serif; font-weight:700; font-size:42px; line-height:50px; text-align:center; color: #FFF; margin: 0 !important;}
.agenda .controls .prev, .agenda .controls .next{display:inline-block; font-size:18px; line-height:18px; color:#FFF; text-transform:uppercase; cursor:pointer; transition:0.3s ease; position: absolute; -webkit-transform: translate(50%, -50%);
transform: translate(-50%, -50%); top: 50%;}
.agenda .controls .prev {left: 18px;}
.agenda .controls .next {right: 10px;}
.agenda .controls .next:last-child{text-align:right;}
.agenda .controls .prev:hover, .agenda .controls .next:hover{color:#000;}
.agenda .today{float:left; width:100%; font-size:16px; line-height:24px; font-weight: 700;}
.agenda .events{float:left; width:100%; margin-top:0px; padding-top:20px;}
.agenda .events a{display:block; padding-bottom:10px; margin-bottom:10px; line-height:20px; color: #000; font-weight: 300;}
.agenda .events a:last-child{border-bottom:0; padding-bottom:0; margin-bottom:0;}
.agenda .events a:hover{color:#5d6db1;}
.agenda .events span {margin: 4px 4px 4px 0; font-size: 16px;}
.calendar_container{float:left; width:100%; margin:0;}
.calendar_container .day{position:relative; float:left; width:13%; margin:0 1.5% 1.5% 0; padding-top:13%; background:#FFF; border-radius:5px; transition:0.3s ease; overflow:hidden; cursor:default;}
.calendar_container .day:hover {background-color: #9185be; }
.calendar_container .day:hover span {color: #fff;}
.calendar_container .day:nth-of-type(7n){margin-right:0;}
.calendar_container .day.inactive{opacity:0.3;}
.calendar_container .day.inactive:hover{background-color: inherit;}
.calendar_container .day.inactive:hover span {color: inherit;}
.calendar_container .day.active{background: #9185be; color: #fff !important;}
.calendar_container .day.exposities{background:#fbe6ed; cursor:pointer;}
.calendar_container .day.exposities span{color:#e55688;}
.calendar_container .day.exposities:hover, .calendar_container .day.exposities.active, .calendar_container .day.exposities.today{background:#e55688;}
.calendar_container .day.activiteiten{background:#eff7e3; cursor:pointer;}
.calendar_container .day.activiteiten span{color:#91c843;}
.calendar_container .day.activiteiten:hover, .calendar_container .day.activiteiten.active, .calendar_container .day.exposities.today{background:#91c843;}
.calendar_container .day.katwijk-en-plein-air{background:#e2f5fd; cursor:pointer;}
.calendar_container .day.katwijk-en-plein-air span{color:#3dbbf0;}
.calendar_container .day.katwijk-en-plein-air:hover, .calendar_container .day.katwijk-en-plein-air.active, .calendar_container .day.exposities.today{background:#3dbbf0;}
.calendar_container .day.exposities:hover span,
.calendar_container .day.exposities:hover .text,
.calendar_container .day.activiteiten:hover span,
.calendar_container .day.activiteiten:hover .text,
.calendar_container .day.katwijk-en-plein-air:hover span,
.calendar_container .day.katwijk-en-plein-air:hover .text,
.calendar_container .day.active span,
.calendar_container .day.active .text,
.calendar_container .day.today span,
.calendar_container .day.today .text{color:#fff;}
.calendar_container .day .circles{position:absolute; top:10px; left:10px;}
.calendar_container .day .circles div{display:inline-block; width:10px; height:5px; margin:0 2px 0 0; vertical-align:top;}
.calendar_container .day .circles i {font-size: 13px; margin-right: 8px;}
.calendar_container .day span{position:absolute; top:50%; left:50%; font-size:25px; line-height:25px; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); color: #000;}
.calendar_container .day small{position:absolute; top:10px; right:10px; font-size:13px; line-height:13px; color:#aaa; text-transform:uppercase;}
.calendar_container .day .text, .calendar_container .day .hover{position:absolute; bottom:0; left:0; width:100%; padding:10px; font-size:13px; line-height:13px; color:#aaa;  transition:0.3s ease;}
.calendar_container .day .text div:last-child{margin-right:6px;}

.purple {background-color: #5d6db1; color: #FFF;}
.footer.purple h5 {color: #FFF;}
.footer.purple .wrapper div:nth-of-type(1) a {background: url(/img/logowit.png) no-repeat center/ 407px 85px;}
.footer.purple .wrapper div i {color: #FFF;}
.footer.purple a, .bottom.purple a {color: #FFF !important;}

/*NEWS*/
.overview {text-align: center; background-color: #f0f0f0;}
.overview .newscont.page {padding: 40px 0 0 0; width: 45%; float: left; background-color: unset;}
.overview .newscont.page .item {width: 100%;}
.overview .newscont.page:nth-of-type(1) {margin-right: 10%;}
.overview .newscont.page .text p:nth-of-type(1) {color: #5d6db1 !important;}
.overview .newscont.page p {color: #000 !important; }
.overview .page:nth-of-type(2) .img {background: url(/img/nieuws1.jpg) no-repeat center / cover;}

.morenews .item {width: 50%; float: left; margin-bottom: 100px;}
.morenews .item .img {width: 40%; height: 200px; background: url(/img/nieuws1.jpg) no-repeat center / cover; float: left; position: relative;}
.morenews .item .text {float: left; width: 60%;}
.morenews .item .text p {font-size: 18px; color: #5d6db1; font-weight: 700; padding: 30px 20px; width: 70%;}

/*CONTACT*/
.contact {background-color: #f0f0f0; padding: 150px 0 0 0; z-index: 2;}
.contact h1 {margin-bottom: 0;}
.contact .contmap, .continfo, .continfo div {float: left; width: 50%; position: relative;}
.contact .location div {width: 50%; position: absolute;}
.contact .location {height: 400px !important; position: absolute; width: 100%;}
.contact .continfo {float: right; padding: 70px 0 70px 90px;}
.contact .continfo i {line-height: 30px; color: #000; font-size: 14px; margin-right: 12px;}
.contform {text-align: center;}
.contform .form{width: 500px; margin: auto;}
.contact .location #maps {float: left; width: 100%; height: 100%;}


/*CONTACT*/
.filter {background-color: #f0f0f0; padding: 40px 0 0 0; margin-bottom:20px; z-index: 2;}

/*retina*/
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi) {
.footer.purple .wrapper div:nth-of-type(1) a {background-image:url(/img/logowit@2x.png);}
}

/*responsive*/
@media screen and (max-width:1500px){
.eventinfo {padding: 0 10%;}
.generalinfo {padding: 0 8% 0 18%;}
.specialevents .item {width: 48%;}
.agenda{padding:90px 0;}
.agenda .two_third{width:80%;}
.agenda .one_third{width:20%; padding-left:3% !important;}
.about .one_third {width: 30%;}
.background {position: fixed;}
.contform h2, .contform .form, .contform .linkbtn, .reserve .content, .reserve h1, .reserve .linkbtn {position: relative; z-index: 2; }
}
@media screen and (max-width:1100px){
.info .half {width: 100% !important; margin: 0; padding: 150px 0 100px 0;}
.info .half:nth-of-type(1) {-webkit-clip-path: polygon(0 0, 100% 0, 100% 98%, 0% 100%); clip-path: polygon(0 0, 100% 0, 100% 98%, 0% 100%);}
.info .half:nth-of-type(2) {margin: -10% 0 0 0 !important;}
.generalinfo table td:nth-of-type(1) {padding-right: 10px;}
.reserve {padding: 150px 0;}
.overview .newscont.page {width: 47.5%;}
.overview .newscont.page:nth-of-type(1) {margin-right: 5%;}
.agenda{padding:50px 0;}
.agenda .controls{padding:26px 0 6px}
.agenda .controls h2{font-size:40px; line-height:32px; margin-bottom:16px !important;}
.calendar_container .day .text, .calendar_container .day .hover{padding:8px; font-size:12px;}
.about .one_third, .about .two_third {width: 100%; margin-bottom: 50px;}
.contact .continfo {float: right; padding: 70px 0 70px 30px;}
.contform .form {width: 100%;}
}
@media screen and (max-width:990px){
.eventinfo, .generalinfo {padding: 0 30px;}
.reserve .content .left, .reserve .content .right  {width: 100%; padding: 0; display: block;}
.reserve .content .right .placeholder {height: 0px;}
.morenews .item {width: 100%; margin-bottom: 50px;}
.morenews .item .text p {width: 100%; padding: 10px 20px;}
.specialevents .item {width: 100%;}

.page.agenda {padding: 100px 0 150px;}
.page.agenda .filters {margin-bottom: 20px; display: inline-block; width: 100%;}
.page.agenda .filters a {font-size: 15px; margin-right: 0; line-height: 24px; width: 50%; float: left; margin-bottom: 20px;}
.agenda{padding:30px 0;}
.agenda .container{width:90% !important;}
.agenda .two_third{width:70% !important;}
.agenda .one_third{width:30% !important; padding-left:3% !important;}
.calendar_container .day{width:24%; padding-top:24%; margin:0 1.333% 7px 0;}
.calendar_container .day:nth-of-type(7n){margin-right:1.333%;}
.calendar_container .day:nth-of-type(4n){margin-right:0;}
.calendar_container .day .circles i {font-size: 12px;}
.contact {padding: 0;}
.contact .container {width: 100%;}
.contact .contmap, .continfo, .continfo div {width: 100%; text-align: center; padding: 0;}
.contact .contmap {height: 300px;}
.contact .location {height: 100% !important;}
.about .image {display: none;}
}
@media screen and (max-width:750px){
.header.small .headerimg {height: 200px;}
.info .half .linkbtn.fill {width: 100%; text-align: center;}
.reserve {padding: 100px 0;}
.overview .newscont.page {width: 100%; margin: 0; padding: 0 0 80px 0;}
.specialevents .itemcont {margin-top: 0;}
.specialevents	 h1 {text-align: center;}
.specialevents .item .image, .specialevents .item .image div, .specialevents .item .image .date {transform: none; top: 0; right: 0; bottom: 0; margin: 0;}
.specialevents .item .image, .specialevents .item .text {width: 100%; margin: 0;}
.specialevents .item .image {height: 220px;}
.specialevents .item .text {top: 0;}
.page.agenda {padding: 50px 0 150px;}
.page.agenda .filters a {font-size: 13px; line-height: 14px;}
.agenda{padding:0 0 12px;}
.agenda .two_third{width:100% !important; margin-top:20px; padding-top:20px; border-top:2px dashed #eee;}
.agenda .one_third{width:100% !important; padding:0 !important;}
.agenda .filters{text-align:center; margin-bottom:0;}
.agenda .filters span{font-size:13px; padding-left:14px; margin-right:14px;}
.agenda .filters span::before{width:10px;}
.agenda .controls{margin:10px 0; padding-top:22px;}
.agenda .controls h2 br{display:none;}
.calendar_container .day{margin-bottom:5px;}
.calendar_container .day .text, .calendar_container .day .hover{padding:7px; font-size:12px;}
.calendar_container .day span{font-size:21px;}
.calendar_container .day small{top:8px; right:8px; font-size:12px; line-height:12px;}
}

.alert {
    padding: 20px;
    background-color: #f44336; /* Red */
    color: white;
    margin-bottom: 15px;
    text-align:left;
}
.alert.warning {
    background-color: #ff9800;
}

.alert.success {
    color: #4F8A10;
    background-color: #DFF2BF;
}

#totaalbedrag {
    margin-left:30px;

}
#totaalbedrag_div {
    background-color:#f0f0f0;
    width:100%;
    padding:10px;
}
.totaalbedrag {
    font-weight:bold;
}


/* --------------------------------

xtab-filter

-------------------------------- */
.cd-tab-filter-wrapper {
    background-color: #f0f0f0;
    /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);*/
    z-index: 3;

    margin-bottom:30px;
}
.cd-tab-filter-wrapper:after {
    content: "";
    display: table;
    clear: both;
}

.cd-tab-filter {
    /* tabbed navigation style on mobile - dropdown */
    position: relative;
    height: 50px;
    width: 300px;
    margin: 0 auto;
    z-index: 3;
}
.cd-tab-filter::after {
    /* small arrow icon */
    content: '';
    position: absolute;
    right: 14px;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url("../img/cd-icon-arrow.svg") no-repeat center center;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    pointer-events: none;
}
.cd-tab-filter ul {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #ffffff;
    box-shadow: inset 0 -2px 0 #1894aa;
}
.cd-tab-filter li {
    display: none;
}
.cd-tab-filter li:first-child {
    /* this way the placehodler is alway visible */
    display: block;
}
.cd-tab-filter a {
    display: block;
    /* set same size of the .cd-tab-filter */
    height: 50px;
    width: 300px;
    line-height: 50px;
    padding-left: 14px;

}
.cd-tab-filter a.selected {
    background: #1894aa;
    color: #ffffff;
}
.cd-tab-filter.is-open::after {
    /* small arrow rotation */
    -webkit-transform: translateY(-50%) rotate(-180deg);
    -moz-transform: translateY(-50%) rotate(-180deg);
    -ms-transform: translateY(-50%) rotate(-180deg);
    -o-transform: translateY(-50%) rotate(-180deg);
    transform: translateY(-50%) rotate(-180deg);
}
.cd-tab-filter.is-open ul {
    box-shadow: inset 0 -2px 0 #1894aa, 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index:3;
}
.cd-tab-filter.is-open ul li {
    display: block;
    z-index:3;

}
.cd-tab-filter.is-open .placeholder a {
    /* reduces the opacity of the placeholder on mobile when the menu is open */
    opacity: .4;
}
@media only screen and (min-width: 768px) {
    .cd-tab-filter {
        /* tabbed navigation style on medium devices */
        width: auto;
        cursor: auto;
    }
    .cd-tab-filter::after {
        /* hide the arrow */
        display: none;
    }
    .cd-tab-filter ul {
        background: transparent;
        position: static;
        box-shadow: none;
        text-align: center;
    }
    .cd-tab-filter li {
        display: inline-block;
    }
    .cd-tab-filter li.placeholder {
        display: none !important;
    }
    .cd-tab-filter a {
        display: inline-block;
        padding: 0 1em;
        width: auto;
        color: #9a9a9a;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 1rem;
    }
    .no-touch .cd-tab-filter a:hover {
        color: #41307c;
    }
    .cd-tab-filter a.selected {
        background: transparent;
        color: #1894aa;
        /* create border bottom using box-shadow property */
        box-shadow: inset 0 -2px 0 #1894aa;
    }
    .cd-tab-filter.is-open ul li {
        display: inline-block;
    }
}
@media only screen and (min-width: 1170px) {
    .cd-tab-filter {
        /* tabbed navigation on big devices */
        width: 100%;
        float: right;
        margin: 0;
        -webkit-transition: width 0.3s;
        -moz-transition: width 0.3s;
        transition: width 0.3s;
    }
    .cd-tab-filter.filter-is-visible {
        /* reduce width when filter is visible */
        width: 80%;
    }
}

/* --------------------------------

xfilter

-------------------------------- */
.cd-filter {
    position: absolute;
    top: 0;
    left: 0;
    width: 280px;
    height: 100%;
    background: #ffffff;
    box-shadow: 4px 4px 20px transparent;
    z-index: 2;
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: -webkit-transform 0.3s, box-shadow 0.3s;
    -moz-transition: -moz-transform 0.3s, box-shadow 0.3s;
    transition: transform 0.3s, box-shadow 0.3s;
}
.cd-filter::before {
    /* top colored bar */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 50px;
    width: 100%;
    background-color: #41307c;
    z-index: 2;
}
.cd-filter form {
    padding: 70px 20px;
}
.cd-filter .cd-close {
    position: absolute;
    top: 0;
    right: 0;
    height: 50px;
    line-height: 50px;
    width: 60px;
    color: #ffffff;
    font-size: 1.3rem;
    text-align: center;
    background: #37296a;
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    transition: opacity 0.3s;
    z-index: 3;
}
.no-touch .cd-filter .cd-close:hover {
    background: #32255f;
}
.cd-filter.filter-is-visible {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2);
}
.cd-filter.filter-is-visible .cd-close {
    opacity: 1;
}
@media only screen and (min-width: 1170px) {
    .cd-filter {
        width: 20%;
    }
    .cd-filter form {
        padding: 70px 10%;
    }
}

.cd-filter-trigger {
    position: absolute;
    top: 0;
    left: 0;
    height: 50px;
    line-height: 50px;
    width: 60px;
    /* image replacement */
    overflow: hidden;
    text-indent: 100%;
    color: transparent;
    white-space: nowrap;
    background: transparent url("../img/cd-icon-filter.svg") no-repeat center center;
    z-index: 3;
}
.cd-filter-trigger.filter-is-visible {
    pointer-events: none;
}
@media only screen and (min-width: 1170px) {
    .cd-filter-trigger {
        width: auto;
        left: 2%;
        text-indent: 0;
        color: #9a9a9a;
        text-transform: uppercase;
        font-size: 1.3rem;
        font-weight: 700;
        padding-left: 24px;
        background-position: left center;
        -webkit-transition: color 0.3s;
        -moz-transition: color 0.3s;
        transition: color 0.3s;
    }
    .no-touch .cd-filter-trigger:hover {
        color: #41307c;
    }
    .cd-filter-trigger.filter-is-visible, .cd-filter-trigger.filter-is-visible:hover {
        color: #ffffff;
    }
}


.float-left {
    float:left;
}
.float-right {
    float:right;
}


div.wpcf7-response-output {
    margin: 0;
}
span.wpcf7-form-control-wrap input {
    margin-bottom:5px;
}
