/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #78899e;
}
html {
	overflow-y: scroll;
	}
body {
	font-size: 1.2em;
    line-height: 1.4;
	font-family: Arial, Helvetica, sans-serif;
	/*font-family: 'Roboto',Verdana, sans-serif;*/
	font-weight: 300;
	background-color: #fff;
}
ul {
	padding-left: 1.3em;	
	}
/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
width: 98%;
border: none;
background-color: #ccc;
height: 1px;
margin: 10px 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
	max-width: 100%;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/* CSS Document */

* {
margin:0;
padding:0;
}
html, body {
	height:100%;
}

a img {
border:none;
}

.clear {
    clear: both;
}
.fa {
    color: red;
    display: inline-block;
    font-family: FontAwesome;
    font-feature-settings: normal;
    font-kerning: auto;
    font-language-override: normal;
    font-size: inherit;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-synthesis: weight style;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-rendering: auto;
}.fa {
    color: red;
}
/*

* GLOBALE STRUKTUR

*/
#wrapper {
	margin: 0 auto;
	max-width: 1920px;
	width: 100%;
	background-image:url(../images/hg.jpg);
	background-repeat: repeat-y;
	}

a {
	color: #88b056;
	text-decoration:none; 
	 }

header{
	}

#logo{
	float: left;
	position:absolute;
	width: 100%;
}


/********************************************
NAVIGATION 
********************************************/
#mobile-header {
	display:none;
}
.menu_button {
	position: fixed;
    left: 15%;
    top: 2%;
	}

#navi{
	font-size: 100%;
	left: 13%;
	position: absolute;
	top: 40px;
	float: left;
}

#navi ul{

}
#navi li{
	color: #fff;
	font-weight: 400;
	display:block;
	text-align: center;
	text-transform: uppercase;
	float: left;
	list-style-position: outside;
	list-style-type: circle;
	padding: 12px 0;
}
#navi a {
	color: #fff;
	text-decoration: none;
	line-height:25px;
	font-weight:300;
	font-size: 85%;
	padding: 0 12px;
}
#navi ul li a:link a:visited{
	color: #004A99;
	text-decoration: none;
}
#navi ul li a:hover{
	color: #fff;
	text-decoration: none;
}
#navi li::before {
    content: '-';
	color: #fff;
	font-size: 90%;
	padding:0 5px 0 0;
}
#navi li:first-child::before {
    content: '';
}

#navi_service{
	left: 72%;
	list-style: outside none none;
	position: absolute;
	top: 53px;
	list-style: none;
}

#navi_service li{
	list-style: none;
	display: block;
	float: left;
	font-size: 70%;
	color: #fff;
	padding: 5px;
}
#navi_service ul li a {
	color: #fff;
	text-decoration: none;
	font-weight:400;
	text-transform:uppercase;
	padding: 0 5px;
}
#navi_service ul li a:link a:visited{
	color: #fff;
	text-decoration: none;
	font-weight:400;
}
#navi_service ul li a:hover{
	color: #88b056;
	text-decoration: none;
	font-weight:400;
}
#navi_service #nav_sub_active{
	color: #fbba00;
	text-decoration: none;
	font-size:14px;
	font-weight:400;
}
#navi_service li::before {
    content: '|';
	color: #fff;
	font-size: 90%;
	padding:0 5px 0 0;
}
#navi_service li:first-child::before {
    content: '';
}

/********************************************
NAVIGATION END
********************************************/
/********************************************
SPRACHE
********************************************/
#sprache {
    position: absolute;
	top: 2%;
	left: 60%;
}
#sprache ul{
	padding:0;
}
#sprache li{
	float:left;
	list-style-type:none;
	font-size: 70%;
}
#sprache li a{
	color: #fff;
	padding: 0 2px;
}

	
#sprache li::before {
    content: '|';
	color: #fff;
	font-size: 90%;
}
#sprache li:first-child::before {
    content: '';
}
	
/********************************************
SPRACHE END
********************************************/ 
/********************************************
MAIN
********************************************/ 
 
#bild {
width: 100%;
height: 318px;
}

#slider {
	clear:both;
	position: relative;
}
#slider .flex-caption strong{
	font-size: 250%;
	font-weight: 100;
}

#slider img {
	/*-Moz-box-shadow: #626c71 0 0 7px;
	-Webkit-box-shadow: #626c71  0 0 7px;
	box-shadow: 0 0 9px #626c71;
	behavior: url(../css/pie/PIE.htc);*/ 
	width:100%;
	height: 100%;
}
#main {
	padding:6% 5%;
	font-size: 90%;
	background-color: #cde7ff;	
	min-height: 250px;
}
.img-container {
  position:relative;
}
.homeImageLink {
   	position: absolute; 
   	top: 78.5%; 
   	left: 0;
   	text-align: center; 
   	width: 100%;
   	margin: 0;
  	padding: 10px 0;
   	pointer-events: none;
	background-color: #88b056;
   	opacity: 0.7;       /* modern browser */  
    -moz-opacity: 0.7;  /* older Mozilla browser */  
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; /* IE8 in Standard Compliant Mode */  
    filter:alpha(opacity=70); /* IE5.x -7.0 */ 

}

