/*
 * css-file: deliflanders.css 
 * klant: DELIFLANDERS
 * datum: 12/2015
 * 
 * iDel Webdesign
 */

/* --- ALGEMEEN --- */
html{
	height:100%;
}
body {
    width: 100%;
    height:100%;
    font-family: 'Roboto Condensed', sans-serif;
    color: #fff;
    padding:0 10px 0 10px;
    background-color: #fff;
}
.carousel,
.item,
.active {
    height: 100%;
}
.carousel-inner {
    height: 100%;
}

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
#balk-boven{
	position:fixed;
	background-color:#fff;
	width:100%;
	height:10px;
	top:0;
	left:0;
	z-index:99999;
}
#wrap{
	min-height: 100%;
  	height: auto;
  	/* hoogte footer */
  	margin: 0 auto 0 auto;
  	padding: 0 0 10px 0;
  	overflow:hidden;
  	position:relative;
}
html {
    width: 100%;
    height: 100%;
}
h1,h2,h3,h4,h5,h6 {
    margin: 0 0 35px;
    text-transform: uppercase;
}
h2{
	font-size:60px;
	font-weight:normal !important;
}
.black{
	color:#000;
}
h2 span{
	font-size:80px;
	color:#f25450;
}
h4{
	font-size:40px;
	font-weight:normal !important;
	color:#000;
	padding-bottom:20px;
	border-bottom:solid 2px #ccc;
}
h5{
	font-size:18px;
	color:#555;
	margin:0 0 15px 0;
	padding:0;
}
p {
    margin: 0 0 25px;
    font-size: 16px;
    line-height: 1.5;
}
a {
    color: #000;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    text-decoration: none;
}
a:hover,
a:focus {
    text-decoration: none;
    color: #555;
}
.light {
    font-weight: 400;
}

.btn_hidden{
     opacity:0;
}
.visible{
     opacity:1;
}
.content-section {
    padding-top: 100px;
    padding-bottom:100px;
}
.tekst{
	color:#000;
	font-size:16px;
}

/* --- NAVIGATIE --- */
.navbar-custom {
    margin-bottom: 0;
    text-transform: uppercase;
    background-color: #fff;
    padding:25px 0;
      -moz-transition: all 200ms ease-in;
  -webkit-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
  margin:10px;
}
.nav-fixed{
	background-color:#000;
	padding:15px 0;
}
.nav-fixed a{
	color:#fff !important;
}
.navbar-toggle i.fa-bars{
	color:#000;
}
.nav-fixed .navbar-toggle i.fa-bars{
	color:#fff;
}
.navbar-custom .navbar-brand {
    font-size:28px;
    color:#F25450;
    font-weight:400;
}
.navbar-custom .navbar-brand span span{
	text-transform:lowercase;
	color:#000;
	font-size:22px;
}
.nav-fixed .navbar-brand span span{
	color:#fff !important;
}
.navbar-custom .navbar-brand:focus {
    outline: 0;
}
.navbar-custom .navbar-brand .navbar-toggle {
    padding: 4px 6px;
    font-size: 16px;
    color: #fff;
}
.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
    outline: 0;
}
#nav-logo{
	position:absolute;
	top:0;
	left:30%;
}
.navbar-custom a {
    color: #000;
}
.navbar-custom .nav li a {
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    font-size:16px;
}
.navbar-custom .nav li a:hover {
    outline: 0;
    color: #f25450;
    background-color: transparent;
}
.navbar-custom .nav li a:focus,
.navbar-custom .nav li a:active {
    outline: 0;
    background-color: transparent;
}
.navbar-custom .nav li.active {
    outline: 0;
}
.navbar-custom .nav li.active a:hover {
    color: #f25450;
}
.fa-instagram{
	font-size:18px !important;
}

