@import url(http://weloveiconfonts.com/api/?family=fontawesome);
[class*="fontawesome-"]:before{font-family:'FontAwesome',sans-serif}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;	
	font-style:normal;
	vertical-align: baseline;
}
html, body{
	height:100%;
}
body{
	font-family:"Gotham SSm A", 'Open Sans', Arial, sans-serif;
	color:#494949;
	font-weight:300;
}
h1, h2, h3, a{
	color:#606062;
}
h1{
	font-weight:700;
	font-size:150.0%;
	margin:0 0 1.5em;
	line-height:120%;
}
h2{
	font-weight:700;
	margin:0 0 1em 0;
}
h3{
	font-weight:700;
  font-size: 87.5%;
	margin:0 0 0 0;
}
p{
	margin:0 0 1.5em;
	font-size:87.5%;
}
ul{
	margin:0 0 1.5em 0;
	font-size:87.5%;
}
ul li{
	margin:0 0 0 15px;
}
img{
	max-width:100%;
	height:auto;
}
*::selection {
    background:#009aa8;
    color: #FFFFFF;
}
*::-moz-selection{
	background:#009aa8;
    color: #FFFFFF;
}
/* CLear fix */
.cf:before, .cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

p + h1 {
	padding-top:1.5em;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}
.clear{
	clear:both;
}
.split{
	width:100%;
	height:14px;
	background: white url(../images/trennlinie.png) no-repeat scroll center center;
	padding:50px 0;
	overflow:hidden;
}
hr{
	width:100%;
	height:14px;
	background: white url(../images/trennlinie.png) no-repeat scroll center center;
	padding:50px 0;
	overflow:hidden;
	border:none;
	clear:both;
}
strong{
	font-weight:700;
}
.small {
	font-size:0.875em;
}
/* ------ Start Pageloader ------*/
#pageloader {
    background-color: #FFFFFF;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
}
.fa-spin {
    animation: 2s linear 0s normal none infinite spin;
}
.fa {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
}
.colored-border {
    border-color: #009aa8;
}
.loader-item {
    background: none repeat scroll 0 0 #FFFFFF;
    border-bottom: 3px solid rgba(0, 0, 0, 0) !important;
    border-left: 3px solid;
    border-radius: 200px;
    border-right: 3px solid;
    border-top: 3px solid;
    height: 40px;
    left: 50%;
    margin: -20px 0 0 -20px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 40px;
}
/* ------ End Pageloader ------ */

/* ------ Start Overlay ------*/
#overlay {
  display:block;
  position:fixed;
  z-index:99;
  width:280px;
  height:280px;
  top:50%;
  left:50%;
  margin:-140px 0 0 -140px;
  background-color:#a79e6d;
  color:#ffffff;
  box-sizing:border-box;
  padding:20px;
  text-align:center;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.65);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.65);
  box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.65);
  border-radius:50%;
  opacity:1;
  transition:opacity 0.3s;
}
#overlay.hide{
  opacity:0;
}
#overlay #overlayInner {
  width:100%;
  height:100%;
  display:table;  
}
#overlay #overlayContent {
  display:table-cell;
  vertical-align:middle;
}
#overlay h1{
  color:rgba(255,255,255,1.00);
  margin-bottom:20px;
}
#overlayContent *:last-child {
  margin-bottom: 0;
}
/* ------ Eng Overlay ------*/

/* ------ Start Grid ------*/
.col {
	display: block;
	float:left;
	margin: 0 0 0 1.6%;
}
.col.first { 
	margin-left: 0;
}

.row {
	clear: both;
	margin: 0 auto;
	*zoom: 1;
}

.row:before,
.row:after {
	content: "";
	display: table;
}

.row:after { clear: both; }
.grid_12_of_12 { width: 100%; }
.grid_11_of_12 { width: 91.46%; }
.grid_10_of_12 { width: 83%; }
.grid_9_of_12  { width: 74.54%; }
.grid_8_of_12  { width: 66.08%; }
.grid_7_of_12  { width: 57.62%; }
.grid_6_of_12  { width: 49.16%; }
.grid_5_of_12  { width: 40.7%; }
.grid_4_of_12  { width: 32.24%; }
.grid_3_of_12  { width: 23.78%; }
.grid_2_of_12  { width: 15.32%; }
.grid_1_of_12  { width: 6.86%; }
/* ------ End Grid ------ */




