/* eigen css */

@font-face {
    font-family: 'microsoft new tai lue';
    src: url(fonts/msyi.ttf);
}

/* ======= Global CSS ======= */


body {
	font-family: 'lato';
	margin: 0 auto;
}

h1, h2 {
	font-family: 'lato';
}

.p-none { padding: 0 !important; }

.m-none { margin: 0 !important; }

.row {
	margin:0;
	padding:0;
}

p { font-size:12px; }

a:hover { text-decoration:none!important; }
a:focus {
	outline: 0 -webkit-focus-ring-color;
	text-decoration: none;
}

.text-underline {
	border-bottom:2px solid #e84e0e;
	padding-bottom: 4px;
}

.text-uppercase { text-transform: uppercase; }

.text-lightgrey { color:#777777; }

.text-grey { color:rgb(51, 51, 51); }

.text-pink { color:rgb(242, 141, 131); }

.text-white { color:rgb(241, 241, 241); }

.color-grey { color:rgb(51, 51, 51); }

.color-pink { color:rgb(242, 141, 131); }

.color-white { color:rgb(241, 241, 241); }

.background-grey { background-color:rgb(51, 51, 51); }

.background-pink { background-color:rgb(242, 141, 131); }

.background-white { background-color:rgb(241, 241, 241); }

.bold { font-weight:900; }

.align-left { text-align: left; }

.align-center { text-align: center; }

.align-right { text-align: right; }


.horizontal {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}

.vertical {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipV;
-ms-filter: "FlipV";
}

/* ======= Nav ======= */

nav.navbar.navbar-default {
	min-height:80px;
	border-radius:0;
	margin-bottom: 0;
    border: none;
    background-color:rgb(241, 241, 241);
    background-image:none;
    box-shadow: none;
}

.nav>li>a {
	font-size:12px;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active {
	border-bottom:2px solid #e84e0e;
	padding-bottom: 4px;
	background-color: rgb(241, 241, 241);
	cursor:pointer;
}

.navbar-default .navbar-nav>a.active:after,
.navbar-default .navbar-nav>li>a:focus:after,
.navbar-default .navbar-nav>li>a:hover:after {
	content: "";
	width: auto;
	min-height:20px;
	display:block;
	background-image: url('../img/visje.png');
	background-repeat: no-repeat;
	background-position:center center;
	margin-top: 6px;
    margin-bottom: -26px;
}

.navbar-default .navbar-nav>li.active:after {
	content: "";
	width: auto;
	height:20px;
	display:block;
	background-image: url('../img/visje.png');
	background-repeat: no-repeat;
	background-position:center center;
	margin-top: 0px;
    margin-bottom: -26px;
}

.navbar-default .navbar-nav>.active>a {
	border-bottom:2px solid #e84e0e;
	padding-bottom: 4px;
	background-color: rgb(241, 241, 241);
	background-image:none;
	box-shadow:none;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
	background-color: rgb(241, 241, 241);
}



/* ======= Buttons ======= */


button.btn.btn-white {
	background-color:rgb(241, 241, 241);
	border-radius:0;
	background-image:none;
	text-shadow:none;
	color:#333333;
	font-size:16px;
	margin-bottom: 10px;
	height: 46px;
    border:2px solid #333333;
    text-decoration:none;
}

button.btn.btn-white2 {
	background-color:rgba(241, 241, 241, 0.7);
	border-radius:0;
	background-image:none;
	text-shadow:none;
	color:#333333;
	font-size:16px;
	margin-bottom: 10px;
	height: 46px;
    border:2px solid #333333;
    text-decoration:none;
}

button.btn.btn-white:hover, button.btn.btn-white2:hover {
	background-color:rgb(242, 141, 131);
	color:rgb(51,51,51);
}

button.btn.btn-grey, button.btn.btn-grey2 {
	background-color:rgb(51,51,51);
	border-radius:0;
	background-image:none;
	text-shadow:none;
	color:#f1f1f1;
	font-size:18px;
	margin-bottom: 10px;
	margin-top: 25px;
	height: 55px;
	width:100%;
	text-align:left;
    padding-left: 15px;
    border:2px solid #f1f1f1;
    text-decoration:none;
}


button.btn.btn-grey:hover {
	background-color:rgb(241,241,241);
	color:rgb(51,51,51);
}

button.btn.btn-grey2:hover {
	background-color:rgb(242, 141, 131);
	color: #f1f1f1;
}


button.btn.btn-transparant {
	background-color:transparent;
	border-radius:0;
	background-image:none;
	text-shadow:none;
	color:#333333;
	font-size:16px;
	margin-bottom: 10px;
	height: 46px;
    font-weight: 900;
    border:2px solid #333333;
    text-decoration:none;
}

button.btn.btn-transparant:hover {
	background-color:rgb(51, 51, 51);
	color:rgb(241,241,241);
}

button.btn.btn-white:focus, button.btn.btn-pink:focus {
	outline: 0 -webkit-focus-ring-color;
	box-shadow: none;
}

button.btn.btn-pink, button.btn.btn-pink2 {
	background-color:rgb(242, 141, 131);
	border-radius:0;
	background-image:none;
	text-shadow:none;
	color:#333333;
	font-size:18px;
	margin-bottom: 10px;
	margin-top: 25px;
	height: 55px;
    font-weight: 900;
    width:100%;
    text-align:left;
    padding-left: 75px;
}

button.btn.btn-pink2:hover {
	background-color:rgb(241, 241, 241);
	border:2px solid rgb(51,51,51);
}

button.btn.btn-pink:hover {
	background-color:rgb(51, 51, 51);
	color:#fff;
	cursor:pointer;
}


/* ======= Suggesties ======= */

.suggesties {
    margin: 20px 0;
}

.suggesties div.middle {
  	transition: .5s ease;
  	opacity: 0;
	display: block;
	height: 100%;
background: -webkit-linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 35%, rgba(255,255,255,0.2) 35%,rgba(255,255,255,0.2) 90%, rgba(51,51,51,1) 90%, rgba(51,51,51,1) 99%);
background: -o-linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 35%, rgba(255,255,255,0.2) 35%,rgba(255,255,255,0.2) 90%, rgba(51,51,51,1) 90%, rgba(51,51,51,1) 99%);
background: linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 35%, rgba(255,255,255,0.2) 35%,rgba(255,255,255,0.2) 90%, rgba(51,51,51,1) 90%, rgba(51,51,51,1) 99%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.suggesties .middle div.text-center h5 {
	text-align:left;
}

.suggesties p {
	color:rgb(241, 241, 241);
	text-align:left;
	margin-top: -70px;
}



.middle div.text-center a:hover {
	text-decoration:none;
	border-top:none;
}

.suggesties:hover .suggesties-image,
.suggesties.hover .suggesties-image {
  	opacity: 0.2;
}

.suggesties:hover .middle,
.suggesties.hover .middle {
  	opacity: 1;
}


/* ======= Recepten ======= */

.recepten div.middle {
  	transition: .5s ease;
  	opacity: 0;
	display: block;
	height: 100%;
	margin-top:-1px;
background: -webkit-linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 40%, rgba(255,255,255,0.8) 40%, rgba(5255,255,255,0.8) 99%);
background: -o-linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 40%, rgba(255,255,255,0.8) 40%, rgba(255,255,255,0.8) 99%);
background: linear-gradient(rgba(51,51,51,1) 0%, rgba(51,51,51,1) 40%, rgba(255,255,255,0.8) 40%, rgba(255,255,255,0.8) 99%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.recepten .middle div.text-center h5 {
	margin-top:24px;
	text-align:left;
}



.middle div.text-center a:hover {
	text-decoration:none;
}

.recepten:hover .recepten-image,
.recepten.hover .recepten-image {
  	opacity: 0.2;
}

.recepten:hover .middle,
.recepten.hover .middle {
  	opacity: 1;
}

/* ======= Receptendetail ======= */

.ingredienten li {
	list-style-type: none;
	margin-left:-20px;
	line-height:1.4;
}

.werkwijze p {
	font-size: 13px;
	line-height:1.3;
}

/* ======= Lekker van bij ons ======= */

.visvanhetjaar a:hover {
	color:rgb(242, 141, 131);
}


/* ======= FAQ ======= */

.panel-group .panel, .panel-heading {
	border-radius:0px;
	border:0px;
}

.panel-body {
	border-bottom:5px solid rgb(242, 141, 131);
}

.panel-default>.panel-heading {
	background-color:rgb(51, 51, 51);
	background-image:none;
}

.panel-default>.panel-heading:hover {
	background-color:rgb(242, 141, 131)!important;
}

.panel-body p {
	font-size:13px;
}

/* ======= Contactform ======= */


input.form-control, textarea.form-control {
	border-radius:0;
	border: 2px solid #ffffff;
    background-color: #333;
}

.form-control:focus {
	border-color: #F28D83!important;
	box-shadow: none;
}



/* ======= Footer ======= */

footer li {
	list-style-type:none;
	padding-left:30px;
	min-height:20px;
}

footer li>a:hover { color:rgb(242, 141, 131); }

.footer-copyright a:hover { color:rgb(242, 141, 131); }

footer h5 {
	padding-left: 25px;
}

footer#footer-light li:hover,
footer#footer-dark li:hover {
	content: "";
	width: auto;
	height:20px;
	display:block;
	background-image: url('../img/visje.png');
	background-repeat: no-repeat;
	background-position:0px;
}




