body {
	margin: 0;
	padding: 0;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	background: #FFF;
	color: #000;
}

img {
	width: 100%;
	height: auto;
	border: none;
}

.clear {
	clear: both;
}

.centered {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%); /* chrome & safari*/
	-moz-transform: translate(-50%, -50%); /* firefox */
	-o-transform: translate(-50%, -50%);
}

.overlay {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
	opacity: 1;
}

.crystal {
	background-image: url(../gfx/crystal.png);
	background-position: center center;
	background-repeat: repeat;
	opacity: 1;
}

.crystal50 {
	background-image: url(../gfx/crystal50.png);
	background-position: center center;
	background-repeat: repeat;
}

@media only screen and (min-width: 320px) {
}

@media only screen and (min-width: 480px) {
}

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

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* HEAD AREA */
/* ##################################################################### */

.headarea {
	background-color: #221d1d;
	text-transform: uppercase;
	margin: 0;
	padding: 15px 0;
}

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

.headarea .logo {
	padding: 14px 10px;
	text-align: center;
}

.logo img {
	width: auto;
	height: 100px;
}

@media only screen and (min-width: 480px) {
	.headarea {
		padding: 20px 0;
	}

	.headarea .logo {
		padding: 14px 10px;
		text-align: center;
	}
}

@media only screen and (min-width: 768px) {
	.headarea {
		padding: 20px 0;
	}

	.headarea .logo {
		padding: 14px 20px;
		text-align: left;
	}
}

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* TOP NAVIGATION */
/* ##################################################################### */

#topNavi {
	float: right;
	margin: 0;
	padding: 0 13px;
	list-style: none;
	color: #FFF;
}

#topNavi li {
	float: left;
	font-size: 0.8em;
	padding: 0 0 0 8px;
}

#topNavi li a,
#topNavi li a:visited {
	color: #FFF;
	text-decoration: none;
}

#topNavi li a:hover,
#topNavi li a:active {
	color: #FFF;
	text-decoration: none;
}

#topNavi li.active a,
#topNavi li.active a:visited,
#topNavi li.active a:hover,
#topNavi li.active a:active {
	color: #FFF;
	text-decoration: none;
}

@media only screen and (min-width: 480px) {
	.menubtn {
		display: none !important;
	}
}

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

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* SOCIALMEDIA BUTTONS */
/* ##################################################################### */

#socialmedia {
	clear: both;
	float: right;
	margin: 0;
	padding: 15px 12px 12px;
	list-style: none;
}

#socialmedia li {
	float: left;
	margin: 0;
	padding: 0 0 0 8px;
}

#socialmedia li a,
#socialmedia li a:visited,
#socialmedia li a:hover,
#socialmedia li a:active {
	display: block;
	border: none;
	text-decoration: none;
	width: 34px;
}

@media only screen and (min-width: 480px) {
	#socialmedia {
		float: none;
		text-align: center;
	}

	#socialmedia li {
		display: inline-block;
		float: none;
	}

	.phonebtn {
		display: inline-block !important;
	}
}

@media only screen and (min-width: 768px) {
	#socialmedia {
		float: right;
		text-align: left;
	}

	#socialmedia li {
		display: block;
		float: left;
	}

	.phonebtn {
		display: none !important;
	}
}

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* MAIN NAVIGATION */
/* ##################################################################### */

#mainNavi {
	display: none;
	clear: none;
	float: none;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 1.1em;
	text-align: center;
}

#mainNavi li {
	position: relative;
	margin: 10px 0;
	padding: 0;
}

#mainNavi li a,
#mainNavi li a:visited {
	position: relative;
	display: inline-block;
	padding: 3px 13px;
	color: #FFF;
	text-decoration: none;
	border: 1px solid transparent;
}

#mainNavi li a:hover,
#mainNavi li a:active {
	position: relative;
	display: inline-block;
	padding: 3px 13px;
	color: #FFF;
	text-decoration: none;
	border: 1px solid #FFF;
}

#mainNavi li.active a,
#mainNavi li.active a:visited,
#mainNavi li.active a:hover,
#mainNavi li.active a:active {
	position: relative;
	display: inline-block;
	padding: 3px 13px;
	color: #FFF;
	text-decoration: none;
	border: 1px solid #FFF;
}

@media only screen and (min-width: 480px) {
	#mainNavi {
		display: block !important;
		font-size: 0.9em;
	}

	#mainNavi li {
		display: inline-block;
		padding: 0 0 0 6px;
	}

	#mainNavi li a,
	#mainNavi li a:visited,
	#mainNavi li a:hover,
	#mainNavi li a:active {
		padding: 3px 7px;
	}
}

@media only screen and (min-width: 768px) {
	#mainNavi {
		float: right;
		font-size: 1.1em;
	}

	#mainNavi li {
		float: left;
		padding: 0 0 0 5px;
	}

	#mainNavi li a,
	#mainNavi li a:visited,
	#mainNavi li a:hover,
	#mainNavi li a:active {
		padding: 3px 13px;
	}
}