/* ------ Start Navigation ------ */
#navigation{
	background:#fff;
	z-index:999;
	width:100%;
	position:fixed;
	left:0; 
	transition: all 0.5s ease 0s;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.97);
	padding:15px 0;
}
#navigation .content{
	/*height:120px;*/
	overflow:hidden;
	padding:0 2%;
}
.not-visible-nav{
	top:-180px;
}
.visible-nav{
	top:0;
}
#navigation #address{
	font-size:12px;
	margin:0 0 25px 0;
	float:left;
}
#navigation ul{
	list-style:none;
	position:absolute;
	bottom:0;
	margin:0 0 0 0;
	padding:23px 0 0 0;
	clear:both;
}
#navigation ul li{
	float:left;
	padding:0;
	margin:0;
}
#navigation ul li a{
	text-decoration:none;
	color:#606062;
	padding:0 15px 0 0;
	font-size:125.0%;
	font-weight:700;
}
#navigation ul li a:hover{
	color:#a79e6d;	
}
#navigation #social{
	margin:0 0 0 0;
	float:left;
}
#navigation #language{
	float:left;
	margin:2px 20px 0 0;
}
#navigation #language a,
#navigation #language span{
	font-weight:700;
	text-decoration:none;
}
	
#logo{
	width:120px;
	/*position:absolute;
	right: 2%;
	top:0;*/float:right;
}
#logo a{
	display:block;
}
#logo img {
	height:auto;
	max-width:100%;
	display:block;
}

/* ------ End Navigation ------ */


/* ------ Sections ------ */
.section {
	width:100%;
	border-bottom:0px solid #000000;
	height:auto;
	position:relative;
}
#header .content, #navigation .content, .section .content{
	max-width:850px;
	margin:0 auto;
	position:relative;
}
.section .content{
	padding:50px 2%;
	/*border-right:1px solid #3E3E3E;
	border-left:1px solid #3E3E3E;*/
	/*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);*/
}



/* ------ Start Section Home ------ */
#home{
}
.logo-home{
	width:254px;
	height:254px;
	margin:-127px 0 0 0;
	background-image:url(../images/logo-home.png);
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	right:10%;
	top:50%;
}
.logo-home a{
	display:block;
	width:100%;
	height:100%;
}

#slides .slides-container div {
    /*background-attachment: fixed;*/
	background-repeat:no-repeat;
    background-position: center center;
	background-size: 100% auto;
}
#slides .slides-container .image1 {
	background-image:url("../images/keyvisual.jpg");
}
#slides .slides-container .image2 {
	background-image:url("../images/JANMA-GEBURT-06.jpg");
}
#slides .slides-container .image3 {
	background-image:url("../images/JANMA-SCHOOL-02.jpg");
}
#slides .slides-container .image4 {
	background-image:url("../images/JANMA-SCHOOL-17.jpg");
}
#slides .slides-container .image5 {
	background-image:url("../images/JANMA-SCHOOL-27.jpg");
}
#slides .slides-container .image6 {
	background-image:url("../images/JANMA-SCHOOL-38.jpg");
}
.slides-navigation {
    margin: 0 auto;
    position: absolute;
    top: 45%;
    width: 100%;
    z-index: 20;
}
.slides-navigation a {
    background: url("../images/slider-arrows.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    display: block;
    height: 81px;
    opacity: 1;
    position: absolute;
    transition: all 0.5s ease 0s;
    width: 36px;
}
.slides-navigation a.next {
    background-position: right center;
    right: 2%;
}
.slides-navigation a.prev {
    background-position: left center;
    left: 2%;
}

#home .content{
	position:absolute;
	top:0;
	z-index:10;
	width:100% !important;
	max-width:none;
	padding:0;
	height:100%;
}
#home .content-inner{
	margin:0 auto;
	position:relative;
	/*max-width:980px;*/
	padding:15px 0;
	height:auto;
	/*top:50%;
    transform: translateY(-50%);*/
	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8);
	display:none;
}