.homeImageLink span { 
	color: #fff;
	font-weight: 300;
	text-transform: uppercase;
}

#main_home {
	background-color: #e8edf0;
	font-size: 90%;
}
#main .ui-datepicker {
	font-size: 95%;
	padding: 0;
	font-family: 'Roboto',Verdana, sans-serif;
	font-weight: 300;
	width: 15em;
     }
#main label {
    display: block;
    width: 152px;
    float: left;
}
#main input, select, submit {
    width: 200px;
    padding: 5px;
	margin: 5px;
    border: 1px solid #bbb;
    font-size: inherit;
}
#main select {
    width: 212px;
}
#main textarea {
    width: 400px;
    padding: 5px;
	margin: 5px;
    border: 1px solid #bbb;
    font-size: inherit;
}
#content {
	float: right;
	padding: 20px;
	width:75%;
}#content li{
	list-style-position: outside;
}
#content img{
	width:100%;
	height: auto;
	}
video { 
	width: 100% !important; 
	height: auto !important;
} 

/********************************************
MAIN END
********************************************/

/********************************************
FOOTER MENÜ
********************************************/
#navi_footer ul{
	padding:0;

}
#navi_footer li{
	padding:0 10px 0 10px;
	list-style: none;
}
#navi_footer ul li a, #navi_footer ul li a:link,#navi_footer ul li a:visited {
	color: #fff;
	text-decoration: none;
}
#navi_footer ul li a:hover{
color: #88b056;
text-decoration: none;

}

#navi_service_footer ul{
	list-style: outside none none;
	list-style: none;
	padding: 0 0 110px 0;
}

#navi_service_footer li{
	list-style: none;
	display: block;
	float: right;
	font-size: 70%;
	color: #fff;
	padding: 2px;
}
#navi_service_footer ul li a {
	color: #fff;
	text-decoration: none;
	font-weight:400;
	text-transform:uppercase;
	padding: 0 2px;
}
#navi_service_footer ul li a:link a:visited{
	color: #fff;
	text-decoration: none;
	font-weight:400;
}
#navi_service_footer ul li a:hover{
	color: #88b056;
	text-decoration: none;
	font-weight:400;
}
#navi_service_footer #nav_sub_active{
	color: #88b056;
	text-decoration: none;
	font-size:14px;
	font-weight:400;
}
#navi_service_footer li::before {
    content: '|';
	color: #fff;
	font-size: 90%;
	float: right;
}
#navi_service_footer li:first-child::before {
    content: '';
}
/********************************************
FOOTER MENÜ END
********************************************/
/********************************************
FOOTER
********************************************/
.footer{
	padding: 28px 5%;	
	clear:both;
	font-size:70%;
	color: #fff;
	background-color: #6599c8;
	overflow: hidden;
}
#adresse {
    text-transform: uppercase;
    font-size: 93%;
	width: 20%;
	}
.footer_content {

	}
footer .follow_us {
	float: right;
    text-align: right;
	padding: 0 0.5% 0 0;
	}
#design {
	text-align: right;
	color: #fff;	
	}
/********************************************
FOOTER END
********************************************/

/*

Login

*/
		

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}
@media screen and (-webkit-min-device-pixel-ratio:0)
{
	img, embed, object, video {
		max-width: 100%;
		height: auto;
		width: auto;
	}

}

/* For iPads and other Tablets or Displays less then 1024px ======================== */
  @media screen and (max-width: 1024px){  
body {
	font-size: 1.2em;
    line-height: 1.4;
	font-family: 'Roboto',Verdana, sans-serif;
	font-weight: 300;
	background-color: #fff;
	background-image: none;
}
#wrapper {
	margin: 0 auto;
	position:relative;
}

#navi_home{
	display:none;
}
#navi{
	display:none;
}
#navi_sub{
    width: 100%;
}
#navi_service{
	display:none;
}
#sprache{
	display:none;
}
#mobile-header {
    display: block;
	top:0px;
	width:100%; 
	height:auto; 
	z-index:100;
	}
#main_home {
    text-align: center;
	font-size: 80%;
}
#main {
	padding: 10px;
	clear:both;
}
#content {
	float: left;
	padding: 20px;
	width:90%;
}
#breadcrumb {
	display:none;
	}
video { width: 100% !important; 
height: auto !important;
} 

#bild{
	height: auto;
}
#bild .flexslider {
 margin: 0;
}	
#bild .flexslider .caption {
background: #fff;
padding: 0;
}
/********************************************
FOOTER MENÜ
********************************************/
#navi_footer{
	float: left;
    margin: 0 0 0 7px;
    padding: 20px 0;
}
#navi_footer li{
	padding:0;
	list-style: none;
}
#navi_footer ul li a, #navi_footer ul li a:link,#navi_footer ul li a:visited {
	color: #fff;
	text-decoration: none;
	font-size: 100%;	
}
#navi_footer ul li a:hover{
color: #fbba00;
text-decoration: none;

}
.floatBlock {
	text-align: left;
    width: 110px;
	display:block;
	}