/* --- logo --- */
.intro-logo {
	/*
    display: table;
    width: 100%;
    text-align: center;
    color: #fff;
    background-color: #fff;
    position:relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    */
   	display: table;
    width: 100%;
    height:100%;
    text-align: center;
    color: #fff;
    background: url(../img/slide01_bw.jpg) no-repeat 50% 0 fixed;
    background-color: #000;
    position:relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.intro-logo .intro-body-logo {
    display: table-cell;
    vertical-align: middle;
    height:100vh;
    position:relative;
}

/* ---  HEADER, INTRO --- */
h1 img{
		max-width:100%;
	}
.intro {
    display: table;
    width: 100%;
    text-align: center;
    color: #fff;
    background: url(../img/slide01.jpg) no-repeat 50% 0 fixed;
    background-color: #000;
    position:relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.intro .intro-body {
    display: table-cell;
    vertical-align: middle;
    position:relative;
    padding:300px 0;
}
.intro .intro-body .brand-heading{
	margin-top:15%;
	opacity:0;
}
.intro .intro-body .brand-heading img{
	width:400px;
	      -moz-transition: all 500ms ease-in;
  -webkit-transition: all 500ms ease-in;
  -o-transition: all 500ms ease-in;
  transition: all 500ms ease-in;
}
.intro .intro-body .logo-fade img{
	width:300px;
}
.intro-logo h1{
	opacity:0;
}
#tagline{
	position:absolute;
	right:50px;
	bottom:50px;
	color:#fff;
	font-size:70px;
	text-align:right;
	font-weight:bold;
	line-height:70px;
}
#tagline .zaak{
	display:block;
	color:#f25450;
	font-size:50px;
}
#tagline .line{
	display:block;
}
#tagline .visible{
	opacity:1;
}
.btn-circle {
	display:block;
	width:50px;
    height: 50px;
    margin-top: 15px;
    background-color:#f25450;
    font-size: 24px;
    color: #000;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    border-top-left-radius:100% !important;
    border-top-right-radius:100% !important;
}
.btn-circle i{
	color:#fff;
}
#topPage{
	height:10px;
	background-color:#f25450;
	position:absolute;
	bottom:0px;
	width:100%;
	left:0;
}

/* > knop onderaan intro 'naar beneden' */
.btn-circle:hover,
.btn-circle:focus {
    outline: 0;
    background-color:#f25450 !important;
}
.btn-circle i.animated {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 1s;
}
.btn-circle:hover i.animated {
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite; 
    color:#fff;
}
@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(1.5, 1.5); opacity: 1;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1, 1); opacity: 1;}
}

/* --- OVER ONS --- */
#overOns{
	background-color:#fff;
    color: #000;
    width:100%;
    float:left;
    padding:150px 0;
    font-size:16px;
}
#overOns p{
	font-size:16px;
	text-align:justify;
}
#overOns p span{
	text-decoration:underline;
	font-weight:bold;
}
#overOns img{
	max-width:100%;
}
#overOns-foto1{
	margin-top:20px;
}
#overOns-foto2{
	margin-top:30px;
}

/* --- PARTNERS --- */
#partners{
	background-color:#222;
    color: #000;
    width:100%;
    float:left;
    padding:150px 0;
    font-size:16px;
}
#partners p{
	color:#fff;
	text-align:center;
	font-size:16px;
}
.logo-partner{
	font-size:30px;
	font-family: 'Great Vibes', cursive;
}
.logo-partner .mes{
	display:inline-block;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    float:left;
}
.logo-partner .partner-naam{
	display:inline-block;
	float:left;
}
.allePartners{
	position:relative;
}
.pijl a{
	color:#fff;
	font-size:40px !important;
	position:absolute;
	top:150px;
	display:block;
}
.carousel-control .icon-prev:before,
.carousel-control .icon-next:before{
	content:none;
}
.logo-partner a{
	color:#fff;
	display:block;
	padding:30px 15px;
	border:solid 10px #444;
	background-color:#000;
	float:left;
	width:100%;
	margin:0 0 30px 0;
	position:relative;
}
.logo-partner a .center-partner{
	display:block;
	position:relative;
	left:50%;
	float:left;
}
.logo-partner a .center-center{
	display:block;
	position:relative;
	left:-50%;
	float:left;
}
.logo-partner a:hover{
	color:#fff;
	background-color:#222;
}
.logo-partner a:hover .mes{
	-ms-transform: rotate(-440deg);
    -webkit-transform: rotate(-440deg);
    transform: rotate(-440deg);
}
.logo-partner .no-link:hover .mes{
	-ms-transform: rotate(0);
    -webkit-transform: rotate(0);
    transform: rotate(0);
}

