/*
Description: CSS for The Royal Opticians
Author: Robin Kuhlmann
Author URI: http://www.thehood.de
Tags: Brille, The Royal Opticians, Family, Glasses

(c) 2016 by Robin Kuhlmann
*/

body {
  font-size: 1.3em;
	background: url(../img/paper_bg2.jpg) repeat top center fixed;
	font-family: 'Montserrat', sans-serif;
}

.headerImgContainer {

	width: 100%;
	top: 0;
	overflow: hidden;
	text-align: center;
}

.headerImg {
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	max-width: 100%;
	z-index: -10;

}

.logoDiv {
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	position: absolute;
	width: 100%;
	height: auto;
	z-index: 10;
}

.logo {
	padding-top: 5%;
	width: 50%;
	height: auto;
}

.hideMe {
}

.info, .info2 {
	color: #dcd3c1;
	padding: 0px 25px 25px 25px;
	line-height: normal;
}


.impressLink {
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor: pointer;
	font-weight: bold;
}

.impressLink:hover {
	text-decoration: underline;
}

.impressum {
	overflow: hidden;
	height: auto;
}

@media (min-width: 1200px) {
	.info {
		color: #dcd3c1;
		padding: 40px 80px 10px 0px;
	}

	.info2 {
		color: #dcd3c1;
		padding: 134px 80px 10px 0px;
	}

}

h4 {
		font-family: 'Montserrat', sans-serif;
		font-weight: bold;
}


.arrowDownDiv {
	width: 100%;
	position: fixed;
	bottom: 10px;
	height:10%;
	text-align: center;
	pointer-events: none;
}

.firstRow {
	top: 500px;
}

.gallery {

	background: rgba(88,71,58,0.7);
  background: -webkit-linear-gradient(left,rgba(88,71,58,0.7),rgba(39,25,13,0.9));
  background: -o-linear-gradient(right, rgba(88,71,58,0.7),rgba(39,25,13,0.9));
  background: -moz-linear-gradient(right, rgba(88,71,58,0.7),rgba(39,25,13,0.9));
  background: linear-gradient(to right, rgba(88,71,58,0.7),rgba(39,25,13,0.9));
	margin-top: 50px;
	border-radius: 15px;
}

.sliderDiv {
	padding: 30px 30px 30px 30px;
	height: auto;
	border-radius: 15px;
	overflow: hidden;
}

.image_container img {
	width: 100%;
	height: auto;
	border-radius: 15px;
	background-color:rgba(0, 0, 0, 0.2);
	border-style: solid;
	border-color: rgba(39,25,13,0.5);
	border-width: 1px;
}

.sliderCaption {
	background-color:rgba(39,25,13,0.7);
	position: absolute;
	bottom: 0px;
	width: 100%;
	height: auto;
	overflow: hidden;
}

.captionText {
	padding: 20px 20px 0px 20px;
	font-size: 30px;
}

#slider1_container, #slider2_container, #slider3_container, #slider4_container, #slider5_container, #slider6_container, #slider8_container, #slider9_container, #slider10_container, #slider11_container {
	position: relative;
	width: 928px;
	height: 619px;
	border-radius: 15px;
	overflow: hidden;
	background-color:rgba(0, 0, 0, 0.2);
	border-style: solid;
	border-color: rgba(39,25,13,0.5);
	border-width: 1px;
}

.jssorb21 {
	position: absolute;
}

.jssorb21 div, .jssorb21 div:hover, .jssorb21 .av {
	position: absolute;
	/* size of bullet elment */
	width: 19px;
	height: 19px;
	text-align: center;
	line-height: 19px;
	color: white;
	font-size: 12px;
	background: url(../img/b21.png) no-repeat;
	overflow: hidden;
	cursor: pointer;
}

.jssorb21 div { background-position: -5px -5px; }
.jssorb21 div:hover, .jssorb21 .av:hover { background-position: -35px -5px; }
.jssorb21 .av { background-position: -65px -5px; }
.jssorb21 .dn, .jssorb21 .dn:hover { background-position: -95px -5px; }


.jssora12l, .jssora12r {
	display: block;
	position: absolute;
	/* size of arrow element */
	width: 55px;
	height: 55px;
	cursor: pointer;
	background: url(../img/a21.png) no-repeat;
	overflow: hidden;
	margin: 10px;

}
.jssora12l { background-position: -8px -37px; }
.jssora12r { background-position: -79px -37px; }
.jssora12l:hover { background-position: -10px -37px; }
.jssora12r:hover { background-position: -78px -37px; }
.jssora12l.jssora12ldn { background-position: -256px -37px; }
.jssora12r.jssora12rdn { background-position: -315px -37px; }


.footer {
	padding: 10px;
	text-align: center;
	color: rgba(39,25,13,0.9);
	font-weight: 500;
}

.footer a {
	color: black;
}

.datenschutz {
	margin: auto;
	max-width: 900px;
}

.datenschutz h1 {
	font-size: 1.5em;
	font-weight: bold;
}

.datenschutz h2 {
	font-size: 1.2em;
	font-weight: bold;
}

.datenschutz h3 {
	font-size: 1em;
	font-weight: bold;
}