@media only screen and (min-width: 992px) {
	#mainNavi {
		float: right;
		font-size: 1.1em;
		margin: 0;
		padding: 0;
	}

	#mainNavi li {
		float: left;
		margin: 0;
		padding: 0 0 0 5px;
	}

	#mainNavi li a,
	#mainNavi li a:visited,
	#mainNavi li a:hover,
	#mainNavi li a:active {
		padding: 3px 13px;
	}
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* SLIDES NAVIGATION */
/* ##################################################################### */

.sliderarea {
	position: relative;
	border-bottom: 5px solid #FFF;
}

.slides-navigation a {
	position: absolute;
	display: block;
	cursor: pointer;
}

.slides-navigation a img {
	width: 100%;
	height: auto;
}

.slides-navigation a.prev {
	display: block;
	width: 30px;
	height: 30px;
	left: 15px;
	top: 50%;
	transform: translateY(-50%);
}

.slides-navigation a.next {
	display: block;
	width: 30px;
	height: 30px;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
}

@media only screen and (min-width: 480px) {
	.slides-navigation a.prev {
		width: 40px;
		height: 40px;
		left: 15px;
	}

	.slides-navigation a.next {
		width: 40px;
		height: 40px;
		right: 15px;
	}
}

@media only screen and (min-width: 768px) {
	.slides-navigation a.prev {
		width: 50px;
		height: 50px;
		left: 20px;
	}

	.slides-navigation a.next {
		width: 50px;
		height: 50px;
		right: 20px;
	}
}

