html {
}

body {
margin: 0;
padding: 0;
font-family: 'Merriweather Sans', Helvetica, Arial, Sans-Serif;
font-size: 14px;
line-height: 1.5em;
text-align: center;
color: #504F53;
background-color: #F3F3F5;
}

#bg {
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 1;
}

* html #bg {
position: absolute;
}

#bg img {
height: auto;
width: 100%;
z-index: 0;
}

#page {
height: 100%;
position: relative;
top: 0;
z-index: 2;
}

* html #page {
height: 100%;
overflow: auto;
width: 100%;
}

h1 {
color: #504F53;
font-size: 22px;
line-height: 1.4em;
font-weight: normal;
margin: 0;
padding: 0;
padding-bottom: 15px;
}

h2 {
color: #BB181A;
font-size: 18px;
line-height: 1.3em;
font-weight: normal;
margin: 0;
padding: 0;
padding-bottom: 15px;
}

h2.start {
color: #BB181A;
font-size: 14px;
line-height: 1.3em;
font-weight: normal;
margin: 0;
padding: 0;
}

h2.anfahrt {
padding-top: 20px;
}

h2.contprodukte {
margin-top: 10px;
padding: 0;
font-size: 14px;
line-height: 1.4em;
}

h3 {
color: #BB181A;
font-size: 12px;
line-height: 1.3em;
font-weight: normal;
margin: 0;
padding: 0;
}

h3 a {
color: #BB181A;
}

h3.footer {
color: #FFFFFF;
font-size: 18px;
font-weight: normal;
margin: 0;
padding: 5px 10px;
border-left: 2px solid #FFFFFF;
}

a {
color: #BB181A;
text-decoration:none;
}

a:hover {
text-decoration:underline;
}

.schriftklein {
font-size: 10px;
line-height: 1.4em;
}

img {
border:none;
}

td {
vertical-align: top;
}

ul {
margin: 0;
padding: 0;
}

input {
font-family: Helvetica, Arial, Sans-Serif;
color: #000000;
font-size:12px;
border: 1px solid #083583;
background-color:#FFFFFF;
padding: 3px;
margin: 2px;
}

textarea {
font-family: Helvetica, Arial, Sans-Serif;
color: #000000;
font-size:12px;
border: 1px solid #083583;
background-color:#FFFFFF;
padding:3px;
margin: 2px;
}

select {
font-family: Helvetica, Arial, Sans-Serif;
color: #000000;
font-size:12px;
border: 1px solid #083583;
background-color:#FFFFFF;
padding:3px;
margin: 2px;
}

.button {
padding: 5px;
margin:0;
background-color: #083583;
border: 1px solid #083583;
color:#FFFFFF;
}

/**************************************************************************************/

#container {
margin: 0em auto;
width: 980px;
text-align: left;
}

/**************************************************************************************/

#left {
float: left;
width: 350px;
}

#leftbox {
bottom: 220px;
position: fixed;
width: 305px;
font-style: italic;
background: url(http://www.zweithaarprofi-allgaeu.de/img/layout/bg-transp.png) top left repeat;
padding: 10px 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius: 15px;
border-radius: 15px;
}

#lefttextleft {
float: left;
padding-top: 15px;
}

#lefttextright {
float: right;
padding-top: 5px;
}

#lefttextleft, #lefttextright {
color:#E60004;
font-size: 36px;
}

#lefttext {
margin-left: 35px;
width: 240px;
}

#right {
width: 630px;
margin-left: 350px;
}

/**************************************************************************************/

#header {
}

#topnavi {
padding-top: 10px;
}

#topnavi a {
color: #504F53;
text-decoration: none;
}

#topnavi a:hover {
color: #E60004;
text-decoration: underline;
}

#topnavi ul {
margin: 0;
padding: 0;
list-style: none;
}

#topnavi ul li {
float: right;
margin-left: 10px;
margin-top: 7px;
}

.nav-collapse.disable-pointer-events {
pointer-events:none !important;
}

.nav-collapse {
z-index:1;
}