#home #scroll-down{
	position:absolute;
	width:100%;
	bottom:0px;
	z-index:50;	
	opacity:0.8;
}
#home #scroll-down a{
	display:block;
	width:100%;
	text-align:center;
	font-weight:400;
	font-size:36px;
	padding:20px 0;
	color:#FFFFFF;
	text-decoration:none;
}
/* ------ End Section Home ------*/




/* ------ Section start ------ */
#start .content{
	/*padding:80px 0;*/
}
.teaser-box {
	float:left; 
	width:25%;
	margin:0 0 30px 0;
}
.teaser-box-inner{
	/*background: url("../images/bg-teaser-box.png") no-repeat scroll bottom right rgba(218,218,218,0.9);*/
	background:#a79e6d;
	position:relative;
	padding:15px;
	height:280px;
	cursor:pointer;
	transition: background 0.25s ease-in-out 0s;
	color:#ffffff;
}
.teaser-box-inner:hover{
	/*background: url("../images/bg-teaser-box-hover.png") no-repeat scroll bottom right #7d614a;*/
}
.teaser-box-inner:hover *{
	color:#FFFFFF;
}
.teaser-box-inner h1, .teaser-box-inner h2{
	margin:0;
}
.teaser-box .col1{
	margin:0 6% 0 0;
}
.teaser-box .col2{
	margin:0 4% 0 2%;
}
.teaser-box .col3{
	margin:0 2% 0 4%;
}
.teaser-box .col4{
	margin:0 0 0 6%;
}
.teaser-box .link-more{
	position:absolute;
	bottom:0;
	font-weight:700;
	margin:0 0 15px 0;
}
.teaser-box .link-more a, .teaser-box h2{
	color:#ffffff;
}
/* ----- Start section about ------ */
h1#about {
	padding-top:30px;
	clear:left;
}

/* ----- End section about ------ */


/* ----- Start section facts ------ */
#facts {
	
}
/* ----- End section facts ------ */

/* ----- Start Section Sponsoren ------ */
#sponsoren {
	/*background:#009AA8;	*/
}
#sponsoren *{
	/*color:#FFFFFF;*/
}
/* ----- End Section Sponsoren ------ */



/* ----- Start Section Contact ------ */
#bestellen {
	background:#a79e6d;	
}
#bestellen p, #bestellen h1, #bestellen h2, #bestellen a, #bestellen label{
	color:#FFFFFF;
}
/* ----- End Section Contact ------ */



/* ------ Start Image Sections ------ */
#section-image1{
	background:white url(../images/section-image1.jpg) no-repeat fixed 50% 0;
	height:800px;
}
#section-image2{
	background:white url(../images/section-image2.jpg) no-repeat fixed 50% 0;
	height:680px;
}
#section-image3{
	background:white url(../images/section-image3.jpg) no-repeat fixed 50% 0;
	height:800px;
}
/* ------ End Image Sections ------ */



/* ------ Start formular ------ */
.form{
	margin:0 0 0px 0;
}
input[type=checkbox] {
	/*visibility: hidden;*/
}
.form input.textfield{
	
	/*float:left;*/
}
.form input{
	background:#FFFFFF;
	box-sizing:content-box;
	border: 0px solid #ffffff;
	/*border-radius: 4px;*/
	height: 30px;
	font-weight:300;
	font-size:14px;
	font-size:0.875rem;
	padding:5px 1%;
	margin:0 0 15px 0;
	width:98%;
	display:block;
	font-family: "Gotham SSm A",'Open Sans',Arial,sans-serif;
	/*float:left;*/
}
.form .input-XS{
	clear:left;
	width:32px;
	text-align:center;
	float:left;
}

