@import url(https://fonts.googleapis.com/css?family=Lato:400,700italic,700,900);
/* ### general ### */
* { margin: 0px; padding: 0px; }
html, body { height: 100%; font-family: 'Lato', sans-serif; font-size: 12px; color: #000; }
input, select, textarea { font-family: 'Lato', sans-serif; font-size: 12px; color: #000; }
body { background: #fff; overflow-x: hidden; }
img { border: 0px; display: block; }
ul, li { list-style: none; }
:focus { outline: none; }

/* ### global classes ### */
.clear { clear: both; height: 0px; }
.center { margin: 0 auto; max-width: 960px; position: relative; }

/* ### wrapper ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%;}

/* ### main container ### */
#mainCntr { width: 100%; }
	
	/* ### header container ### */
	#headerCntr { position: relative; padding-bottom: 66px; background: url(../images/header_bg.jpg) no-repeat center center; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	}
	

		/* ### header box ### */
		.headerBox { position: relative; margin: 0 auto; max-width: 960px; padding: 40px 0 18px 0; overflow: hidden; }
		.headerBox .logo { float: left; }
		
		/* ### social box ### */
		.socialBox { float: right; overflow: hidden; margin-top: 18px; }
		.socialBox ul { list-style: none; overflow: hidden; }
		.socialBox li { float: left; margin-left: 10px; }
		.socialBox li img { display: inline; }
		
		/* ### menu box ### */
		.menuBox { width: 100%; background: #e6ae1d; height: 49px; margin-top: 24px; }
		.menuBox ul { list-style: none; text-align: center; width: 100%; }
		.menuBox li { display: inline-block; font-size: 15px; line-height: 49px; text-transform: uppercase; }
		.menuBox li a { color: #fff; text-decoration: none; display: inline-block; padding: 0 21px; }
		.menuBox li a img { display: inline; vertical-align: middle; }
		.menuBox li a:hover { background: #f1bf3c ; }
		.mobileMenu { display: none; }
	
		/* ### lovea container ### */
		#loveaCntr { overflow: hidden; margin: 0 auto; max-width: 960px; }
		#loveaCntr .col { float: left; width: 48%; cursor: pointer; }
		#loveaCntr .col.last { float: right; }
		#loveaCntr .photo { width: 100%; position: relative;  }
		
		#loveaCntr .photo img.big { width: 100%; }
		#loveaCntr .photo .bot { position: absolute; bottom: -15px; left: 0; width: 100%; text-align: center; }
		#loveaCntr .photo .bot a { display: inline-block; text-decoration: none; padding: 0 25px; line-height: 53px; color: #fff; font-size: 16px; font-weight: bold; font-style: italic; background: #e6ae1d; 
		
		  -webkite-border-radius: 8px;
		  -moz-border-radius: 8px;
		  border-radius: 8px;
		  -webkite-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
		  -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
		  box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
		 }
		#loveaCntr .photo .bot a img { display: inline; vertical-align: middle; margin-left: 8px; }
		#loveaCntr .photo .bot a:hover { background: #f1bf3c; }
		#loveaCntr .text { width: 100%; background: #d0712d; padding: 36px 0 28px 0; }
		#loveaCntr .text p { color: #fff; font-size: 19px; font-weight: bold; font-style: italic; text-align: center; }
		
		/* ### banner box ### */
		.bannerBox { max-width: 960px; margin: 0 auto; }
		.bannerBox img { width: 100%; }
	
	/* ### protection container ### */
	#protectionCntr { width: 100%; overflow: hidden; padding: 60px 0; }
	#protectionCntr .title { width: 100%; background: url(../images/border_bg.png) repeat-x 0 12px; margin-bottom: 40px; text-align: center; }
	#protectionCntr h3 { color: #d0712d; font-size: 24px; font-style: italic; padding: 0 11px; background: #fff; display: inline-block; }
	#protectionCntr .content { overflow: hidden; }
	#protectionCntr .col1 { float: left; width: 32%; }
	#protectionCntr .col1 p { color: #2f2f2f; font-size: 16px; line-height: 28px; text-align: right; margin-bottom: 28px; }
	#protectionCntr .col1 p strong { font-weight: 900; }
	#protectionCntr .col2 { float: left; width: 34%; text-align: center; }
	#protectionCntr .col2 img { max-width: 100%; display: inline; }
	#protectionCntr .col3 { float: left; width: 34%; }
	#protectionCntr .col3 p { color: #2f2f2f; font-size: 16px; line-height: 28px; margin-bottom: 28px; }
	#protectionCntr .col3 p strong { font-weight: 900; }
	#protectionCntr .col4 { color: #2f2f2f; font-size: 16px; float: left; width: 100%; }
	#protectionCntr .col4 p { line-height: 26px; margin-bottom: 14px; }
	#protectionCntr .col4 p strong { font-weight: 900; }
	#protectionCntr a { color:#d0712d }
	#protectionCntr a:hover { text-decoration:none; }
	
	/* ### find container ### */
	#findCntr { width: 100%; background: url(../images/bg1.jpg) repeat; padding: 60px 0 100px 0; }
	#findCntr .title { width: 100%; background: url(../images/border_bg2.png) repeat-x 0 12px; margin-bottom: 60px; text-align: center; }
	#findCntr h3 { color: #d0712d; font-size: 24px; font-style: italic; padding: 0 11px; background: url(../images/bg1.jpg) repeat; display: inline-block; }
	#findCntr .col { float: left; width: 48%; text-align: center; }
	#findCntr .col.last { float: right; }
	#findCntr .col img.shadow { width: 100%; }
	#findCntr .content { width: 100%; padding: 24px 34px 22px 24px; position: relative; background: url(../images/bg2.png) repeat; text-align: left;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	#findCntr .content img.girl { position: absolute; bottom: -56px; right: 10px; }
	#findCntr .content p { color: #2f2f2f; font-size: 16px; line-height: 28px; float: left; width: 85%; margin-top: -10px; padding-bottom: 50px; }
	#findCntr .col.last .content p { width: 80%; }
	#findCntr .content p strong { font-weight: 900; }
	#findCntr .content .left { float: left; width: 15%; }
	#findCntr .content .left img { max-width: 100%; }
	#findCntr .content p span { display: block; margin-top: 17px; font-weight: 900; font-style: italic; }
	
	/* ### buttons container ### */
	#buttonsCntr { max-width: 960px; margin: 0 auto; padding: 50px 0; }
	#buttonsCntr ul { list-style: none; text-align: center; }
	#buttonsCntr li { display: inline-block; margin: 0 8px; font-size: 16px; font-weight: bold; font-style: italic; }
	#buttonsCntr a { display: inline-block; padding: 0 23px; line-height: 53px; color: #fff; text-decoration: none; background: #d0712d; 
	  -webkite-border-radius: 8px;
	  -moz-border-radius: 8px;
	  border-radius: 8px;
	}
	#buttonsCntr a img { display: inline; vertical-align: middle; margin-left: 8px; }
	#buttonsCntr a:hover { background: #df8748; }
	
	/* ### product container ### */
	#productCntr { width: 100%; background: url(../images/bg1.jpg) repeat; padding: 60px 0 20px 0; }
	#productCntr .title { width: 100%; background: url(../images/border_bg2.png) repeat-x 0 12px; margin-bottom: 26px; text-align: center; }
	#productCntr h2 { color: #d0712d; font-size: 24px; font-style: italic; padding: 0 11px; background: url(../images/bg1.jpg) repeat; display: inline-block; }
	
		/* ### spray box ### */
		.sprayBox { background: #fff; padding: 8px 24px 12px 0px; overflow: hidden; margin-bottom: 20px;
		  -webkite-box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
		  -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
		  box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
		  -webkit-box-sizing: border-box;
		  -moz-box-sizing: border-box;
		  box-sizing: border-box;
		}
		.sprayBox .photo { float: left; width: 35%; }
		.sprayBox .photo img { max-width: 100%; display:block; margin:auto; }
		.sprayBox .text { float: right; width: 65%; }
		.sprayBox .text h3 { color: #e6ae1d; font-size: 24px; font-style: italic; margin-bottom: 10px; }
		.sprayBox .text p { color: #333; font-size: 14px; line-height: 21px; margin-bottom: 66px; } 
		.sprayBox .text .btns { float: right; overflow: hidden; cursor:pointer; }
		.sprayBox .text a { display: inline-block; float: left; padding: 0 25px; color: #fff; text-decoration: none; font-size: 16px; font-weight: bold; line-height: 53px; background: #e8d0be; margin-left: 16px; 
		  -webkite-border-radius: 8px;
		  -moz-border-radius: 8px;
		  border-radius: 8px;
		}
		.sprayBox .text a img { display: inline; vertical-align: middle; margin-left: 14px; }
		.sprayBox .text a:hover { background: #f5d1b7; }
	
	/* ### footer container ### */
	#footerCntr { overflow: hidden; width: 100%; background: #e6ae1d; padding: 20px 0; }
	#footerCntr a { color: #f1c657; text-decoration: none; }
	#footerCntr a:hover { text-decoration: underline; }
	#footerCntr ul { width: 100%; text-align: center; list-style: none; }
	#footerCntr li { display: inline-block; padding: 0 9px; background: url(../images/footer_sep.png) no-repeat right 2px; font-weight: bold; text-transform: uppercase; }
	#footerCntr li:last-child { background: none; padding-right: 0; }
	#footerCntr li:first-child { padding-left: 0; } 
	#footerCntr li a { color: #fff; text-decoration: none; }
	#footerCntr li a:hover { text-decoration: underline; }
	#footerCntr p { float: right; margin-top: -15px; color: #efca6b; font-weight: bold; text-transform: uppercase; }


@media only screen and (max-width: 959px) {
	
	#headerCntr { width: 100%; padding-left: 8px; padding-right: 8px; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
	.menuBox li a { padding: 0 12px; }
	.menuBox li { font-size: 13px; }
	
	#protectionCntr { padding-left: 8px; padding-right: 8px; width: 100%; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
	#protectionCntr h3 { font-size: 22px; }
	#protectionCntr .col1 p { font-size: 15px; }
	#protectionCntr .col3 p { font-size: 15px; }
	#protectionCntr .col2 img { width: 230px; }
	
	#findCntr { padding-left: 8px; padding-right: 8px; width: 100%; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	#findCntr .content { padding: 20px 15px; }
	
	#footerCntr { padding: 20px 8px; width: 100%; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
	#findCntr h3 { font-size: 22px; }
	
	#productCntr { padding-left: 8px; padding-right: 8px; width: 100%; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
}

@media only screen and (max-width: 767px) {
	
	.menuBox { display: none; }
	.mobileMenu { display: block; position: absolute; top: 0; left: 0; }
	
	.headerBox { padding: 48px 0 28px 0; }
	
	#loveaCntr .text p { font-size: 14px; }
	#loveaCntr .photo .bot a { font-size: 14px; padding: 0 20px; }
	
	#protectionCntr .col1 { float: none; width: 100%; }
	#protectionCntr .col2 { float: none; width: 100%; }
	#protectionCntr .col3 { float: none; width: 100%; }
	
	#findCntr .col { width: 100%; float: none; }
	#findCntr .col.last { margin-top: 60px; }
	
	#footerCntr p { float: none; width: 100%; text-align: center; margin-top: 12px; }
	
	.sprayBox { padding-right: 0; }
	.sprayBox .photo { text-align: center; width: 100%; text-align: center; }
	.sprayBox .photo img { display: inline-block; margin-bottom: 20px; margin-top: 15px; }
	.sprayBox .text { float: none; width: 100%; padding: 0 20px 10px 15px; 
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
	
	.sprayBox .text a { padding: 0 20px; }
	
	#productCntr h2 { font-size: 20px; }
	
	#protectionCntr .col1 p { text-align: left; }

}

@media only screen and (max-width: 479px) {
	
	.headerBox .logo img { width: 130px; }
	
	#loveaCntr .col { float: none; width: 100%; }
	
	#protectionCntr h3 { font-size: 18px; }
	
	#findCntr .content .left img { width: 34px; }
	
	#buttonsCntr li { margin-bottom: 20px; }
	#buttonsCntr li:last-child { margin-bottom: 0; }
	
	#footerCntr li { font-size: 11px; padding: 0 6px; }
	#footerCntr p { font-size: 11px; }
	
	.sprayBox .text a { margin-bottom: 20px; }
	
	.sprayBox .text h3 { font-size: 15px; }
	
	#productCntr h2 { font-size: 18px; }
	#productCntr .title { background-position: 0 7px; }
	
	
}


/* inline styling */

input, textarea { padding:5px 5px; width:100%; border:solid 1px #CCC; font-size:15px; -webkite-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px; }



button { 

	display: inline-block; margin: 8px 0; font-size: 16px; font-weight: bold; font-style: italic; padding: 0 23px; line-height: 53px; color: #fff; background: #d0712d; 
	-webkite-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border:none;
	width:200px;
}

.cms-error {
	padding: 8px;
	margin: 8px;
	border: 1px solid #f00;
	background: #ffcccc;
	color: #f00;
	font-weight: bold;
	width:80%;
	-webkite-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.cms-warning {
	padding: 8px;
	margin: 8px;
	border: 1px solid #ffd800;
	background: #ffef87;
	color: #d58c00;
	width:80%;
	-webkite-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.cms-success {
	padding: 8px;
	margin: 8px;
	border: 1px solid #2f9000;
	background: #c1ffab;
	color: #2f9000;
	font-weight: bold;
	width:80%;
	-webkite-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
.cms-error li, .cms-warning li {
	font-weight: normal;
} 


.ingredienten {
	display:none;
}