.nav-collapse,.nav-collapse *{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.js .nav-collapse{
position:relative !important;
max-height:none;
}

.nav-collapse.opened{
max-height:9999px;
}

.nav-toggle {
display:none;
}

#logo {
margin-top: 50px;
margin-left: 25px;
}

#slogan {
width: 190px;
height: 39px;
margin-top: 35px;
margin-right: 60px;
float: right;
}

/**************************************************************************************/

#navi {
height: 40px;
line-height: 40px;
width: 630px;
background-color: #E60004;
padding: 0;
margin: 0;
margin-top: 10px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius: 15px;
border-radius: 15px;
font-size: 18px;
}

#navi ul {
list-style: none;
margin: 0;
padding: 0;
}

#navi ul li a {
float: left;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
margin: 0 25px;
}

#navi ul li a:hover {
text-decoration: underline;
}

/**************************************************************************************/

#contentstart {
margin: 20px 0 230px 25px;
overflow: hidden;
}

#content {
padding: 20px 20px 230px 25px;
overflow: hidden;
}

#contstartprodukte {
width: 240px;
float: right;
}

#contstart {
width: 345px;
}

#contstartlaeden {
padding-top: 30px;
}

#contstartlaedeneinzel {
}

.contstartlaedenbild {
width: 320px;
height: 291px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
border: 1px solid #504F53;
margin-bottom: 10px;
}

.contstartlaedenbild:hover {
border: 1px solid #E60004;
}

.contkontaktbild {
width: 400px;
height: 364px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
border: 1px solid #504F53;
margin-bottom: 10px;
}

.contkontaktbild:hover {
border: 1px solid #E60004;
}

/**************************************************************************************/

.contstartprodukte {
margin-right: 10px;
margin-bottom: 10px;
width: 70px;
float: left;
min-height: 110px;
}

.contstartproduktbild {
box-shadow: 0px 0px 5px #818084;
-moz-border-radius: 5px;
-webkit-border-radius: 15px;
-khtml-border-radius: 5px;
border-radius: 5px;
border: 1px solid #504F53;
}

.contstartproduktbild:hover {
border: 1px solid #E60004;
}

/**************************************************************************************/

.contprodproduktbild {
margin-right: 20px;
margin-bottom: 30px;
width: 125px;
height: 196px;
float: left;
position: relative;
box-shadow: 0px 0px 5px #818084;
text-align: center;
}

.contproduebersicht {
margin-right: 20px;
margin-bottom: 60px;
width: 125px;
height: 196px;
float: left;
position: relative;
text-align: center;
}

.contprodproduktbild .item .overlay {
background-color:#FFFFFF;
width: 125px;
height: 196px;
top: 0;
left: 0;
position:absolute;
-moz-opacity:0.8;
-khtml-opacity:0.8;
opacity:0.8;
color:#504F53;
}

.contprodproduktbild .item .overlay.hide {
display:none;
}

.contprodproduktbild .item .overlay h2 {
font-size:11px;
font-weight:normal;
color: #504F53;
margin: 5px;
line-height: 1.2em;
display: block;
}

/**************************************************************************************/

#menuinterest {
width: 100%;
position: fixed;
bottom: 170px;
z-index: 999;
}

#menuinterestcontent {
margin: 0em auto;
width: 980px;
}

#toppanelinfos {
margin-left: 375px;
margin-bottom: 0;
}

.tabinfos {
height: 41px;
top: 0;
}

.tabinfos ul.logininfos {
display: block;
height: 38px;
margin: 0;
left: 0;
bottom: 41px;
}

.tabinfos ul.logininfos li {
text-align: left;
padding: 0px;
display: block;
float: left;
height: 41px;
}

.tabinfos a.openinfos, .tabinfos a.close {
height: 20px;
line-height: 0px !important;
padding-left: 0px !important;
cursor: pointer;
display: block;
width: 100px;
top: 0px;
}

#panelinfos {
width:210px;
background: url(http://www.zweithaarprofi-allgaeu.de/img/layout/bg-transp.png) top left repeat;
overflow: hidden;
position: relative;
z-index: 3;
display: none;
}

