/*****
 MAIN CSS

*****/


/* hind-regular - latin */
@font-face {
  font-family: 'Hind';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/hind-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hind-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hind-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hind-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hind-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hind-v15-latin-regular.svg#Hind') format('svg'); /* Legacy iOS */
}



/********** Allgemein **********/

body{
	margin:0 50px;
    padding:0;
    font-family: 'Hind', sans-serif;
	color:#4a2a15;
}

.float-left{float:left;}
.float-right{float:right;}
.clearer{clear:both;}

.only-mobile{display:none !important;}




/********** Grundaufbau Strukur und Spalten **********/

#full-wrapper{ width: 100%; float: left;}
#content-wrapper {margin: 0 auto; width: 100%; max-width: 1200px;padding: 20px 0 0 0;}


.row{width: 100%;float: left;}
.column {float: left;margin: 0 2% 0 0;}
.column:last-child {margin-right: 0;}

.full { width: 100%;}
.half { width: 49%;}
.third { width: 32%;}
.quarter { width: 23.5%;}
.two-thirds { width: 66%;}
.three-quarters { width: 74.5%;}
.one-sixth{width: 15%}

/********** Header **********/


#logo img {width: 80%; float: right;}
.header{ padding-bottom:10px;}
.header h4 {
    font-size: 26px;
    margin: 0;
    margin-top: 4.5%;
	font-weight: 400;
}



/********** Menü **********/

#menu-wrapper{background-color:#f5ede2;}

#menu-inner-wrapper{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    position:relative;
	padding: 0 0 0 0;
	height: 50px;
}

#menu-inner-left{width:75%;}
#menu-inner-right{width:25%;}

#menu-inner-right img{
    width:100%;
    height:auto;
	max-width:240px;
	float: right;
}

#menu,
#menu ul{
    margin:0;
    padding:0;
    list-style-type:none;
}

#menu li{
    padding:0;
    display:inline-block;
	width:20%;
	text-align:center;
	background-color: #f5ede2;
}

#menu li a{
	color:#4a2a15;
	display:block;
	width:100%;
	padding: 12px 0;
	cursor:pointer;
}

#menu li a.active, #menu li a:hover {
    margin: 0 0 0 0;
    background-color: #c18e4d;
}

#menu ul{display:none;}




/********** Slider **********/

.flexslider{
	border: none;
	border-radius: 0;
	box-shadow:none;
    position: relative;
	background-color:transparent;
	margin-bottom: 2%;
}

.flex-control-nav{
    right:0;
    left:0;
    margin:0 auto;
    width:100%;
    max-width: 1200px;
    text-align:center;
    font-size:1px;
    color:#4d4d4d;
}

.flex-control-nav li {margin: 0 0 0 12px;}

.flex-control-paging li a{
    text-indent:-9999px;
	font-size:1px;
	color:#4d4d4d;
}

.flex-direction-nav a{
	margin: -110px 0 0;
	width: 35px
}

.flex-direction-nav a.flex-next:before {
	background-image:url(../images/arrow-right.jpg) !important;
	background-position:center;
	z-index: 15;
	height: 39px;
	width: 37px;
	content: "" !important;
}

.flex-direction-nav a:before {
	background-image:url(../images/arrow-left.jpg) !important;
	background-position:center;
	z-index: 15;
	height: 39px;
	width: 37px;
	content: "" !important;
}

.flex-control-paging li a.flex-active {background: rgba(193,142,77,1) !important;}

.flex-control-paging li a {
    background: #4a2a15;
    box-shadow: none;
	border-radius:20px;
}

.flexslider:hover .flex-prev {opacity: 1;}


@media only screen  and (max-width: 880px) {

.flex-control-nav, .flex-direction-nav {display:none;}
.flexslider {margin-bottom: 0;}

}

@media only screen  and (max-width: 430px) {

.flex-control-nav, ..flex-direction-nav {display:none;}

}

.slider-only-mobile{ display:none !important;}




/********** Footer **********/

