html {
	overflow-y:scroll
}

body {
	font-family:Arial, sans-serif;
	padding:0;
	margin:0;
	color:#888;
	font-size:16px
}

h1, h2 {
	color:#b6101d
}

h1 {
	text-transform:uppercase;	
	font-size:35px;
	margin-top:0;
	margin-bottom:40px;
}

h2 {
	font-size:20px;
	margin-top:0;
	margin-bottom:28px
}

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

.container {
	width:100%;
	content: '';
}

.navi-spacer {
	width: 22.12%;
	background:#E8E8E8;
	background: -moz-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: -webkit-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: -o-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	float:left;
	min-height:60px
}

.navi {
	width:77.88%;
	background:#E8E8E8;
	background: -moz-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: -webkit-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: -o-linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	background: linear-gradient(#f1f1f1 0%, #E8E8E8 50%, #dedede 100%);
	float:left;
	min-height: 60px
}

.navi ul {
	margin:0;
	padding:0;
	list-style:none;
	position:absolute
}

.navi li {
	float:left;
	margin-right:35px
}

.navi li a {
	padding: 21px 0;
    display: block;
    color: #b70d1c;
    text-decoration: none;
}

.navi > ul > li.active > a {
    border-top: 2px solid #b60f1d;
	padding-top: 18px;
    background-position-y: -2px!important;
}

.navi li a.has-children {
	padding-right: 19px;
    background: url(has-children.png) no-repeat top right;
}

.navi > ul > li > a {
	padding:20px
}

.navi > ul > li > ul {
    display: none;
    position: absolute;
    list-style: none;
    z-index: 9999999;
    margin: 0;
    background: #dedede;
    color: #FFF;
    padding: 10px;
    margin-left: -10px;
    min-width: 175px;
}
.navi > ul > li > ul > li > ul {
    display: none;
    position: absolute;
    list-style: none;
    z-index: 9999999;
    margin: 0;
    background: #dedede;
    color: #FFF;
    padding: 10px;
    margin-left: -10px;
    min-width: 175px;
}

.navi > ul > li:hover > ul {
	display:block
}

.navi > ul > li > ul > li:hover > ul {
	display:block
}


.navi > ul > li > ul li {
position:relative;
    margin: 0;
    float: none;
    padding-left: 0;
}

.navi > ul > li > ul li a {
    display: block;
    padding: 10px 20px;
    min-width: 120px;
    color: #b60f1d;
}

.navi > ul > li > ul li a:hover {
    background: #efefef;
    color: #c96069;
}

.navi > ul > li > ul > li > ul {
 position:absolute;
top:-10px;
left:175px
}

.navi > ul > li > ul > li:hover > ul {
display:block
}

.navi > ul > li > ul > li > ul li a:hover{
    background: #efefef;
    color: #c96069;
}
#link-impressum {
    position: absolute;
    right: 22px;
    top: 40px;
    font-size: 12px;
}

.sidebar {
	width:22.07%;
	float:left;
}

.logo {
	text-align:center;
	border-bottom:4px solid #b6101d
}

.side {
	padding: 13.57% 13.57% 0 13.57%;
}

.side p {
	line-height:30px;
	margin-top:0
}
.main {
	width: 77.93%;
	float:left;
	margin-bottom: 100px;
}

#slider {
	width:100%
}

#slider p {
	color:#000
}

.teaser {
	float:left;
	width:28.4%;
}

.teaser-mid {
	margin:0 7.4%
}

.teaser a {
	display:block; 
	color:#b60f1d;
	position:relative
}

.teaser img {
	max-width:100%;
	height:auto
}

.teaser-headline {
	position: absolute;
    top: 0;
    left: 0;
	width: 86.1%;
    text-transform: uppercase;
    background: rgba(255,255,255,0.9);
    padding: 24px 7% 28px 7%;
    font-size: 20px;
}

.content {
	margin-top:3.719%;
	line-height:30px;
	padding: 3.719%;
}

.teaser-line { 
	width: 150px;
    height: 2px;
    background-color: #888;
    position:relative;
    top: 6px;
    left: 0;
}

#link-impressum {
    position: absolute;
    right: 22px;
    top: 40px;
    font-size: 12px;
}
.slicknav_menu {display:none}
/* Cookiebanner */

#cookie-details {padding-top: 10px;width: 100%;margin: auto;font-size:13px;color:#000;height:0;overflow:hidden}
#cookie-details table {margin:20px 0;font-size:13px;color:#000;border-collapse: collapse;}
#cookie-details table td {font-size:13px;color:#000;border:1px solid #000; padding:4px;}
#cookie-details p {font-size:13px;color:#000}
#viewdetails {
display: inline-block;
    text-align: center;
    margin: 4px 0 4px 10px;
    border: 0;
    font-size: 13px;
    padding: 4px 10px;
    color: #000;
}
#CoverCookies-cover {font-family:'Arial';font-size:13px;padding:0 20px}
#CoverCookies-cover form {
    display: inline-block;
    padding: 7px;
    margin: 10px 0 5px 0;
	float:left;
}
#CoverCookies-cover form label {
	color:#000;
	font-size:13px;
}
.cookieminitext {
color: #000;
font-size: 13px;
}/* Cookiebanner */

