html, body { background: #ffffff url('/images/bg01.png'); margin: 0; padding: 0; height: 100%; font-family: "Work Sans", sans-serif; font-size: 21px; font-weight: 200; line-height: 1.65em; }
.no-margin { margin: 0 !important; }
.no-padding { padding: 0 !important; }
.t-margin { margin-top: 30px; }
.b-margin { margin-bottom: 30px; }
.b-margin-sm { margin-bottom: 15px; }
p { margin: 0 !important; }

#page-wrapper { min-height: calc(100vh - 315px); }
#content-wrapper { }

.header {
	text-align: center;
	padding: 35px 0 0 0;
	background-color: #ffffff;
}

.header .logo {
	display: block;
	background-image: url('/images/skoon-interieurbouw-logo.png');
	margin: 0 auto;
}

.topbar {
	box-sizing: border-box;
	color: #fff;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	height: 50px;
	line-height: 50px;
	z-index: 9999;
	text-align: left;
	padding-left: 15px;
	-webkit-transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;	
}
.topbar i { font-size: 30px; }
.topbar .navbar-toggle { z-index: 999999; opacity: 0.5; }
.topbar div:first-of-type { z-index: 99999; position: absolute; width: 42px; box-sizing: border-box; }
.topbar div:last-of-type { font-size: 19px;margin-right:-10px;text-align: center; float: right; width: 100%; box-sizing: border-box; }
.topbar div:last-of-type img { margin-right: 10px; margin-bottom: 2px; }



/* H E A D E R S */

h1, .appear-h1 {
	font-family: "Libre Baskerville", serif;
	font-size: 35px;
	font-weight: normal;
	margin-bottom: 5px;
	margin-top: 0px;
}

h2 {
	font-family: "Libre Baskerville", serif;
	font-size: 28px;
	font-weight: 300;
	margin-bottom: 0px;
	margin-top: 0px;
}

h3 {
	font-family: "Libre Baskerville", serif;
	font-size: 23px;
	font-weight: normal;
	font-weight: 500;
	margin-bottom: 10px;
	margin-top: 10px;
	color: #000;
}

/* N A V I G A T I O N */

.navbar-toggle { position: relative; color: #000; }
.navbar { 
	-webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.3)), url("/images/bg01.png"); 
	font-weight: 300; 
	letter-spacing: 0.5px; 
	border: none; 
	padding: 0; 
	margin-top: 35px;
	border-radius: 0px !important;
}
.navbar-collapse { padding-left: 0; padding-right: 0; }
.nav ul li { background: none; position: relative; }
.nav > li > a { font-weight: 200; padding-left: 1em; padding-right: 1em; font-size: 21px; line-height: 40px; color: #000; display: inline-block;transition: background 0.2s ease, color 0.4s linear; }
.nav > li.active { color: #000; font-weight: 500; }
.nav > li.active:before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0px;                 /* net onder het li */
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: .45em solid currentColor;
  border-right: .45em solid currentColor;
  border-bottom: .45em solid transparent; /* kleur van het driehoekje */
}
.nav > li > a:hover, .nav > li > a:focus { background-color: transparent !important; color: #a5d1e4; }
.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
  color: #fff;
}
.navbar .navbar-collapse {
  text-align: center;
}

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;    
}
.navbar-toggle { float: none; margin: 0 !important; padding: 3px 0 0 0; }
.navbar-collapse { padding-left: 0; padding-right: 0; }

/* D R O P D O W N */