#panelcontent {
text-align: left;
line-height: 1.6em;
padding: 10px 15px;
font-size: 12px;
}

#panelcontent ul {
list-style: none;
margin:0px;
}

/**************************************************************************************/

#footer {
height: 195px;
bottom: 0px;
left: 0px;
position: fixed;
width: 100%;
}

#footerwhite {
height: 25px;
margin: 0em auto;
width: 980px;
}

#footerwhitecontent {
margin-left: 670px;
}

#footerwhitereiter {
color: #FFFFFF;
text-decoration: none;
line-height: 25px;
background-color: #4F4B4F;
-moz-border-radius:10px 10px 0 0;
-moz-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
float: left;
width: 70px;
}

.footerwhitereiterleft {
margin-right: 120px;
}

#footerred {
background: #E60004 url(http://www.zweithaarprofi-allgaeu.de/img/layout/bg-footer.jpg) top left repeat-x;
height: 170px;
color: #F4AD90;
clear: both;
}

#footer a {
color: #F4AD90;
}

#footercontent {
margin: 0em auto;
width: 980px;
text-align: left;
line-height: 1.6em;
}

#footercontenteinzel {
float: left;
margin-right: 30px;
}

#footercontenteinzeltext {
margin-left: 12px;
margin-top: 5px;
}

#footercontentright {
margin-left: 670px;
}

#footercontentinfo {
line-height: 1.4em;
font-size: 12px;
	float: left;
}

#footercontentinfo a, #footercontentnews a {
color: #FFFFFF;
}

#footercontentnews {
margin-left: 190px;
line-height: 1.4em;
font-size: 12px;
}

/****************************************************************************************************************************************************************************/

@media (max-width : 980px) {

/**************************************************************************************/

#bg {
display: none;
}

#top {
height: auto;
}

#clearmobil {
clear: both;
}

#container {
width: 90%;
margin-left: 5%;
}

#left {
display: none;
}

#right {
width: 100%;
margin-left: 0;
}

#topcontent {
width: 90%;
margin-left: 5%;
}

#logo {
margin-top: 0;
margin-left: 0;
}

#slogan {
display: none;
}

#navi {
height: auto;
line-height: 2em;
width: 100%;
background-color: #E30613;
}

.nav-collapse,.nav-collapse ul{
margin:0;
padding:0;
list-style:none;
width:100%;
float:left;
}

.nav-collapse li{
width:100%;
display:block;
}

.js .nav-collapse{
clip:rect(0 0 0 0);
max-height:0;
position:absolute;
display:block;
overflow:hidden;
}

.nav-collapse a{
color:white;
text-decoration:none;
width:100%;
float:left;
margin:0;
padding: .3em 0;
color: #645A5B;
border-bottom:1px solid #FFFFFF;
}

.nav-toggle{
text-indent:-9999px;
width:70px;
height:55px;
overflow:hidden;
display:block;
float:right;
background: url("http://www.zweithaar-muenchen.de/img/layout/navi-icon.png") no-repeat 50% 33%;
margin-top: -20px;
padding-bottom: 10px;
}

#contentstart {
margin: 20px 0 0 0;
}

#content {
padding: 20px 0 0 0;
}

#contstartprodukte {
width: 100%;
float: none;
}

#contstart {
width: 100%;
}

#menuinterest {
display: none;
}

#footer {
height: auto;
position: static;
width: 100%;
margin-top: 30px;
}

#footerwhite {
display: none;
}

#footerred {
height: auto;
}

#footercontent {
width: 90%;
margin-left: 5%;
}

#footercontenteinzel {
float: none;
margin-right: 0;
margin-bottom: 20px;
}

#footercontentright {
margin-left: 0;
}

#footercontentinfo {
	float: none;
margin-bottom: 20px;
}

#footercontentnews {
margin-left: 0;
padding-bottom: 20px;
}

/**************************************************************************************/

}

@media (max-width : 300px) {

/**************************************************************************************/

#logo {
width: 100%;
}

/**************************************************************************************/

}