/*

Theme Name: Selinde
Theme Url: www.selinde.nl
Description: This theme has been created by Dutch Design Office.
Author: Aemworks & Dutch Design Office
Author Url: www.dutchdesignoffice.nl

Version: 1.0

*/
/*COLOUR CODE

Blue: #303366
Grey: #dedee6
*/
/*---------------------------BASIC STYLE---------------------------*/

@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700);
@import url('css/menu.css');
@import url('css/basics.css');

body {
 color       : #303366;
 font-family : 'Roboto Slab', serif;
 font-size   : 16px!important;
 font-weight : 400;
}
.logo {
 text-align : center;
}
.logo img {
 height     : auto;
 margin-top : 25px;
 max-width  : 80%;
}

.slider {
 position : relative;
 height   : 500px;
}
.sliderPage {
 position   : relative;
 height     : 256px;
 overflow   : hidden;
 background : #303366;
}
.sliderPage > span.headerTitle {
 position : absolute;
 top      : 30%;
}
  .sliderPage h1 {
 color : #fff;
}
.top_header {
 z-index             : 9;
 position            : absolute;
 top                 : 0;
 right               : 0;
 left                : 0;
 height              : 58px;
 background          : url('img/slider_top.png') 100% no-repeat;
 background-position : center;
}
.bottom_header {
 z-index             : 9;
 position            : absolute;
 right               : 0;
 bottom              : 0;
 left                : 0;
 height              : 99px;
 background          : url('img/slider_bottom.png') 100%;
 background-position : center;
}
.content {
 padding-top    : 40px;
 padding-bottom : 70px;
 text-align     : center;
}
.contentPage {
 padding-bottom : 70px;
 text-align     : left;
}
.afspraak {
 padding : 60px 80px 40px 60px;
}
.rowBorder {
 border-top    : 1px solid #dedee6;
 border-bottom : 1px solid #dedee6;
}
.openingstijden {
 padding    : 60px 20px 86px 20px;
 color      : #bfbfce;
 text-align : center;
 background : #303366;
 line-height: 30px;
}
.openingstijden h3 {
 color : #fff;
}
.maps {
 position : relative;
}
.maps span {
 z-index      : 99;
 position     : absolute;
 top          : 15%;
 padding-left : 10%;
}
.maps span >span > h4 {
 font-size : 24px;
}
.maps span h4 {
 font-size : 40px;
}

/* .infoMaps {
 position   : absolute;
 margin-top : 102px;
 padding    : 28px;
 background : #fff;
 -webkit-border-radius : 5px;
 -moz-border-radius    : 5px;
 border-radius: 5px;
} */
/***** SLIDER SETUP *****/

.sliderMain {
 height     : 638px;
 padding    : 0!important;
 background : url('img/slider.jpg');
}

.carousel-caption {
 top            : 20%;
 right          : 0;
 bottom         : auto;
 left           : 15%;
 width          : 50%;
 padding-bottom : 30px;
 text-align     : left;
 text-shadow    : none;
}

  .carousel-caption h4 {
 margin-bottom : 30px;
 color         : #fff;
 font-size     : 48px;
 font-style    : bold;
 font-weight   : 700;
 line-height   : normal;
}

.carousel-caption .btn-default {
 position              : absolute;
 bottom                : 0px;
 left                  : 0px;
 padding               : 10px 20px;
 color                 : #fff!important;
 border                : 0;
 border-radius         : 5px!important;
 font-size             : 16px;
 background            : #303366!important;
 -moz-border-radius    : 5px;
 -webkit-border-radius : 5px;
}
.carousel-control {
 width : 10%;
}
.carousel-control.left,
.carousel-control.right {
 background-image : none!important;
}
.glyphicon-chevron-left:before,
.glyphicon-chevron-right:before {
 content    : "";
 background : #000;
}
.carousel-control .glyphicon-chevron-left,
.carousel-control .icon-prev {
 height     : 50px;
 width: 26px;
 background : url('img/icon-left-arrow.png') no-repeat!important;
}
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {
 height     : 50px;
 width: 26px;
 background : url('img/icon-right-arrow.png') no-repeat!important;
}
/*****           CONTACTFORM           *****/
.ninja-forms-form input,
.ninja-forms-form textarea {
 padding               : 15px 10px;
 color                 : #8789ac;
 border                : 1px solid #dedee6;
 border-radius         : 5px;
 font-size             : 14px;
 -webkit-border-radius : 5px;
 -moz-border-radius    : 5px;
}

textarea.omschrijfKlacht {
 height : 167px!important;
}
.ninja-forms-required-items {
 display : none;
}
h2.ninja-forms-form-title {
 margin-bottom : 20px;
 font-weight   : 700;
}
#nf_submit_1 > input {
 float         : right;
 padding       : 10px 20px;
 color         : #fff;
 border        : 0;
 border-radius : 0px;
 border-radius : 5px;
 font-size     : 16px;
 background    : #303366;
}
/*****           Dropdown           *****/
.panel-group .panel .panel-default {
 border        : 0px!important;
 border-radius : 0!important;
}
.panel, .panel-default>.panel-heading+.panel-collapse>.panel-body {
 border : 0px;
}
h4.panel-title a.accordion-toggle {
 display         : block;
 color           : #303366;
 text-decoration : none;
 font-size       : 24px;
 font-weight     : 700;
 line-height     : 51px;
}
.panel-default>.panel-heading {
 background-color : #fff;
}
.accordion-toggle.collapsed {
 background-image    : url('img/icon_dropdown.png');
 background-color    : #fff;
 background-repeat   : no-repeat;
 background-position : right center!important;
 background-size     : 35px 35px;
}
.panel {
 border-bottom : 2px solid #dedee6;
 box-shadow    : none!important;
}
.panel-group .panel+.panel {
 margin-top : 0px;
}
.panel-group .panel {
 border-radius : 0px;
}
.panel-body { padding-bottom: 40px; }

.contactgegevensFooter {
 padding-top    : 30px;
 padding-bottom : 30px;
}
.contactgegevensFooter a {
 text-decoration : none;
}
.btn-default {
 color           : #303366!important;
 border          : 2px solid #303366;
 text-decoration : none;
 font-weight     : 400;
 background      : none!important;
}
.btn-default:hover {
 color        : #fff!important;
 border-color : #303366!important;
 background   : #303366!important;
}
/***** GROTER DAN 768px DOE DIT ******/
.col-xs-12.logo {
 display    : block;
 text-align : center;
}
@media (min-width: 768px) {
 .carousel-control .glyphicon-chevron-left,
 .carousel-control .glyphicon-chevron-right,
 .carousel-control .icon-next,
 .carousel-control .icon-prev {
   margin-top : -47px;
 }
}
/***** KLEINER DAN 768px DOE DIT ******/
@media (max-width: 991px) {
 .logo img {
   width  : 200px;
   height : auto;
 }

}
@media (max-width: 767px) {
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next,
  .carousel-control .icon-prev {
    margin-top : -58px;
  }
  .logo { text-align: left; }
 .afspraak {
   padding : 30px;
 }
 h4.panel-title a.accordion-toggle { font-size: 18px;}
 .carousel-caption {
   width : 80%;
 }
 h1 {
   font-size : 30px;
 }
 h2 {
   font-size : 20px;
 }
 .carousel-caption h4 {
   font-size : 30px;
 }
 .infoMaps {
   margin-top : 73px;
 }
 .maps span h4 {
   font-size   : 30px;
   line-height : normal;
 }
}