@media only screen and (min-width: 992px) {
	.slides-navigation a.prev {
		width: 60px;
		height: 60px;
		left: 25px;
	}

	.slides-navigation a.next {
		width: 60px;
		height: 60px;
		right: 25px;
	}
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* MAIN NAVIGATION */
/* ##################################################################### */

.bigblock {
	height: 260px;
	overflow: hidden;
	border-bottom: 5px solid #FFF;
}

.bigblock:last-child {
	border-bottom: none;
}

.blockarea {
	border-bottom: 5px solid #FFF;
}

.bigblock .overlay {
	width: 102%;
	height: 102%;
	z-index: 1;
}

.bigblock img {
	width: 102%;
	height: auto;
	z-index: 0;
}

.bigblock .text {
	border: 2px solid #FFF;
	padding: 10px 20px;
	z-index: 3;
}

.bigblock a,
.bigblock a:visited,
.bigblock a:hover,
.bigblock a:active {
	color: #FFF;
	text-transform: uppercase;
	font-size: 1.4em;
	line-height: 1.1em;
	text-align: center;
}

.bigblock .crystal {
	transition: opacity .4s ease-in-out;
	-moz-transition: opacity .4s ease-in-out;
	-webkit-transition: opacity .4s ease-in-out;
}

.bigblock a:hover .crystal {
	opacity: .4;
	transition: opacity .4s ease-in-out;
	-moz-transition: opacity .4s ease-in-out;
	-webkit-transition: opacity .4s ease-in-out;
}

@media only screen and (min-width: 480px) {
	.bigblock a, .bigblock a:visited, .bigblock a:hover, .bigblock a:active {
		font-size: 2.0em;
		line-height: 1.1em;
	}
}

@media only screen and (min-width: 768px) {
	.bigblock {
		height: 200px;
		overflow: hidden;
		border: 5px solid #FFF;
		border-left: none;
		border-bottom: none;
		border-top: none;
	}

	.bigblock:nth-of-type(3){
		border-right: none;
	}

	.bigblock a, .bigblock a:visited, .bigblock a:hover, .bigblock a:active {
		font-size: 1.2em;
		line-height: 1.1em;
	}
}

@media only screen and (min-width: 992px) {
	.bigblock {
		height: 250px;
	}

	.bigblock a, .bigblock a:visited, .bigblock a:hover, .bigblock a:active {
		font-size: 1.6em;
		line-height: 1.1em;
	}
}

@media only screen and (min-width: 1200px) {
	.bigblock {
		height: 320px;
	}

	.bigblock a, .bigblock a:visited, .bigblock a:hover, .bigblock a:active {
		font-size: 2.0em;
		line-height: 1.1em;
	}
}


/* ##################################################################### */
/* ##################################################################### */
/* CONTENT AREA */
/* ##################################################################### */

.contentarea {
	background-color: #363636;
	color: #FFF;
	padding-top: 30px;
	padding-bottom: 30px;
	/*border-top: 5px solid #FFF;*/
	border-bottom: 5px solid #FFF;
}

.contentarea a:link,
.contentarea a:visited {
	color: #E30513;
	text-decoration: underline;
}

.contentarea a:hover,
.contentarea a:active {
	color: #FFF;
	text-decoration: none;
}

.contentarea h1 {
	margin: 0;
	padding: 0 0 20px;
	font-size: 2.0em;
	font-weight: 600;
}

.contentarea h2 {
	margin: 0;
	padding: 0 0 20px;
	text-transform: uppercase;
	font-size: 1.4em;
	font-weight: 300;
}

.contentarea p,
.contentarea ul,
.contentarea ol {
	font-size: 1.1em;
	font-weight: 300;
}

.textblock {
	padding-bottom: 30px;
}

.contentarea .avatar {
	border: 3px solid #FFF;
}

.avatarblock {
	padding: 0 20px;
}

.avatarblock h3 {
	margin: 0;
	padding: 15px 0 0px;
	font-size: 1.3em;
	font-weight: 300;
}

.avatarblock p {
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	font-weight: 300;
	font-style: italic;
}

@media only screen and (min-width: 480px) {
	.contentarea h1 {
		font-size: 3.3em;
	}

	.contentarea h2 {
		font-size: 2.0em;
	}

	.contentarea p,
	.contentarea ul,
	.contentarea ol {
		font-size: 1.2em;
	}

	.avatarblock h3 {
		font-size: 1.6em;
	}
}

@media only screen and (min-width: 768px) {
	.contentarea {

	}

	.contentarea .avatar {
		border: 5px solid #FFF;
	}

	.avatarblock {
		padding: 0 30px;
	}
}

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

/* ##################################################################### */
/* ##################################################################### */
/* GOOGLE MAPS */
/* ##################################################################### */
.googlemaps {
	margin: 0;
	padding: 0;
	border-bottom: 5px solid #FFF;
}

.maps {
	height: 280px;
}

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

.maps h3 {
	margin: 0;
	padding: 0 0 15px;
	line-height: 0.9em;
}

@media only screen and (min-width: 480px) {
	.maps {
		height: 320px;
	}
}

@media only screen and (min-width: 768px) {
	.maps {
		height: 380px;
	}
}

@media only screen and (min-width: 992px) {
	.maps {
		height: 420px;
	}
}

@media only screen and (min-width: 1200px) {
	.maps {
		height: 480px;
	}
}

/* ##################################################################### */
/* ##################################################################### */
/* FORMULAR */
/* ##################################################################### */

.formblock {
}

.formblock label {
	display: none;
}

.formblock .btn {
	text-transform: uppercase;
	width: 100%;
}

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

@media only screen and (min-width: 992px) {
	.text-right {
		text-align: right;
	}
}

/* ##################################################################### */
/* ##################################################################### */
/* IMAGE GALLERY */
/* ##################################################################### */

.imgGallery {
	margin: 0;
	padding: 0 0 60px;
}

.galimg {
	margin: 0;
	padding: 5px;
}

.galimg img {
	width: 100%;
	border: 2px solid #FFF;
}

/* ##################################################################### */
/* ##################################################################### */
/* FOOTER */
/* ##################################################################### */

.footer {
	background: url(../gfx/crystal.png) center center repeat;
	text-align: center;
	padding-top: 0;
	padding-bottom: 0;
	margin: 0;
}

.footer a:link,
.footer a:visited {
	color: #E30513;
	text-decoration: underline;
}

.footer a:hover,
.footer a:active {
	color: #000;
	text-decoration: none;
}

.footer .row,
.footer .container {
	padding-top: 0;
	padding-bottom: 0;
}

.footericons {
	clear: both;
	float: none;
	margin: 0;
	padding: 15px 12px 12px;
	list-style: none;
}

.footericons li {
	float: none;
	display: inline-block;
	margin: 0;
	padding: 0 0 0 8px;
}

.footericons li a,
.footericons li a:visited,
.footericons li a:hover,
.footericons li a:active {
	display: block;
	border: none;
	text-decoration: none;
	width: 34px;
}

@media only screen and (min-width: 480px) {
	.footericons {
		float: none;
		text-align: center;
	}

	.footericons li {
		display: inline-block;
		float: none;
	}

	.phonebtn {
		display: inline-block !important;
	}
}

@media only screen and (min-width: 768px) {
	.footer {
		text-align: left;
	}

	.footericons {
		float: right;
		text-align: left;
	}

	.footericons li {
		display: block;
		float: left;
	}

	.phonebtn {
		display: none !important;
	}

	address {
		padding: 12px 0;
		margin: 0;
	}

	address p {
		margin: 0;
		padding: 0;
	}
}

@media only screen and (min-width: 992px) {
}

@media only screen and (min-width: 1200px) {
}

#yform-formular-datenschutz label{
	display: block;
}


/* ##################################################################### */
/* ##################################################################### */
/* MAIN NAVIGATION */
/* ##################################################################### */


/* ##################################################################### */
/* ##################################################################### */
/* MAIN NAVIGATION */
/* ##################################################################### */