#cookie-details {padding-top: 10px;width: 100%;margin: auto;font-size:13px;color:#000;height:0;overflow:hidden}
#cookie-details table {margin:20px 0;font-size:13px;color:#000;border-collapse: collapse;}
#cookie-details table td {font-size:13px;color:#000;border:1px solid #000; padding:4px;}
#cookie-details p {font-size:13px;color:#000}
#viewdetails {
display: inline-block;
    text-align: center;
    margin: 4px 0 4px 10px;
    border: 0;
    font-size: 13px;
    padding: 4px 10px;
    color: #000;
}
#CoverCookies-cover form {
    display: block;
    padding: 7px;
    margin: 10px 0 5px 0;
}
#CoverCookies-cover form label {
	color:#000;
	font-size:13px;
}
.cookieminitext {
color: #000;
font-size: 13px;
}
.CoverCookies-content label {
  display: block;
  position: relative;
  padding-left: 60px;
  line-height:20px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size:13px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: auto;
    text-transform: none;
    margin-top: 15px;
    font-size: 13px;
}
/* hide html checkbox */
.CoverCookies-content label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkmark-bg {
    float: left;
    position: absolute;
    left: 0;
    width: 45px;
    height: 25px;
background: #fff;
    -moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
}
/* custom checkbox */
.checkmark {
position: absolute;
    top: 3px;
    left: 4px;
    height: 19px;
    width: 19px;
    background-color:#a5a5a5;
    -moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	-webkit-transition:left ease-in-out 0.2s;
	-moz-transition:left ease-in-out 0.2s;
	transition:left ease-in-out 0.2s;
}

/* checked style */
.CoverCookies-content label input:checked ~ .checkmark-bg .checkmark {
  background-color: #b6101e;
  left:21px;
}


.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* show if checked */
.CoverCookies-content label input:checked ~ .checkmark-bg .checkmark:after {
  display: block;
}

/* Style button */
.CoverCookies-content label .checkmark-bg .checkmark:after {
  left: 0px;
  top: 0px;
  width: 19px;
  height: 19px;
}

a[href^="http://"]:not([href*="nelles-bedachungen.de"]):after,
a[href^="https://"]:not([href*="nelles-bedachungen.de"]):after {
content: url('../fonts/external-link_sm2.png');
  vertical-align:unset;
  padding-left:4px;
}

@media handheld, only screen and (max-width:1660px) {

#link-impressum {
position: relative;
    right: 0;
    top: 0;
    font-size: 12px;
    text-align: right;
    padding-bottom: 10px;
}
.navi ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    width: 100%;
    overflow: hidden;
}
.navi-spacer {
    min-height: 82px;}
	
}

@media handheld, only screen and (max-width:1500px) {

h1 {
	font-size:30px;
	margin-bottom:20px
}

h2 {
	font-size:18px
}

#slider {
	height:328px!important
}
	
}

@media handheld, only screen and (max-width:1400px) {

.navi li {
    margin-right:10px
}

.navi > ul > li > a {
    padding: 20px 10px;
}

}

@media handheld, only screen and (max-width:1100px) {

body {
	font-size:12px;
	line-height: 17px;
}

.side p {
    line-height: 18px;
}

h2 {
    font-size: 12px;
	margin-bottom: 12px;
}

.content-part {
	padding:15px;
	min-height: 250px;
}

.navi li {
	margin-right: 0px;
}

h1 {
	font-size:18px;
	margin-bottom:10px;
}

#link-impressum {
	top:0px;
	right: 22px;
}

#slider {
    height: 225px!important;
}

.referenzen {
    width: 38%;
}

.teaser {
    float: left;
    width: 29%;
}

.teaser-mid {
    margin: 0 4%;
}

.teaser-headline {
    font-size: 14px;
    line-height: 18px;
}

}

@media handheld, only screen and (max-width:780px) {

body {
	font-size:15px;
	line-height: 17px;
}

h2 {
    font-size: 15px;
}

.sidebar, .main {
	width:90%;
	padding:0 5%;
}
.sidebar {margin-bottom:20px;}
.content img {
    margin: 10px auto!important;
    float: left!important;
	max-width: 100%;
    height: auto!important;
}
#slider {
	display:none
}

.side {
    padding: 5% 5% 0 5%;
}

.teaser {
	width:100%;
	margin:0
}

.teaser-mid {
	margin:0
}

.content div {
	width:100%!important
}
/*
.content .content-text div:first-child {
	display:none
}
*/
.teaser-headline {
	font-size:17px
}

.content-part {
	max-width:90%
}

.navi-spacer {
	display:none
}

.navi {
	width:100%;

}
.mainnavi {
	display:none
}
.navi ul {
    position: relative;
}

.navi li {
    width:100%
}

.navi > ul > li > ul, .navi > ul > li > ul > li > ul {
	display:block;
	position: relative;
}

.navi > ul > li > ul > li > ul {
	left:0;
top:0
}
.navi > ul > li.active > a {
	border:0
}
.slicknav_menu {display:block}
#link-impressum {
    top: 20px;
    right: 0;
    left: auto;
    position: relative;
    text-align: center;
}
.logo img {width:60%!important;}

}