/* --- CONTACT --- */
#tussenbeeld{
	background: url(../img/slide02.jpg) no-repeat fixed; 
	background-position:center bottom;
	height: auto;
	margin: 0 auto; 
    width: 100%; 
    position: relative; 
    padding: 200px 0;
    color: #fff;
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
  	float:left;
}
#tussenbeeld2{
	background: url(../img/slide04.jpg) no-repeat fixed; 
	background-position:center bottom;
	height: auto;
	margin: 0 auto; 
    width: 100%; 
    position: relative; 
    padding: 200px 0;
    color: #fff;
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
  	float:left;
}
#tussenbeeld3{
	background: url(../img/slide03.jpg) no-repeat fixed; 
	background-position:center bottom;
	height: auto;
	margin: 0 auto; 
    width: 100%; 
    position: relative; 
    padding: 200px 0;
    color: #fff;
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
  	float:left;
}
/* --- PRODUCTEN --- */
#producten{
    color: #fff;
    background-color:#000;
    float:left;
    width: 100%;
    position:relative;
    padding:0;
    min-height:900px;
}
#producten .item{
	height:1000px;
}
#prod-titel{
	position:absolute;
	top:150px;
	left:50%;
	margin-left:-235px;
	z-index:999;
}
#prod-nav{
	position:absolute;
	left:0;
	top:300px;
	background-color:#fff;
	padding:30px;
	z-index:999;
	 -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    height:500px;
}
#prod-nav.active{
	left:-215px;
	height:500px;
}
#menu-toggle{
	display:block;
	position:absolute;
	width:50px;
	height:50px;
	right:-40px;
	line-height:40px;
	top:50px;
	color:#000;
	background-color:#fff;
	border-bottom-left-radius:0;
	border-top-left-radius:0;
	border-top-right-radius:50%;
	border-bottom-right-radius:50%;
}
#prod-nav ul{
	padding:0;
	margin:0;
}
#prod-nav li{
	list-style:none;
}
#prod-nav .titel{
	font-size:22px;
	color:#F25450;
	margin-bottom:15px;
}
#prod-nav a{
	display:block;
	cursor:pointer;
	font-size:18px;
	padding:5px 0;
}
#prod-nav a:hover{
	color:#F25450;
}
#producten h3{
	text-align:center;
	width:100%;
	color:#F25450;
	font-size:32px;
	padding-top:15px;
}
#producten .item{
	opacity:0;
}
#producten .item-content{
	padding-top:220px;
}
#producten .item-content .item-intro{
	font-size:20px;
	text-align:center;
	margin-bottom:100px;
}
#producten .item-content .land{
	text-align:center;
}
#producten .item-content .land .flag{
	margin-bottom:30px;
}
#producten .item-content .land .specs{
	line-height:30px;
	font-size:18px;	
}

/* --- CONTACT --- */
#contact{
	padding-top:150px;
	padding-bottom:150px;
    color: #fff;
    background-color:#c59d5f;
    float:left;
    width: 100%;
    background: url(../img/slide04.jpg) no-repeat fixed; 
	background-position:center bottom;
	height: auto;
	margin: 0 auto; 
    width: 100%; 
    position: relative; 
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}
.contactgegevens{
	font-size:16px;
}
#contact p{
	font-size:16px;
}

/* --- FOOTER --- */
footer {
	float:left;
	width:100%;
	background-color:#fff;
    padding: 25px 0;
}
footer p {
    margin: 0;
	font-size:16px;
	color:#000;
}
footer a{
	color:#000;
}
footer a:hover{
	color:#F25450;
}
footer #idel{
	text-align:right;
}
#go-up a{
	background-color:#fff;
}
#go-up a:hover,
#go-up a:focus{
	background-color:#fff !important;
}
#go-up i{
	color:#000;
}