.floatBlock a {
	text-decoration:none;
	font-weight:400;
}
.floatBlock ul {
	padding:0;
	margin:0;
	list-style:none;
	font-weight:normal;
}
/********************************************
FOOTER MENÜ END
********************************************/
/********************************************
FOOTER
********************************************/
.footer{
	padding: 8px 10px 0 5px;	
	clear:both;
	font-size:70%;
	color: #fff;
	overflow: hidden;
}
#copyright {
	border-top: #fbba00 thin solid;	
	margin: 0 0 20px 0;
    text-align: center;
	font-size: 80%;
	}
#adresse {
    text-transform: uppercase;
 	 font-size: 100%;
    padding: 20px 0;
    text-align: left;	
	}
/********************************************
FOOTER END
********************************************/
}
/* For Smartphones, Tablets or other Displays less then 768px ====================== */
@media screen and (max-width: 768px){
  /* Header */
  	body {
	background: none;
}

header img{
	vertical-align:top;
	}
#navi{
	display:none;
}
.menu_button {
	position: fixed;
    left: 15%;
    top: 1%;
	}
#navi_service{
	display:none;
}
#mobile-header {
    display: block;
	top:0px;
	width:100%; 
	height:auto; 
	z-index:100;
	}
#wrapper #suche {
	display:none;
}
#bild_content .flexslider {
    background: none repeat scroll 0 0 #FFFFFF;
    margin: 0;
    position: relative;
}

#main {
	padding:20px;
	min-height: 150px;
	position:relative;

}
#main_slider {
	padding:10px;
	min-height: 150px;
	position:relative;
	margin-top: 220px;
}

video { width: 100% !important; 
height: auto !important;
} 
#content_links video {
		max-width: 100%;
		height:100%;
		width: auto;
	}

#content_rechts {
	width:100%;
	float:left;
	padding: 3px;
	height:1%;
	background-color: #cce3e4;
}
#navi_oben{
	height:42px;
	padding: 0;
	background-color: #FFF;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #ececec;
	border-bottom-color: #ececec;
}

nav { 
		text-align: center; 
		width: 100%;
	}
nav select {
	    background-color: #F0F0F0;
	    border: medium none;
	    display: block;
	    font-size: 100%;
	    font-weight: bold;
	    margin: 0 auto;
	    min-width: 260px;
	    position: relative;
	    top:8px;
	    width: 60%;
	    height: 25px;
	}

#bild_home{
	height:auto;
	padding:0;
}
#bild{
	height:auto;
	padding:0;
}
#bild img{
	height: auto !important;
	width: 100% !important;	
}
#bild .flexslider {
 	margin: 0;
}	
#bild .flexslider .caption {
	background: #fff;
	padding: 0;
}	
#bild #Anfahrt {
	max-width: 100%;
	height:auto;
}

/********************************************
FOOTER MENÜ
********************************************/
#navi_footer {
	display:none;
}

#navi_service_footer{
	display:none;
}

/********************************************
FOOTER MENÜ END
********************************************/

/********************************************
FOOTER
********************************************/
.footer{
	padding: 28px 5%;	
	clear:both;
	font-size:70%;
	color: #fff;
	background-color: #6599c8;
	overflow: hidden;
}
#adresse {
    text-transform: uppercase;
    font-size: 2em;
	width: 100%;
	text-align: center;
	}
footer .follow_us {
    text-align: center;
	padding: 50px 0.5% 0 0;
	}
#design {
	text-align: right;
	color: #fff;	
	}
/********************************************
FOOTER END
********************************************/
	}
	
/* For Smartphones, Tablets or other Displays less then 480px ====================== */
@media screen and (max-width: 480px){
#slider .flex-caption strong{
	font-size: 150%;
	font-weight: 300;
} 
.menu_button {
	position: fixed;
    left: 15%;
    top: 0;
	}
#main {
	clear:both;

}
	}
/* For Smartphones, Tablets or other Displays less then 480px ====================== */
@media screen and (max-width: 320px){
	
	}	
/* make all pictures full */
@media screen and (max-width: 479px){
    .half li{  margin: 1.25%; padding: 1.25%; width: 95%; }
    .third li{  margin: 1.25%; padding: 1.25%; width: 95%; }
	.quarter li{  margin: 1.25%; padding: 1.25%; width: 95%; }
	.fifth li{  margin: 1.25%; padding: 1.25%; width: 95%; }
}
/* responsibility des Sliders */
@media screen and (max-width: 960px){

}


div.sideBarInner .clearfix {margin: auto; width: 103%;}
  #full .sidebarBox { padding: 30px;}

div.csc-mailform ol li {
	display: block!important;
}
/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
	
}