/* ======= Responsive ======= */

@media only screen and (max-width:768px) {


	button.btn.btn-pink, button.btn.btn-pink2 {
		padding-left:10px;
	}

	section div.recepten {
		margin-top:20px;
	}

	footer h5 {
		padding-left: 0;
	}
	footer li {
		padding-left:10px;
	}

	footer#footer-light li:hover,
	footer#footer-dark li:hover {
		background-image: none;
	}
}

@media (max-width: 992px) {



    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
        border:none;
    }
	
	.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
		background-color:transparent;
	}

	.navbar-default .navbar-toggle .icon-bar {
		background-color:rgb(51, 51, 51);
	}

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .collapse.in{
        display:block !important;
    }
}

form#ccms_form_contactform label {
	display:none;
}

form#ccms_form_contactform input, form#ccms_form_contactform textarea {
	border: 2px solid #333333;
    background-color: rgb(241,241,241);
}

form#ccms_form_contactform button.btn-pink {
	padding-left: 0;
    text-align: center;
    height: 46px;
    font-size: 16px;
    color: #fff;
    font-weight: normal;
    margin: 0 auto;
    display: block;
    max-width: 230px;
}

form#ccms_form_contactformdark label {
	display:none;
}

form#ccms_form_contactformdark input, form#ccms_form_contactformdark textarea {
	color:#FFF;
}

form#ccms_form_contactformdark button.btn-grey {
	padding-left: 0;
    text-align: center;
    height: 46px;
    font-size: 16px;
    margin: 0 auto;
    display: block;
    max-width: 230px;
}

.no-hover li:hover {
	background-image: none !important; 
}



/* HELPERS */

img.rotate-img-180{
  -webkit-transform: rotate(180deg);     /* Chrome and other webkit browsers */
  -moz-transform: rotate(180deg);        /* FF */
  -o-transform: rotate(180deg);          /* Opera */
  -ms-transform: rotate(180deg);         /* IE9 */
  transform: rotate(180deg);             /* W3C compliant browsers */
  filter: progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, DX=0, DY=0, SizingMethod='auto expand');
}