*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

/*
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}
*/
/**
 * 15.1 Mobile Large 620px
 */
/*
@media screen and (min-width: 38.75em) {}
*/



body {
	font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #000;
	background-color:#fff;
	overflow-x:hidden;
	
}
a {
	color: #787878;
	text-decoration: none;
}


a:hover,
a:active {
	color:#DC0000;
}

body > .container{
	background-color:#fff;
	z-index:1;
	
}

/* Index style - current start page - first level */

/** head container **/
#head{
width:70%;
height:4em;
position:relative;
border:0px solid red;
margin-left:auto;
margin-right:auto;
}
.lft, .rgt{
position:relative;
top:0;
left:0;
float:left;
height:100%;
border:0px solid green;
}
.lft{
width:10%;
}
.lft img{
position:relative;
float:left;
width:3em;
margin: .6em 0;
border:0px solid green;
}

.rgt{
	float:right;
	width:90%;
}

/* navigation first level */
nav ul{
	position:absolute;
	top:.6em;
	left:0;
	border:0px solid green;	
    list-style: inside none none;
	overflow:visible;
	white-space:nowrap; 
	padding-left:0;

}
 nav ul li{
	display:inline-block;
	list-style: inside none none;
	width:9em;
	border:0px solid red;
	vertical-align:top;
	padding: 0 0 0 .6em;
		white-space:normal; 
}
nav ul li a{
	font-size:1.4em;
	font-weight:bold;
	color:#770000;
}
nav ul li a:hover, a:active{
	color:#DC0000;
}

nav ul li:hover ul{
  font: inherit;
    z-index:2 ;   /*  Unternavigation einblenden */
}
nav ul li:hover {
	padding: 0 0 0 .6em;
	margin: 0em;
}
/*
nav ul li:hover a{
	color:#fff;
}*/
nav ul ul li:hover {
	background-color:transparent;
	margin:0 0 1em;
	border:none;
	font-weight:normal;
}/*
nav ul ul li:hover a{
		color:#770000;
}*/
/* navigation second level */
nav ul ul {
	position:relative;
	top:.6em;
	left:-.6em;
	width:auto;
    display:;
	overflow:;
	background:rgba(255,255,255, 0.7);
/* Unternavigation ausblenden */
  z-index: -2;
  padding:.6em .6em .02em 0;

}
 nav ul ul li{
	width:auto;
	display:list-item;
	margin:0 0 1em;

}
nav ul ul li a{	
	font-size:1.1em;
	font-weight:normal;
	line-height:1em;
}


/** band container **/
#band{
width:auto;
height:20em;
background:url("../images/trail.jpg") no-repeat scroll center center / cover;
}

#band h1{
position:relative;
left:15%;
font-size: 10em;
color:#000000;  
text-shadow: -5px -5px 20px white; 
margin:0;
padding: .3em 0 0;
}
#band p.subtitle {
	position:relative;
	left:15%;
font-size: 2.8em;
color:#fff;
margin-top:.0em;

}
/** content container **/
#content{
width:70%;
height:auto;
position:relative;
margin-left:auto;
margin-right:auto;
text-align:left;
padding: 2em 0;
border:0px solid;
}
#content  h1{
font-size: 2em;
}
#content  p{
position:relative;
font-size:1.1em;
line-height:1.2em;
}
#content .box {
	display:inline-block;
	border:0px solid blue;
	width:11em;
	margin:.6em;
	padding:.6em;
	vertical-align:top;
	/*cursor:pointer;*/
}
/*
#content .box:hover{
background-color:#e6e6e7;
}*/
#content .box  h2{
	font-size:1.2em;
}
#content .box  img{
	width:6em;
}

img#top{
	margin:2em 0 0;
}
/** footer container **/
#footer{
width:auto;
height:auto;
position:relative;
bottom:0;
left:0;
z-index:0;
padding: .4em 0 2em;
background-color:#770000;
}

#footer .cont{
position:relative;
left:15%;
width:70%;
border:0px solid white;
}

#footer p{
font-size:.9em;
line-height:1.2em;
color:#fff;
}
#footer p span{
	float:right;
}
#footer  a{
font-size:;
line-height:1.2em;
color:#fff;
}
#footer  a:hover{
color:#Dc0000;
}
#footer img{
    display: inline;
    width: 2.4em;
	margin: 0 .3em;

}
#footer img:hover{
	border:2px solid #Dc0000;
}

/**
 * Mobile Large 620px
 */

@media screen and (max-width: 38.75em){
#head{
width:100%;
}
.lft{
left:5%;
}
.rgt{
	float:right;
	width:80%;
} 

nav ul li a, nav ul ul li a{
	font-size:;
}

}