@import url(http://fonts.googleapis.com/css?family=Dosis:300,200);
@media all and (min-width: 800px) {
	.nav-tablet {
		width: 20%;
		float: left;
		margin-top:55px !important;
	}
	.ui-content {font-size:1.1em !important;}
	#start, #impressum, #leistung, #ueber-uns, #kontakt {background:none !important;}
	h1 {margin-left:46px !important; padding-left: 5.6em;}
	h2 {margin-left: 0px !important; padding-left: 0 !important; font-size: 1.3em !important;}
	img.tablet {margin:25px 45px 0 15px; float:left;}
	.nav-mobile {display:none;}
	
	p {width:70%;
    -moz-column-count: 2 !important;
    -webkit-column-count: 2 !important;
    column-count: 2 !important;
	-webkit-column-gap: 25px;
	-moz-column-gap: 25px;
	column-gap: 25px;	
	padding-left:0 !important;
	}
    .tbtn {width:20% !important; float: left;}
	ul.list {width: 250px; float: left !important;}
	ul.list li {margin-left: 20px !important; }
	
	.gallery { list-style: none; padding: 0; margin: 0 0 0 156px; }
.gallery:after { clear: both; content: "."; display: block; visibility: hidden; }
.gallery li { list-style: none !important; background:none !important; padding:0px !important; float: left; width: 20%; }
.gallery li a { display: block; margin: 5px; border: 1px solid #3c3c3c; }
.gallery li img { display: block; width: 100%; height: auto; }
.classic { margin: 5px auto !important; max-width: 230px; display: block !important; }
	
}

@media all and (max-width: 799px) {
    .ui-btn-text {font-size: 0.92em !important;}
	.nav-mobile {
		width: 100% !important;
	}
	.ui-collapsible-inset .ui-collapsible-content {
    margin: 0 !important;
    border-right-width: 0px !important;
    border-left-width: 0px !important;
    }
 	.tbtn {width:60% !important; margin-left: 100px !important;}
 	ul.list {float: left !important;}
	
	.vis-non {display: none;}
	img.tablet {display:none;}
	.gallery { list-style: none; padding: 0; margin: 20px 0 0 97px; }
.gallery:after { clear: both; content: "."; display: block; visibility: hidden; }
.gallery li { list-style: none !important; background:none !important; padding:0px !important; float: left; width: 50%; }
.gallery li a { display: block; margin: 5px; border: 1px solid #3c3c3c; }
.gallery li img { display: block; width: 100%; height: auto; }
.classic { margin: 5px auto !important; max-width: 230px; display: block !important; }
}


page{ margin:auto; }

#header { background: url(../images/brandschutz-header.jpg) top left repeat-x; width: 100%; height: 5em;}
#header img { padding-top: 1.6em; margin: 0; }
#bild { position:absolute; left:0; bottom:0;}
.nav-tablet ul li {padding:0 !important; margin:0 !important; list-style:none;}
.nav-tablet ul li a {padding:0 !important; margin:0 !important;}

.clear {clear: left !important;}
span.info {float: left;}
.impressum {padding-left: 6em;}

* {font-family: 'Dosis', sans-serif;}
h1 { font-size: 1.3em; padding-left: 4.8em; margin:0; }
h2 { font-size: 1em; padding-left: 6.2em;}
.col-l {width: 300px; float: left;}
.col-r {width: 300px; margin-left: 20px; float: left;}
p { padding-left: 6.2em;}

.left { padding-left: 6.2em; }

ul li { padding-top: 0.5em; list-style:url(../images/nav.gif)}

#start, #impressum, #leistung, #kontakt { background-image: url(../images/brandschutz-gebaeude.jpg); background-repeat:no-repeat; background-position:left bottom;}
#ueber-uns{ background:url(../images/brandschutz-referenzen.jpg); background-repeat:no-repeat; background-position:left bottom;  }