.form textarea{
	background: none repeat scroll 0 0 #FFFFFF;
	border: 0px solid #ACACAC;
	/*border-radius: 4px;*/
	color:#494949;
	font-size:14px;
	font-size:0.875rem;
	padding:5px 1%;
	margin:0 0 15px 0;
	width:98%;
	height:150px;
	font-family:inherit;
	resize:none;
	/*box-sizing:border-box;*/
}
.form input#form-submit{
	width:23%;
	background:#ffffff;
	color:#a79e6d;
	border:none;
	font-weight:700;
	cursor:pointer;
}
.form input:focus, .form textarea:focus{
	/*box-shadow: 0 0 5px rgba(127, 99, 76, 1);*/
}
.form label {
	margin:0 0 0 10px;
	float:left;
}
.form .checkbox label{
	/*height:30px;*/
	/*display:block;*/
	/*float:left;
	width:80%;*/
	/*margin:0 0 5px 0;*/
}
.form .checkbox input{
	/*float:left;
	margin:2px 10px 5px 0;
	border:none;
	cursor:pointer;
	background:none;
	border-radius:0;
	border:1px solid white;
	width:auto;
	height:auto;*/
}
.form .checkbox br{
	clear:both;	
}
.form input.error{
	background: #606062;
	color: #ffffff;
	transition: background 0.3s;
	/*border: 3px solid #7f634c;
	
	background-image:url(../images/error.png);
	background-repeat:no-repeat;
	background-position:right center;*/
}
form label.error{
	display:none !important;
}
#success{
	margin:50px 0 0 0;
}
form p{
	margin:0 0 0.5em 28px;
}
/* .squaredFour */
.styled-checkbox {
  width: auto;
  position: relative;
  /*margin: 20px auto;*/
  color: #ffffff;
}
.styled-checkbox label {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  background: #ffffff;
  /*background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);*/
  /*-moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;*/
 /* -moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);*/
}
.styled-checkbox label:after {
  content: '';
  width: 9px;
  height: 5px;
  position: absolute;
  top: 4px;
  left: 4px;
  border: 3px solid #333;
  border-top: none;
  border-right: none;
  background: transparent;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.styled-checkbox label:hover::after {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
}
.styled-checkbox input[type=checkbox] {
  visibility: hidden;
  width:20px !important;
  height:20px;
  padding:0;
  margin:0 8px 0 0;
  float:left;
}
.styled-checkbox input[type=checkbox]:checked + label:after {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
/* end .squaredFour */


/* ------ End formular ------ */


/* Responsive Design */
/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (max-width : 680px) {
	/* Styles */
	.teaser-box{
		width:100%;
		float:none;
		margin:0 0 15px 0;
	}
	.teaser-box-inner{
		height:150px;
	}
	.teaser-box .col1 {
    	margin: 0 0 0 0;
	}
	.teaser-box .col2 {
    	margin: 0 0 0 0;
	}
	.teaser-box .col3 {
    	margin: 0 0 0 0;
	}
	.teaser-box .col4 {
    	margin: 0 0 0 0;
	}
	#address, #section-image1, #section-image2, #section-image3{
		display:none;
	}
	hr{
		padding:15px 0;
	}
	#logo{
		width:120px;
		bottom:auto;
		top:0;
	}
	#social{
		margin:0;
	}
}



/* Responsive Design */
@media only screen 
and (max-width : 768px) {
/* Styles */
	.col{
		float:none;
		margin: 0 0 0 0;
	}
	.grid_6_of_12 {
		width:100%;
	}
  .logo-home{
    width: 200px;
    height: 200px;
    right:auto;
    left:50%;
    margin:-100px 0 0 -100px;
  }
  .form input#form-submit{
    width:50%;
  }
}
@media only screen 
and (max-width : 540px) {
/* Styles */
	#logo{
    display:none;
  }
  .section .content{
    padding: 50px 15px;
  }
  #navigation,
  #navigation .content{
    padding:0;
  }
  
  #navigation ul{
    position:static;
    padding:0;
  }
  #navigation ul li{
    width:50%;
    box-sizing:border-box;
  }
  #navigation ul li a{
    padding:8px 15px;
    display: block;
    text-align:center;
  }
  #navigation ul li:nth-child(1),
  #navigation ul li:nth-child(2){
    border-bottom:1px solid rgba(167,158,109,0.6);
  }
  #navigation ul li:nth-child(1),
  #navigation ul li:nth-child(3){
    border-right:1px solid rgba(167,158,109,0.6);
  }
  .form input#form-submit{
    width:100%;
    padding: 5px 0;
  }
}