.nav ul{
    list-style: none;
    position: absolute;
    left: -9999px;
	top: 100%;
	margin-left: 0px;
	z-index: 100;
	display: block;
	border-radius: 0 0 10px 10px;
	border: none;
}
.nav ul li { float: none; background-color: transparent !important; }
.nav ul li:first-of-type { padding-top: 20px; }
.nav ul li:last-of-type { padding-bottom: 20px; }
.nav ul li a { background-color: transparent !important; color: #000; font-weight: 300; font-size: 17px !important; white-space:nowrap; }
.nav li:hover ul{ left: 2px; opacity:1; }
.nav li:hover ul a { background-color: transparent; }
.nav li.active a { color: #fff; }
.dropdown-menu { 
	opacity: 0; 
	padding: 0 !important; 
    -webkit-transition: opacity 0.35s; 
    transition: opacity 0.35s;	
}

/* C A R O U S E L */

.jumbotron .carousel-caption {
	width: 100%;
	background: rgba(5, 27, 37, 0.80);
	left: 0%;
	right: 0%;
	bottom: 0px;
	min-height: 0px;
	padding-top: 25px;
	padding-bottom: 25px;
}

.jumbotron {
    margin-bottom: 0px !important;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    background-size: cover;
	width: 100%;
	box-sizing:border-box;
	padding: 0 !important;
	border-radius: 0px !important;
	position: relative;
	background-color: #022a3b;
}

.jumbotron .carousel-caption header, .jumbotron .carousel-caption h1 { font-weight: 600;font-size: 34px; line-height: 37px; margin: 0; }
.jumbotron .carousel-caption p { font-family: "Libre Baskerville", serif; font-weight: 400; letter-spacing: 0.5px; font-size: 24px; }
.jumbotron .carousel-caption:empty { display: none; }


/*
.container-fluid .jumbotron header {
	background: #433d35;
	background: rgba(67, 61, 53, 0.85);
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #d3d1cf;
	padding: 1em 0;
	font-weight: 300;
	text-align: center;
	font-size: 1.25em;
	letter-spacing: -0.025em;
	vertical-align: middle;
}
.container-fluid .jumbotron header p {
	font-size: inherit;
}

.container-fluid .jumbotron header a {
	vertical-align: middle;
	color: #fff;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.15)), url('/images/bg01.png');
	border-radius: 5px;
	background-color: #a99173;
	display: inline-block;
	padding: 0 1.5em;
	line-height: 2.9em;
	min-width: 9em;
	text-align: center;
	font-weight: 600;
	letter-spacing: 0.002em;
	margin-left: 1em;
	font-size: 0.8em;
}
.container-fluid .jumbotron header a:hover { background-color: #cab396; }
*/

.carousel-inner>.item>img, .carousel-inner>.item>a>img { margin: 0 auto; }



/* C O N T E N T */

a, a:focus {
	text-decoration: none;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
a:hover {
	text-decoration: none;
}

.ball-items {
	background-color: #fff; 
	padding-top: 35px;
}


.overview,
.heading,
.content {	
	background-color: #fff; 
	padding-top: 35px;
	padding-bottom: 35px;
}

.content.contactform { padding-top: 0px; margin-top: -50px; }

.main-image { background-color: #fff; }
.heading { padding-bottom: 35px; padding-top: 35px; }
/*.content { padding-bottom: 70px; }*/
.overview { padding-bottom: 0px; }
div.overview + div.overview { padding-top: 0px; }

.beam-small {
	background-image: url('/images/bg02.png'), url('/images/bg03.png'), url('/images/bg01.png');
	background-position: top left,bottom left,top left;
	background-size: 100% 6em,100% 6em,auto;
	background-repeat: no-repeat,no-repeat,repeat;
	opacity: 0.8;
}

.beam-gigantic {
	text-align: center;
	background-image: url('/images/bg02.png'), url('/images/bg03.png'), url('/images/bg01.png');
	background-position: top left,bottom left,top left;
	background-size: 100% 6em,100% 6em,auto;
	background-repeat: no-repeat,no-repeat,repeat;
	padding:  50px 50px 70px 50px;
	font-size: 1.5em;
	letter-spacing: -0.025em;
}

.beam-gigantic h2 {
	font-size: 1.5em; 
	margin-bottom: 20px;
	font-weight: 600;
	line-height: 1.75em;
}

.overview h3 { margin-top: 0; }
.overview img { max-width: 100% !important; height: auto !important; border-radius: 8px; }
.overview .item { margin-top: 20px; margin-bottom: 20px; min-height: 210px; }

.beam-large {
    background-image: -moz-linear-gradient(top, #0c3c51, rgba(0,38,54,0.35)), url('/images/bg01.png');
    background-image: -webkit-linear-gradient(top, #0c3c51, rgba(0,38,54,0.35)), url('/images/bg01.png');
    background-image: -ms-linear-gradient(top, #0c3c51, rgba(0,38,54,0.35)), url('/images/bg01.png');
	padding: 1.5em;
	text-align: center;
	font-size: 1.75em;
	font-weight: 600;
	vertical-align: middle;
	letter-spacing: -0.01em;
}

/*input[type="submit"], input[type="reset"], input[type="button"], .button, */
.beam-large a {
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    border-radius: 5px;
    border: 0;
    cursor: pointer;
    display: inline-block;
    padding: 0 1.5em;
    line-height: 2.75em;
    min-width: 9em;
    text-align: center;
    text-decoration: none;
	vertical-align: middle;
	letter-spacing: 0.002em;
	margin-left: 1em;	
	font-size: 0.6em;
}

.main-image img {
	border-radius: 8px;
	max-width:100%;
	width: 100% !important;
	height: auto !important;
}



/* F O O T E R */

.footer {
	padding: 3em 0;
}

.footer h3 {
	margin-top: 0;
	font-size: 1em;
	letter-spacing: -0.025em;
}

.footer p {
	font-size:0.7em;
	line-height:20px;
}

.footer label {
	min-width: 50px;
	display: inline-block;
	color: inherit;
	font-weight: 600;
	line-height: 1.75em;
	margin-bottom: 0.5em;
}

.footer a {
	color: #5b5b5b;
}

.form-group label {
	margin-bottom: 0px;
	font-size: 18px;
}

.btn-primary {
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.15)), url('/images/bg01.png');
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	border-radius: 5px;
	cursor: pointer;
	line-height: 2.75em;
	min-width: 9em;
	letter-spacing: 0.002em;
	font-weight: 400;
	border: none;
}
	

.subfooter {
	font-size: 0.6em;
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.15)), url('/images/bg01.png');
	padding-top: 18px;
	padding-bottom: 15px;
}

.icons {
	font-size: 35px !important;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.fa-facebook { margin-right: 10px; }

iframe {
	border: none;
	width: 100%;
}	

.container-fluid.overview {
	padding: 3rem 15px;
	background-color: transparent;
}
/*
.container-fluid.overview > .row {
	margin-left: -30px;
	margin-right: -30px;
}
*/
.container-fluid.overview .item { margin-bottom: 30px; }
.container-fluid.overview .text-right { padding-left: 0; }
.container-fluid.overview .service {
	background-color: #0c3c51;
    background: -webkit-linear-gradient(#000, #0c3c51); /* For Safari 5.1 to 6.0 */
    background: linear-gradient(#000, #0c3c51); /* Standard syntax */	
	text-align: center;
	color: #fff;
	font-size: 15px;
	letter-spacing: 0.5px;
	font-weight: 500;
	-webkit-border-radius: 0 0 14px 14px; 
	-moz-border-radius: 0 0 14px 14px;
	border-radius: 0 0 14px 14px;	
	padding-bottom: 20px;
	display: inline-block;
	width: 100%;
	text-decoration: none;
	font-family: "Libre Baskerville", serif;
}
.container-fluid.overview .service img { 
	opacity: 0.8;
	-webkit-border-radius: 14px; 
	-moz-border-radius: 14px;
}
.container-fluid.overview .service:hover img { 
	opacity: 0.9;
    -ms-transform: scale(1.05, 1.05); /* IE 9 */
    -webkit-transform: scale(1.05, 1.05); /* Safari */
    transform: scale(1.05, 1.05);
}

.container-fluid.overview .service div {
	width: 100%;
	overflow: hidden;
	margin-bottom: 20px;
}
.container-fluid.overview .service img {
	width: 100%;
	-webkit-border-radius: 3px 3px 0 0; 
	-moz-border-radius: 3px 3px 0 0;
	border-radius: 3px 3px 0 0;	
	transition: transform 0.2s ease-in;
	-moz-transition: transform 0.2s ease-in;
	-ms-transition: transform 0.2s ease-in;
	-o-transition: transform 0.2s ease-in;
	-webkit-transition: transform 0.2s ease-in;		

}

.container-fluid.references {
	padding: 3rem 15px;
}
.container-fluid.references .slide {
	background-color: #ffffff;
	padding: 15px;
}
.slick-slide img {
	max-width: 218px;
	max-height: 100px;
}

/*  G A L L E R Y */

.gallery { margin-top: -40px; padding-bottom: 30px; background-color: #fff; }

.img-title {
	width: 100%;
	text-align: center;
	font-size: 16px;
	padding-top: 5px;
	padding-bottom: 35px;
}


/* Responsive tables */

.resp-table {
	width: 100%;
	border-collapse: collapse;
}

.resp-table tbody td {
	display: table-cell;
	vertical-align: middle;
}

@media (max-width: 768px) {
	.resp-table tbody tr {
		display: block;
		margin-bottom: 12px;
		overflow: hidden;
		background: #fff; 
	}

	.resp-table tbody td {
		display: block;
		width: 100%;
		position: relative;
		border: none;                
		text-align: left;           
		box-sizing: border-box;
	}

	.resp-table tbody td:last-child {
		border-bottom: none;
	}
}