#footer-wrapper{ width: 100%; float: left; background-color:#f5ede2; margin-bottom:50px;margin-top: 35px;}
#footer #content-wrapper {padding: 0 0 0 0;}
.footer-right{width: 80%; float:left;}
.footer-left{width: 20%; float:left;}

#footer,
#footer ul{
    margin:0;
    padding:0;
    list-style-type:none;
}

#footer li{
    margin:0 ;
    padding:0;
    display:inline-block;
	width: 25%;
	background-color: #f5ede2;
}

#footer li a{
    margin: 0 0 0 0;
	color:#4a2a15;
	width:100%;
	display:block;
	text-align:center;
	padding: 12px 0;
}

#footer li a.active, #footer li a:hover {
    margin: 0 0 0 0;
    background-color: #c18e4d;
}

#oben-btn{
	float:right;
	width: 35px;
	margin-top: 7px;
}




/********** Typo **********/

h1{ font-size:60px; margin:0 0 15px 0;line-height: 1.2em; font-weight:400; color:#c0a685;}
h2{ font-size:40px; font-weight: 400; color: #c0a685; margin:0;line-height: 1.1em;}
h3{ font-size:25px; margin-bottom: 0;margin-top: 35px;	font-weight:400;}
h4{ font-size:21px; margin: 35px 0 0x 0; font-weight:bold;}
h5{ font-size:18px; margin:0; line-height:1.3em; font-weight:bold}
p{ font-size:16px; line-height: 1.6em;  word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;}
a {color: #4a2a15; text-decoration: none;}
a:hover {color: #c0a685;}
ul{ padding-left: 14px;}
#impressum p, #datenschutz p{margin-top: 8px;}
::selection {background: #f5ede2;}
::-moz-selection {background: #f5ede2;}




/********** Content **********/

img{width: 100%;}

.textarea{margin-bottom: 50px !important;}
.textarea p, .textarea h5 {width: 80%;}


#impressionen{margin-top:50px;}
#impressionen img{ margin-bottom:4%; }
#impressionen img:hover {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
    -webkit-transition: 0.6s ease;
    transition: 0.6s ease;
}
#overflow div{overflow:hidden;}


.schnellzugriff img:hover{
    -webkit-transform: scale(1.03);
    transform: scale(1.09);
    -webkit-transition: 0.6s ease;
    transition: 0.6s ease;
}
.schnellzugriff div{overflow:hidden;}

.leistung{background-color: #f5ede2; padding: 2% 2% 1.25% 2%; width: 96%; margin-bottom:30px;}
.leistung p{margin: 0; width: 70%;}
.leistung h2{margin-top:-5px;}
#wohnmoebel .icon img, #kuechen .icon img, #tueren .icon img, #bodenbelaege .icon img, #bodenschleifen .icon img, #balkonterrasse .icon img {display: block; margin-left: auto; margin-right: auto;}
#wohnmoebel .icon img { max-width:71px;}
#kuechen .icon img { max-width:79px}
#tueren .icon img {max-width:62px}
#bodenbelaege .icon img {max-width:153px}
#bodenschleifen .icon img {max-width:141px}
#balkonterrasse .icon img {max-width:105px}




/********** Mediaqueries **********/

@media (min-width: 701px) and (max-width: 14000px) {

    .slicknav_menu{display:none;}

}

@media only screen  and (max-width: 1350px) {

#content-wrapper {
		width: 100%;
		padding: 20px 0;
		max-width:none;
}

#menu-inner-wrapper {max-width: none;}

.header h4 {font-size: 22px;}

h1 {font-size: 52px;}

#oben-btn {margin-right: 12px;}

}

@media (min-width: 881px) and (max-width: 1200px) {

#home .textarea p {width: 90%;}
#home .two-thirds {width: 64%;}
#home .third {width: 34%;}

}

@media only screen  and (max-width: 1200px) {

ul.schnellzugriff{padding:0;}

.header {padding-bottom: 20px;}

}

@media (min-width: 1px) and (max-width: 1050px) {

#logo img {width: 100%;}

}
@media (min-width: 1px) and (max-width: 1050px) {

#wohnmoebel .icon img {max-width: 61px;}
#kuechen .icon img {max-width: 66px;}
#tueren .icon img {max-width: 52px;}
#balkonterrasse .icon img {max-width: 85px;}
#bodenschleifen .icon img {max-width: 115px;}
#bodenbelaege .icon img {max-width: 143px;}
}

@media (min-width: 1px) and (max-width: 980px) {

.header h4 {font-size: 20px;}

h1 {font-size: 42px;}

#footer li {width: 30%;}

}

@media (min-width: 1px) and (max-width: 880px) {

.full, .two-thirds, .half, .third, .quarter, .three-quarters, .one-sixth {width: 100%;}
.column {float: left;margin: 0 0;}

.header .three-quarters{width: 75%;}
.header .quarter{width: 25%;}
.header h4 {margin-top: 7%; line-height: 1.4em;}

#menu-inner-wrapper {height: 80px;}

.slicknav_menu{
        display:block;
        position:absolute;
        z-index:9000;
        padding:0;
        width:55%;
}

.slicknav_menu .slicknav_menutxt {color: #4a2a15;}

.slicknav_btn{
        padding-top: 37px;
		margin: 29% 5px 11px 4%;
}

ul.slicknav_nav {
		width: 100%;
		margin-top: 103px;
		opacity:0.9;
}

ul.slicknav_nav li{border-top: none;}

ul.slicknav_nav li li:first-child{border-top:1px solid #00;}

ul.slicknav_nav li li:last-child{border-bottom:none;}

ul.slicknav_nav a:link, ul.slicknav_nav a:hover{font-size:16px;}

.slicknav_nav a {margin: 3px 4% !important;}

ul.slicknav_nav li li a{padding-left:25px;}

ul.slicknav_nav a{
		background: #f5ede2 !important;
		border-radius: 0 !important ;
		color: #4a2a15 !important;
}

ul.slicknav_nav a.active{background: #c18e4d !important;}

ul.slicknav_nav a:hover{
        background:#c18e4d !important;
		border-radius: 0 !important ;
}

ul.slicknav_nav .empty_menu_li{
        height:45px;
        margin-left:0;
}

span.slicknav_arrow{display:none;}

#menu{display:none;}

#menu-inner-left {width: 10%;}

#menu-inner-right {
        width: 90%;
        height:75px;
        text-align: right;
}

.only-desktop{display:none;}
.only-mobile{display:block !important;}

.socialmedia a {
    width: 40px;
    float: left;
}
.socialmedia img{
		float:left;
		margin:0;
}

.hg-lichtpunkte .two-thirds{width: 95%;}


.slider-only-desktop{ display:none !important;}
.slider-only-mobile{ display:inline !important;}

#footer .quarter{width: 100%;}
#footer p{ width:50%;}
#footer .row{ margin-bottom:30px;}
.hg-lichtpunkte {background-size: 55%;}
ul.schnellzugriff {padding: 0; width: 45%;}

.textarea {margin-bottom: 0 !important;}
.leistung p {margin-bottom: 20px;}
#wohnmoebel .icon img, #kuechen .icon img, #tueren .icon img, #bodenbelaege .icon img, #bodenschleifen .icon img, #balkonterrasse .icon img {
    display: inline;
    margin-left: 0;
    margin-right: 0;
	margin-bottom: 10px;
}
.leistung {
    padding: 4% 4% 3% 4%;
    width: 92%;
}

}

@media (min-width: 650px) and (max-width: 880px) {

	ul.slicknav_nav {margin-top: 98px;}

}

@media (min-width: 500px) and (max-width: 880px) {

#impressionen .column {float: left;margin: 0 2% 0 0;}
#impressionen .column:last-child {margin-right: 0;}
#impressionen .third { width: 32%;}
ul.slicknav_nav {width: 75%;}

}

@media (min-width: 1px) and (max-width: 810px) {

.slicknav_btn{margin: 29.5% 5px 11px 4%;}

}

@media (min-width: 1px) and (max-width: 720px) {

.header .three-quarters, .header .quarter {width: 50%;}

#logo img {width: 65%;}

.slicknav_btn {margin: 36% 5px 11px 4%;}

}

@media (min-width: 1px) and (max-width: 650px) {

#menu-inner-right {height: 80px;}

#footer li {width: 45%;}

ul.schnellzugriff {width: 55%;}

.header .three-quarters, .header .quarter {width: 100%;}

#logo img {
	float:left;
	width:45%;
}

.slicknav_btn { margin: 67% 5px 11px 4%;}

.header .quarter {margin-top: 10px;}
.leistung p {width: 80%;}
}

@media (min-width: 1px) and (max-width: 600px) {

.slicknav_btn { margin: 68% 5px 11px 4%;}

}

@media (min-width: 1px) and (max-width: 570px) {

.slicknav_btn { margin: 69% 5px 11px 4%;}

.header h4 { font-size: 19px;}
ul.schnellzugriff {width: 100%;}
.textarea p,  .textarea h5 {width: 100%;}
.leistung p {width: 100%;}
h2 {font-size: 32px;}
}

@media (min-width: 1px) and (max-width: 535px) {

.slicknav_btn { margin: 69% 5px 11px 4%;}

.header h4 { font-size: 17px;}

}

@media (min-width: 1px) and (max-width: 500px) {

body {margin: 0 30px;}

#menu-inner-right {height: 80px;}

#footer p{ width:100%; margin-bottom: 0;}
#footer .row{ margin-bottom:30px;}
#footer-wrapper{margin-bottom:30px;}

#impressionen img{ margin-bottom:2%; }


.slicknav_btn { margin: 75% 5px 11px 4%;}

h1 {font-size: 36px;}

}

@media (min-width: 1px) and (max-width: 450px) {

.slicknav_btn { margin: 77% 5px 11px 4%;}

.header h4 {font-size: 16px;}

}

@media (min-width: 1px) and (max-width: 425px) {

.slicknav_btn { margin: 94% 5px 11px 4%;}

.header h4 {font-size: 21px;}

}

@media (min-width: 1px) and (max-width: 410px) {

.slicknav_btn { margin: 96% 5px 11px 4%;}

h1 {font-size: 30px;}

}

@media (min-width: 1px) and (max-width: 380px) {

body {margin: 0 20px;}

#logo img {width: 55%;}

.slicknav_btn { margin: 109% 5px 11px 4%;}

h5 {font-size: 17px;}

}

@media (min-width: 1px) and (max-width: 360px) {

.slicknav_btn { margin: 111% 5px 11px 4%;}

ul.schnellzugriff {width: 80%;}

}

@media (min-width: 1px) and (max-width: 340px) {

#footer p{ width:100%; margin-bottom: 0;}
#footer .row{ margin-bottom:30px;}

#menu-inner-right img {
    width: 81%;
    margin-top: 12px;
}

.slicknav_btn {margin: 115% 5px 11px 4%;}

}

@media (min-width: 1px) and (max-width: 325px) {

#logo img {width: 65%;}

h1 {font-size: 27px;}

.slicknav_btn {margin: 107% 5px 11px 4%;}
.slicknav_menu{width:65%;}

ul.schnellzugriff {width: 100%;}

p{ font-size:15px;}

}

@media (min-width: 1px) and (max-width: 300px) {

.slicknav_btn {margin: 110% 5px 11px 4%;}

#footer li {
    width: 75%;
	display:block;
}

#footer li a {
    text-align: left;
    padding: 12px 0 12px 20px;
}

}

@media (min-width: 1px) and (max-width: 280px) {

.header h4 {font-size: 18px;}

h1{font-size:23px;}

}

@media (min-width: 1px) and (max-width: 260px) {

p{ font-size:14px;}

.slicknav_btn {margin: 113% 5px 11px 4%;}

#footer li a {padding: 10px 0 10px 20px;}

h5 {font-size: 15px;}

}

@media (min-width: 1px) and (max-width: 260px) {

#logo img{width: 80%;}

.header h4 {font-size: 14px;}

.slicknav_btn {margin: 118% 5px 11px 4%;}

}

@media (min-width: 1px) and (max-width: 215px) {

.slicknav_btn {margin: 125% 5px 11px 4%;}

}