.dienstleistungsbild1 {
	position: relative;
    height: 10vw;
    background-size: cover;
    background-position: center;
    width: 10vw;
    float: left;
    margin: 0 3% 0 0;
}

.showtime-default .showtime-image a {
    -ms-flex-item-align: auto;
    -ms-grid-row-align: auto;
    align-self: auto;
}

a.lightbox {
    position: absolute;
    z-index: 3;
    width: 2em;
    height: 2em;
	left: auto;
    right: 1em;
    bottom: 1.5em;
    background-image: url(../images/plus-circle.svg);
    background-size: cover;
    cursor: pointer;
    transition: all ease 0.5s;
}

.lb-outerContainer {
    top: 5em;
}

/* ---- RESET - Resets default browser CSS.  --------------- */

html {
  margin:0;
  padding:0;
  border:0;
}
body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
article, aside, details, figcaption, figure, dialog,
footer, header, hgroup, menu, nav, section {
    display:block;
}
body {
  line-height: 1.5;
  background: white;
}
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  text-align: left;
  font-weight: normal;
  float:none !important;
}
table, th, td {
  vertical-align: middle;
}
blockquote:before, blockquote:after, q:before, q:after { content: ''; }
blockquote, q { quotes: "" ""; }
a img { border: none; }
:focus { outline: 0; }

/* END Reset */




/* ----------   ///// WHIZZZ /////  ---------------- */


/* ///// FONTS ///// */

@font-face {
  font-family: 'fontname';
  src: url('../css/fonts/fontname.eot'); /* IE9 Compat Modes */
  src: url('../css/fonts/fontname.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../css/fonts/fontname.woff') format('woff'), /* Pretty Modern Browsers */
       url('../css/fonts/fontname.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../css/fonts/fontname.svg#svgfontname') format('svg'); /* Legacy iOS */
}


/* ///// LOGO ///// */

#logo {
    position: relative;
    display: block;
    float: left;
    max-width: 420px;
    z-index: 999;
    transition: all ease .5s;
}

.logo {
    width: 25vw;
    position: absolute;
    top: 10px;
    z-index: 1000;
    transition: all ease .5s;
}


/* ///// NAVIGATION ///// */

#navigation {
    position: relative;
    display: block;
    float: right;
    width: auto;
}


/* ///// CONTACT ICONS ///// */

#contact-icons {
    position: absolute;
    right: 2%;
    top: 0;
    width: 65px;
    background: #00a039;
    z-index: 1000;
}

#contact-icons:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    left: 0;
    bottom: -10px;
    border-style: solid;
    border-width: 10px 32.5px 0 32.5px;
    border-color: #00a038 transparent transparent transparent;
}

.phone {
    position: relative;
    float: left;
    width: 65px;
    transition: all ease .5s;
    display: flex;
    justify-content: center;
}

.phone.is-hovered {
    background: #137869;
}

.phone img {
    padding: 10px 0px 10px 0px;
    max-height: 20px;
    transition: all ease .5s;
}

.phone span {
    display: none;
    position: absolute;
    background: #884f33;
    left: -154px;
    top: 0;
    padding: 13px 20px 13px 20px;
    color: #fff !important;
    text-transform: uppercase;
    opacity: 0;
}

.phone span.is-hovered {
    display: block;
    opacity: 1;
	-webkit-animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
	        animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.mail {
    position: relative;
    float: left;
    width: 65px;
    transition: all ease .5s;
    display: flex;
    justify-content: center;
}

.mail.is-hovered {
    background: #137869;
}

.mail img {
    padding: 10px 0px 10px 0px;
    max-height: 20px;
    transition: all ease .5s;
}

.mail span {
    display: none;
    position: absolute;
    background: #884f33;
    left: -234px;
    top: 0;
    padding: 13px 20px 13px 20px;
    color: #fff;
    text-transform: uppercase;
    opacity: 0;
}

.mail span.is-hovered {
    display: block;
    opacity: 1;
	-webkit-animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
	        animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.map {
    position: relative;
    float: left;
    width: 65px;
    transition: all ease .5s;
    display: flex;
    justify-content: center;
}

.map.is-hovered {
    background: #137869;
}

.map img {
    padding: 10px 0px 10px 0px;
    max-height: 20px;
    transition: all ease .5s;
}

.map span {
    display: none;
    position: absolute;
    background: #884f33;
    left: -105px;
    top: 0;
    padding: 12px 20px 12px 20px;
    color: #fff;
    text-transform: uppercase;
    opacity: 0;
}

.map span.is-hovered {
    display: block;
    opacity: 1;
	-webkit-animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
	        animation: swing-in-right-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}



/* ----------------------------------------------
 * Generated by Animista on 2018-7-11 15:14:33
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation swing-in-right-fwd
 * ----------------------------------------
 */
@-webkit-keyframes swing-in-right-fwd {
  0% {
    -webkit-transform: rotateY(-100deg);
            transform: rotateY(-100deg);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
}
@keyframes swing-in-right-fwd {
  0% {
    -webkit-transform: rotateY(-100deg);
            transform: rotateY(-100deg);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
            transform: rotateY(0);
    -webkit-transform-origin: right;
            transform-origin: right;
    opacity: 1;
  }
}










/* ///// SLIDER ///// */

#slider {
    position: relative;
    display: block;
    width: auto;
    height: 100%;
    background: #fff;
    margin-top: 4%;
    overflow: hidden;
}

#slider-overlay {
    position: absolute;
    content: "";
    background-image: url(../images/slider-overlay.svg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 102%;
    margin-left: -1%;
    height: 10%;
    bottom: -1px;
    z-index: 1000;
}


#slider .slick-slider .slick-track, #slider .slick-slider .slick-list {
    height: 100%;
}

#slideshow .introimage {
    position: relative;
    width: 100%;
    height: 50vw;
    top: 0;
    background-size: cover;
    background-position: center center;
    z-index: 1;
}

#slideshow .introimage.is-full-width {
    width: 100vw;
}

#slider .slick-slide {
    margin: 0;
}

#slider .slick-next {
    width: 45px;
    height: 45px;
    top: 290px !important;
    right: 40px !important;
    margin-left: 45px;
    z-index: 1000;
}

#slider .slick-next:before {
    content: '' !important;
    background-image: url(../images/large_right.png);
    background-size: cover;
    position: absolute;
}

#slider .slick-prev {
    width: 45px;
    height: 45px;
    top: 290px !important;
    right: 100px !important;
    z-index: 1000;
}

#slider .slick-prev:before {
    content: '' !important;
    background-image: url(../images/large_left.png);
    background-size: cover;
    position: absolute;
}



.tp-rightarrow.default {
    z-index: 100;
    cursor: pointer;
    position: relative;
    background: url(../images/large_right.png) no-repeat 0 0;
    width: 45px;
    height: 45px;
    top: 310px !important;
    right: 40px !important;
    z-index: 1002;
}

.tp-rightarrow.default:hover {
    background: url(../images/large_right.png) no-repeat 0 bottom;
}

.tp-leftarrow.default {
    z-index: 100;
    cursor: pointer;
    position: relative;
    background: url(../images/large_left.png) no-repeat 0 0;
    width: 45px;
    height: 45px;
    top: 310px !important;
    right: 100px !important;
    left: auto !important;
    z-index: 1002;
}

.tp-leftarrow.default:hover {
    background: url(../images/large_left.png) no-repeat 0 bottom;
}


#scrolldown {
    position: absolute;
    display: block;
    z-index: 1001;
    margin-left: auto;
    margin-right: auto;
    bottom: 120px;
    left: 0;
    right: 0;
    width: 50px;
    height: 50px;
    transition: all 250ms ease-in;
    cursor: pointer;
    opacity: 0.8;
}



/* ///// SLIDER CLAIM ///// */


#slider-claim {
    position: absolute;
    right: 0;
    top: 110px;
    background-image: url(../images/claim-bg.svg);
    background-position: center center;
    background-size: cover;
    padding: 40px 120px 40px 50px;
    z-index: 1000;
    opacity: 0.9;
}

span.claim-brown {
    font-family: "point-black";
    font-size: 6em;
    color: #702800;
    text-transform: uppercase;
}

span.claim-green {
    font-family: "point-black";
    font-size: 6em;
    color: #00a039;
    text-transform: uppercase;
    line-height: 1em;
}

.slider-claim-small {
    font-family: "point-light";
    font-size: 1.2em;
    color: #00a039;
    text-transform: uppercase;
    letter-spacing: 4px;
}



/* ///// INTROTEXT FAMILIENUNTERNEHMEN ///// */


#familienunternehmen {
    position: relative;
    width: 60%;
    padding: 20% 0% 7% 20%;
    padding-right: 20%;
    padding-top: 4%;
    float: left;
    background: #fff;
}

#familienunternehmen h1 {
    padding: 14% 0px 3% 0px;
    background-image: url(../images/bg-familienunternehmen.svg);
    background-size: contain;
    background-position: center bottom;
    background-repeat: no-repeat;
    text-align: center;
}

#familienunternehmen h4 {
    color: #702800;
    font-family: "point-bold";
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
    font-size: 2vw;
    line-height: 3vw;
    border-bottom: solid 2px #702800;
    border-top: none;
    padding: 45px 0px 20px 0px;
    display: table;
    margin-left: auto;
    margin-right: auto;
}

#familienunternehmen p {
    color: #6f2900;
    text-align: center;
}


/* ///// BANNER ANFRAGE ///// */


#banner-anfrage {
    position: relative;
    width: 60%;
    padding: 3% 20% 3% 20%;
    margin-top: -10px;
    background: #00a13a;
    font-family: "point-light";
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    float: left;
}

.anfrage-text {
    width: 40%;
    float: left;
}

.anfrage-button {
    width: 60%;
    float: right;
    margin-top: 26px;
}


/* ///// DIENSTLEISTUNGEN ///// */


#dienstleistungen {
    position: relative;
    width: 100%;
    padding: 0% 0% 0% 0%;
    float: left;
    background: #fff;
    margin-bottom: -5px;
}

#dienstleistungen .introimage {
    float: left;
    width: 50%;
    overflow: hidden;
    position: relative;
    height: 53vw;
}

#dienstleistungen .introimage img {
    min-height: 100%;
    min-width: 100%;
    width: 140%;
    height: auto;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all ease .5s;
}

#dienstleistungen .introtext {
    float: right;
    width: 40%;
    padding: 5% 5% 5% 5%;
}

#dienstleistungen p {
    font-family: "point-book";
    color: #02a13a;
}

.cwgallery {
    margin: 0px;
}

.cwgallery .gallery a > span {
    border: 0px solid transparent !important;
}


.cwgallery .gallery a {
    width: 28% !important;
    margin: 0 5% 5% 0;
}


/* ///// DIENSTLEISTUNGEN HAUSGRAFIK ///// */


#dienstleistungen-titel {
    position: relative;
    display: block;
    width: 50%;
    float: right;
    margin-top: 220px;
    margin-bottom: 30px;
}

#dienstleistungen-titel h2 {
    color: #b2b2b2;
    font-size: 2.0em;
}

#dienstleistungen-titel h1 {
    color: #b2b2b2;
    font-size: 2.0em;
}


#dienstleistungen-haus {
    position: relative;
    width: 100%;
    padding: 0% 0% 0% 0%;
    float: left;
    margin-bottom: 100px;
}

#haus {
    position: absolute;
    width: 35%;
    display: block;
    float: left;
    z-index: 1000;
    margin-top: -80px;
}








#dienstleistungen-container {
    position: relative;
    width: 100%;
    display: block;
    float: right;
    padding: 2% 0% 0% 0%;
    right: 0;
    background: #ededed;
}

#dienstleistungen-slider {
    position: relative;
    width: 60%;
    display: block;
    float: right;
     padding: 2% 0% 8% 40%;
}

.custom.link-referenzen {
    position: absolute;
    bottom: 7%;
    margin-left: 10%;
}



/* ///// RESTAURIERUNGEN ///// */

#restaurierungen {
    position: relative;
    display: block;
    width: 100%;
    float: right;
    padding: 0 0 0 0;
    margin-top: 0;
    margin-bottom: 5%;
}

#restaurierungen .introimage {
    float: right;
    width: 50%;
}

#restaurierungen .introtext {
    float: left;
    width: 32%;
    padding: 4%;
    background: #ededed;
    margin-left: 10%;
}

#restaurierungen h1.newsflash-title {
    margin-bottom: 6%;
}

#denkmalpflege {
    position: relative;
    display: block;
    width: 100%;
    float: left;
    padding: 0 0 0 0;
    margin-bottom: 5%;
}

#denkmalpflege .introimage {
    float: left;
    width: 50%;
}

#denkmalpflege .introtext {
    float: right;
    width: 32%;
    padding: 4%;
    background: #ededed;
    margin-right: 10%;
}

#denkmalpflege h1.newsflash-title {
    margin-bottom: 6%;
}



/* ///// REFERENZEN ///// */

#referenzen-home {
    position: relative;
    width: 95%;
    padding: 5% 0% 5% 5%;
    float: left;
    background: #ededed;
    margin-bottom: -10px;
}

#referenzen-titel {
    position: relative;
    width: 40%;
    padding: 0% 0% 0% 0%;
    float: left;
}

#referenzen-auswahl {
    position: relative;
    width: 48%;
    padding: 0% 5% 0% 5%;
    float: right;
}

#referenzen #beitrag, #referenzen-auswahl #beitrag {
    margin: 2%;
    flex: 0 46%;
}

#referenzen-auswahl .newsflash {
    display: flex;
    flex-wrap: wrap;
}

#referenzen .introtext, #referenzen-auswahl .introtext {
    background: #fff;
    padding: 20px;
}

#referenzen-auswahl .introimage {
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
    transition: all ease .5s;
}


/* ///// REFERENZEN ///// */

#referenzen-header {
    position: relative;
    width: 100%;
    display: block;
    float: left;
}

#referenzen-header .custom {
    padding: 12% 7% 3%;
    background-size: cover;
    background-position: center center;
}

#referenzen-header h2 {
    color: #fff;
    font-size: 3.0em;
}

#referenzen-header h1 {
    color: #fff;
    font-size: 4.0em;
}

#referenzen {
    position: relative;
    width: 100%;
    display: block;
    float: left;
    padding: 0% 0% 7% 0%;
}

#referenzen .newsflash {
    display: flex;
    flex-wrap: wrap;
}

#referenzen .referenzen-alle #beitrag, 
#referenzen .referenzen-gipserarbeiten #beitrag, 
#referenzen .referenzen-restaurierungen #beitrag, 
#referenzen .referenzen-stuckaturen #beitrag, 
#referenzen .referenzen-fassaden #beitrag, 
#referenzen .referenzen-unterlagsboden #beitrag,
#referenzen .referenzen-denkmalpflege #beitrag {
    flex: 0 29%;
}

#referenzen #beitrag, #referenzen-auswahl #beitrag {
    margin-bottom: 3%;
}

#referenzen .introimage {
    position: relative;
    width: 100%;
    height: 300px;
    overflow: hidden;
    transition: all ease .5s;
}

#referenzen .introimage img, #referenzen-auswahl .introimage img {
    min-height: 100%;
    min-width: 100%;
    width: 120%;
    height: auto;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all ease .5s;
}

#referenzen .introimage:hover img, #referenzen-auswahl .introimage:hover img {
    opacity: 0.4;
    transform: translate(-50%, -50%) scale(1.2);
}

#referenzen .introimage:hover, #referenzen-auswahl .introimage:hover {
    background: #00a13a;
    color: #fff;
    opacity: 1;
}

#referenzen .introimage .link-button, #referenzen-auswahl .introimage .link-button {
    color: #fff;
    font-family: "point-bold";
    text-transform: uppercase;
    letter-spacing: 2px;
    position: absolute;
    text-align: center;
    top: 50%;
    margin-top: -30px;
    border: solid 3px #fff;
    padding: 8px 25px 8px 25px;
    left: 50%;
    margin-left: -100px;
    z-index: 1;
    transition: all ease .5s;
    display: none;
}

#referenzen .introimage .link-button:after, #referenzen-auswahl .introimage .link-button:after {
    content: "";
    position: absolute;
    width: 0px;
    height: 30px;
    border: solid 3px #fff;
    background-image: url(../images/button-white-arrow.svg);
    background-size: 17px;
    padding: 0px 30px 4px 30px;
    margin-left: 25px;
    margin-top: -11px;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all ease .5s;
}

#referenzen .introimage:hover .link-button, #referenzen-auswahl .introimage:hover .link-button {
    display: block;
}

#referenzen .introimage:hover .link-button:hover, #referenzen-auswahl .introimage:hover .link-button:hover {
    color: #fff;
    background: #00a039;
}

#referenzen .introtext {
    background: #ededed;
    padding: 20px;
}

#referenzen h3, #referenzen-auswahl h3 {
    color: #00a13a;
    text-align: center;
    text-transform: uppercase;
    font-family: "point-bold";
}

#referenzen h4, #referenzen-auswahl h4 {
    color: #878787;
    text-align: center;
    text-transform: uppercase;
    font-family: "point-bold";
    border-top: none;
    display: block;
    padding: 0;
    margin-top: 0;
    font-size: 16px;
    line-height: 22px;
}


#referenzen-filter {
    position: relative;
    width: 93%;
    display: block;
    float: left;
    text-align: center;
    margin: 0% 0% 7% 0%;
    padding: 0% 0% 0% 7%;
    font-family: "point";
    background: #ededed;
}

.item-page.referenzen-detail .page-header {
    margin-bottom: 4%;
}

.referenzen-filter {
    text-align: center;
}

.filter-alle, .filter-gipserarbeiten, .filter-restaurierungen, .filter-stuckaturen, .filter-fassaden, .filter-unterlagsboden, .filter-denkmalpflege {
    font-family: "point";
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #00a039;
    float: left;
    padding: 2%;
    cursor: pointer;
    transition: all ease .5;
}

.filter-alle:hover, .filter-gipserarbeiten:hover, .filter-restaurierungen:hover, .filter-stuckaturen:hover, .filter-fassaden:hover, .filter-unterlagsboden:hover, .filter-denkmalpflege:hover {
    color: #fff;
    background: #9d9d9c;
    font-family: "point-bold";
}

.filter-active {
    font-family: "point-bold";
    color: #fff;
    background: #9d9d9c;
    padding: 2%;
}

.filter-denkmalpflege {
    border-right: none;
}

.referenzen-alle {
        	-webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-fwd 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.referenzen-gipserarbeiten, .referenzen-restaurierungen, .referenzen-stuckaturen, .referenzen-fassaden, .referenzen-unterlagsboden, .referenzen-denkmalpflege {
    display: none;
    	-webkit-animation: fade-in-fwd 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-fwd 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.get-active {
    display: block;
    opacity: 1;
	-webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.get-inactive {
    display: none;
}

#referenzen-filter h2 {
    border-bottom: solid 1px #cccccc;
}



/* ----------------------------------------------
 * Generated by Animista on 2018-8-9 10:24:5
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-in
 * ----------------------------------------
 */
@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}





/* ///// TEAM ///// */

#team-header {
    position: relative;
    width: 100%;
    display: block;
    float: left;
}

#team-header .custom {
    padding: 15% 9% 5%;
    background-size: cover;
    background-position: center center;
}

#team-header h2 {
    color: #fff;
    font-size: 3.0em;
}

#team-header h1 {
    color: #fff;
    font-size: 4.0em;
}

#team-claim {
    position: relative;
    width: 57%;
    display: block;
    float: left;
    background: #ededed;
    padding: 4% 20% 4% 23%;
    color: #00a03b;
    font-size: 1.4em;
    line-height: 1.5em;
     margin-bottom: 5%;
}

#team-claim:before {
    content: "";
    position: absolute;
    background-image: url(../images/team.svg);
    background-size: cover;
    width: 200px;
    height: 100px;
    left: 8%;
    top: 22%;
}

#team {
    position: relative;
    width: 100%;
    display: block;
    float: left;
    padding: 0% 0% 7% 0%;
}

#team .newsflash {
    display: flex;
    flex-wrap: wrap;
}

#team #beitrag {
    margin: 3%;
    flex: 0 27%;
}

#team .introimage img {
    width: 100%;
}

#team .introtext {
    background: #ededed;
    padding: 20px;
     margin-top: -4px;
}

#team h3 {
    color: #00a13a;
    text-align: center;
    text-transform: uppercase;
    font-family: "point-bold";
}

#team h4 {
    display: block;
    text-align: center;
    font-family: "point";
    font-size: 16px;
    margin-top: 10px;
    padding: 16px;
    line-height: 24px;
}




/* ///// KONTAKT ///// */

#kontakt-titel {
    position: relative;
    display: block;
    float: left;
    margin-top: 220px;
    margin-bottom: 5%;
}

#kontakt {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    width: 80%;
    padding: 5% 10% 5% 10%;
    background: #ededed;
     margin-bottom: 5%;
}

#kontakt h3 {
    font-family: "point-bold";
    font-size: 1.5em;
    line-height: 1em;
    color: #02a13a;
    text-transform: uppercase;
    border-bottom: solid 1px #fff;
    margin-bottom: 15px;
     padding-bottom: 15px;
}

#kontakt-adresse, #kontakt-oeffnungszeiten, #kontakt .logo-white {
    flex: 0 20%;
    margin: 2%;
}


#kontakt p, #kontakt a {
    color: #02a13a;
}

#kontakt a:hover {
    color: #000;
}

.schaufel {
    position: relative;
    flex: 0 20%;
    margin-left: -7%;
    margin-top: -8%;
    max-width: 27%;
}

.schaufel img {
    width: 27vw;
}

#kontakt-formular {
    position: relative;
    float: left;
    width: 45%;
    padding: 0 5% 0 0;
}

#kontakt-formular h3 {
    font-family: "point";
    font-size: 3em;
    text-transform: uppercase;
    color: #01a13a;
    line-height: 1;
}

#kontakt-formular h4 {
    font-family: "point-bold";
    font-size: 3em;
    text-transform: uppercase;
    color: #01a13a;
    line-height: 1em;
    border-top: none;
    padding: 0;
    margin-top: 0;
}

/* ///// FOX CONTACT ///// */

div#fox-container-m121 .fox-form select, div#fox-container-m121 .fox-form textarea, div#fox-container-m121 .fox-form input[type="text"], div#fox-container-m121 .fox-form input[type="email"] {
    border-radius: 0px;
    color: #555555;
    background-color: #ffffff;
    padding: 3%;
    border: solid 1px #706f6f;
}

div#fox-container-m121 .btn {
    background: #01a13a;
    transition: all ease .5s;
}

div#fox-container-m121 .btn, div#fox-container-m121 .btn span {
    color: #ffffff;
    text-shadow: none;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    border: none;
    border-radius: 0;
    background-image: none;
     padding: 2% 3% 2% 3%;
}

div#fox-container-m121 .btn:hover {
    background: #706f6f;
}

div#fox-container-m121 .fox-form input[type="text"]:hover, div#fox-container-m121 .fox-form input[type="email"]:hover, div#fox-container-m121 .fox-form textarea:hover, div#fox-container-m121 .fox-form input[type="text"]:focus, div#fox-container-m121 .fox-form input[type="email"]:focus, div#fox-container-m121 .fox-form textarea:focus {
    background-color: #ededed;
}


/* ///// KONTAKT BILD ///// */

#kontakt-bild {
    position: relative;
    float: right;
    width: 30%;
    padding: 10%;
}


/* ///// KONTAKT MAP KARTE LAGEPLAN ///// */

#kontakt-map {
    position: relative;
    float: left;
    width: 100%;
}

#kontakt-map h3 {
    padding: 2% 10% 2% 2%;
    background: #00a03b;
    color: #fff;
    text-align: right;
    text-transform: uppercase;
    font-size: 2em;
}




/* ///// FOOTER ///// */


#footer {
    position: relative;
    width: 90%;
    padding: 7% 0% 7% 10%;
    margin-top: -15px;
    float: left;
    background: #02a13a;
    color: #fff;
}

#footer h3 {
    font-family: "point-bold";
    color: #fff;
    text-transform: uppercase;
    border-bottom: solid 1px #fff;
    margin-bottom: 15px;
}

#footer p, #footer a, #footer ul.menu a, #footer span.separator {
    font-size: 1em;
    color: #fff;
    text-decoration: none;
    padding: 0;
    transition: all ease .5s;
}



#footer a:hover {
    color: #ededed;
}

.logo-white {
    position: relative;
    width: 21vw;
    top: 0px;
    z-index: 1000;
    float: left;
    margin-right: 5%;
    left: 2%;
}

.logo-white img {
    width: 18vw;
}

#footer-kontakt {
    position: relative;
    width: 17%;
    padding: 0% 2% 0% 0%;
    float: left;
}

#footer-oeffnungszeiten {
    position: relative;
    width: 17%;
    padding: 0% 2% 0% 0%;
    float: left;
}

#footer-menu {
    position: relative;
    width: 15%;
    padding: 0% 0% 0% 0%;
    float: left;
}

#footer-menu ul.menu li {
    float: none;
    margin: 0 0px 0 0px;
    padding: 6px 0px;
}



/* ///// COPYRIGHT ///// */


#copyright {
    position: relative;
    width: 100%;
    padding: 0%;
    float: left;
    color: #fff;
    text-align: center;
    color: #02a13a;
}

#copyright a {
    color: #02a13a;
    text-decoration: none;
    transition: all ease .5s;
}

#copyright a:hover {
    color: #702800;
}

#copyright p, #copyright a {
    font-size: 13px;
}


/* ///// BUTTON ///// */

a.button-white {
    color: #fff;
    font-family: "point-bold";
    text-transform: uppercase;
    border: solid 3px #fff;
    padding: 8px 25px 8px 25px;
    transition: all ease .5s;
}

a.button-white:after {
    content: "";
    position: absolute;
    width: 0px;
    height: 36px;
    border: solid 3px #fff;
    background-image: url(../images/button-white-arrow.svg);
    background-size: 17px;
    padding: 0px 28px 0px 28px;
    margin-left: 25px;
    margin-top: -9px;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all ease .5s;
}

a.button-white:hover {
    background: #fff;
    color: #00a13a;
}

a.button {
    color: #00a13a;
    font-family: "point-bold";
    text-transform: uppercase;
    border: solid 3px #00a13a;
    padding: 8px 25px 8px 25px;
    background: transparent;
    transition: all ease .5s;
}

a.button:after {
    content: "";
    position: absolute;
    width: 0px;
    height: 30px;
    border: solid 3px #00a13a;
    background-image: url(../images/button-arrow.svg);
    background-size: 17px;
    padding: 1px 30px 5px 30px;
    margin-left: 25px;
    margin-top: -9px;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all ease .5s;
}

a.button:hover {
    background: #00a13a;
    color: #fff;
}


/* ///// PARALLAX ///// */

#parallax {
    position: relative;
    display: block;
    width: 100%;
    float: left;
}

#parallax .custom {
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;;
    height: 100%;
    min-height: 500px;
}

#parallax p {
    color: #fff;
    font-size: 4vw;
    line-height: 5vw;
    text-transform: uppercase;
    font-family: "point-light";
}

.moduletable.parallax-rechts p {
    padding: 5% 10% 0% 60%;
}

.moduletable.parallax-links p {
    padding: 5% 60% 0% 10%;
}



/* ///// SCROLL TO TOP BUTTON ///// */

#scrolltotop {
    display: none;
    position: fixed;
    background-image: url("../images/scrolltotop.svg");
    bottom: 37px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 999;
    width: 40px;
    height: 40px;
    transition: all 100ms ease-in;
}

#scrolltotop:hover {
    background-image: url("../images/scrolltotop-hover.svg");
}



/* END WHIZZZ */



/* ----------   LAYOUT   ---------------- */

html {}

body {}

.introimage img {
    width: 100%;
}

.pull-left.item-image {
    width: 50%;
    float: left;
    padding: 0 2% 2% 0;
}

.item-page {
    padding: 20% 0% 5% 0%;
}


#mainWrapper {
    display: inline;
    float: left;
    width: 100%;
}

#container {
    display: inline;
    float: left;
    width: 86%;
    margin-left: 7%;
    margin-right: 7%;
}

#header {
    position: fixed;
    width: 100%;
    padding: 30px 0px 28px 0px;
    background: #fff;
    z-index: 10000;
    transition: all ease .5s;
}

#header.scrolled-nav {
    padding: 15px 0px 15px 0px;
}

#navigation a.scrolled-nav {
    padding: 17px 20px 18px 20px;
}

.logo.scrolled-nav {
    width: 14vw;
    top: 5px;
}

.phone.scrolled-nav, .mail.scrolled-nav, .map.scrolled-nav, .phone img.scrolled-nav,  .mail img.scrolled-nav, .map img.scrolled-nav {
    padding: 2px;
    width: 61px;
}

.phone span.scrolled-nav, .map span.scrolled-nav, .mail span.scrolled-nav {
     padding: 7px 20px 6px 20px;
}


.wideWrap {
    display: inline;
    float: left;
    width: 86%;
	padding-left: 7%;
	padding-right: 7%;
    background: #ebebeb;
}

#top {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}

#topLeft {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#topRight {
    background: none repeat scroll 0 0 transparent;
    float: right;
}

#rowA, #rowB, #rowC, #rowD, #rowE, #rowF, #rowG {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}


#NavWrapper {
    background: none repeat scroll 0 0 #DDDDDD;
    display: inline;
    float: left;
    margin: 0 0 5px;
    padding-bottom: 0;
    width: 100%;
}

#Nav {
    float: left;
    padding: 5px 0;
}

ul.menu {
    margin-left: 0;
}

ul.menu li {
    background: none repeat scroll 0 0 transparent;
    float: left;
    list-style: none outside none;
    margin: 0 10px 0 3px;
    padding: 0 4px;
}

ul.menu a {
    color: #666666;
    font-size: 18px;
    text-decoration: none;
	transition: all ease .5s;
}

ul.menu a:hover {
    text-decoration: none;
}

ul.menu li.active {
    text-decoration: none;
	color: red;
}


ul.menusideMenu {
    color: #666666;
    font-size: 20px;
    line-height: 25px;
    margin-left: 23px;
}

ul.menusideMenu li.active {
    text-decoration: none;
	color: red;
}


#breadcrumb {
    background: none repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    width: 100%;
}

.breadcrumbs {
    font-size: 12px;
    font-style: italic;
    margin-left: 10px;
}

#breadcrumbLeft {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#breadcrumbRight {
    background: none repeat scroll 0 0 transparent;
    float: right;
    text-align: right;
}

#mainrow {}

#left-col {
	float: left;

}

#left-col-cont {
}

#left-col-cont .moduletable {
	padding-bottom: 30px;
	margin-bottom: 20px;
}

#main-col {
    background: none repeat scroll 0 0 transparent;
    float: left;
}

#main-col-cont {
    background: none repeat scroll 0 0 transparent;
    padding: 0;
}

#right-col {
	float: right;
	width: 25%;
	margin-top: 20%;
}

#right-col-cont .moduletable {
	padding-bottom: 30px;
	margin-bottom: 20px;
}

#right-col-cont {
}

#adverttop {
    margin: 0 0 10px;
}

#advertBottom {
    margin: 10px 0px 15% 0;
}

#footWrapper{
    background: none repeat scroll 0 0 #DDDDDD;
    display: inline;
    float: left;
    width: 100%;
}

#debugRow { 
    display: inline;
    float: left;
}

#topLeft, #topRight {
    width: 470px;
}

#topRight {
    text-align: right;
}


#breadcrumb {
}

.cols-1 {
    display: block;
    float: none !important;
    margin: 0 !important;
}
.cols-2 .column-1 {
    float: left;
    width: 46%;
}
.cols-2 .column-2 {
    float: right;
    margin: 0;
    width: 46%;
}
.cols-3 .column-1 {
    float: left;
    margin-right: 4%;
    padding: 0 5px;
    width: 29%;
}
.cols-3 .column-2 {
    float: left;
    margin-left: 0;
    padding: 0 5px;
    width: 29%;
}
.cols-3 .column-3 {
    float: right;
    padding: 0 5px;
    width: 29%;
}
.items-row {
    margin-bottom: 10px !important;
    overflow: hidden;
}
.column-1, .column-2, .column-3 {
    padding: 10px 5px;
}


.span12 {
	width: 940px;
}
.span11 {
	width: 860px;
}
.span10 {
	width: 780px;
}
.span9 {
	width: 700px;
}
.span8 {
	width: 620px;
}
.span7 {
	width: 540px;
}
.span6 {
	width: 460px;
}
.span5 {
	width: 380px;
}
.span4 {
	width: 300px;
}
.span3 {
	width: 220px;
}
.span2 {
	width: 140px;
}
.span1 {
	width: 60px;
}
.offset12 {
	margin-left: 980px;
}
.offset11 {
	margin-left: 900px;
}
.offset10 {
	margin-left: 820px;
}
.offset9 {
	margin-left: 740px;
}
.offset8 {
	margin-left: 660px;
}
.offset7 {
	margin-left: 580px;
}
.offset6 {
	margin-left: 500px;
}
.offset5 {
	margin-left: 420px;
}
.offset4 {
	margin-left: 340px;
}
.offset3 {
	margin-left: 260px;
}
.offset2 {
	margin-left: 180px;
}
.offset1 {
	margin-left: 100px;
}
.row-fluid {
	width: 100%;
	*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
	display: table;
	content: "";
	line-height: 0;
}
.row-fluid:after {
	clear: both;
}
.row-fluid [class*="span"] {
	display: block;
	width: 100%;
	min-height: 28px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	margin-left: 2.127659574%;
	*margin-left: 2.0744680846383%;
}
.row-fluid [class*="span"]:first-child {
	margin-left: 0;
}
.row-fluid .controls-row [class*="span"] + [class*="span"] {
	margin-left: 2.127659574%;
}
.row-fluid .span12 {
	width: 99.99999999%;
	*width: 99.946808500638%;
}
.row-fluid .span11 {
	width: 91.489361693%;
	*width: 91.436170203638%;
}
.row-fluid .span10 {
	width: 82.978723396%;
	*width: 82.925531906638%;
}
.row-fluid .span9 {
	width: 74.468085099%;
	*width: 74.414893609638%;
}
.row-fluid .span8 {
	width: 65.957446802%;
	*width: 65.904255312638%;
}
.row-fluid .span7 {
	width: 57.446808505%;
	*width: 57.393617015638%;
}
.row-fluid .span6 {
	width: 48.936170208%;
	*width: 48.882978718638%;
}
.row-fluid .span5 {
	width: 40.425531911%;
	*width: 40.372340421638%;
}
.row-fluid .span4 {
	width: 31.914893614%;
	*width: 31.861702124638%;
}
.row-fluid .span3 {
	width: 23.404255317%;
	*width: 23.351063827638%;
}
.row-fluid .span2 {
	width: 14.89361702%;
	*width: 14.840425530638%;
}
.row-fluid .span1 {
	width: 6.382978723%;
	*width: 6.3297872336383%;
}
.row-fluid .offset12 {
	margin-left: 104.255319138%;
	*margin-left: 104.14893615928%;
}
.row-fluid .offset12:first-child {
	margin-left: 102.127659564%;
	*margin-left: 102.02127658528%;
}
.row-fluid .offset11 {
	margin-left: 95.744680841%;
	*margin-left: 95.638297862277%;
}
.row-fluid .offset11:first-child {
	margin-left: 93.617021267%;
	*margin-left: 93.510638288277%;
}
.row-fluid .offset10 {
	margin-left: 87.234042544%;
	*margin-left: 87.127659565277%;
}
.row-fluid .offset10:first-child {
	margin-left: 85.10638297%;
	*margin-left: 84.999999991277%;
}
.row-fluid .offset9 {
	margin-left: 78.723404247%;
	*margin-left: 78.617021268277%;
}
.row-fluid .offset9:first-child {
	margin-left: 76.595744673%;
	*margin-left: 76.489361694277%;
}
.row-fluid .offset8 {
	margin-left: 70.21276595%;
	*margin-left: 70.106382971277%;
}
.row-fluid .offset8:first-child {
	margin-left: 68.085106376%;
	*margin-left: 67.978723397277%;
}
.row-fluid .offset7 {
	margin-left: 61.702127653%;
	*margin-left: 61.595744674277%;
}
.row-fluid .offset7:first-child {
	margin-left: 59.574468079%;
	*margin-left: 59.468085100277%;
}
.row-fluid .offset6 {
	margin-left: 53.191489356%;
	*margin-left: 53.085106377277%;
}
.row-fluid .offset6:first-child {
	margin-left: 51.063829782%;
	*margin-left: 50.957446803277%;
}
.row-fluid .offset5 {
	margin-left: 44.680851059%;
	*margin-left: 44.574468080277%;
}
.row-fluid .offset5:first-child {
	margin-left: 42.553191485%;
	*margin-left: 42.446808506277%;
}
.row-fluid .offset4 {
	margin-left: 36.170212762%;
	*margin-left: 36.063829783277%;
}
.row-fluid .offset4:first-child {
	margin-left: 34.042553188%;
	*margin-left: 33.936170209277%;
}
.row-fluid .offset3 {
	margin-left: 27.659574465%;
	*margin-left: 27.553191486277%;
}
.row-fluid .offset3:first-child {
	margin-left: 25.531914891%;
	*margin-left: 25.425531912277%;
}
.row-fluid .offset2 {
	margin-left: 19.148936168%;
	*margin-left: 19.042553189277%;
}
.row-fluid .offset2:first-child {
	margin-left: 17.021276594%;
	*margin-left: 16.914893615277%;
}
.row-fluid .offset1 {
	margin-left: 10.638297871%;
	*margin-left: 10.531914892277%;
}
.row-fluid .offset1:first-child {
	margin-left: 8.510638297%;
	*margin-left: 8.4042553182766%;
}
[class*="span"].hide,
.row-fluid [class*="span"].hide {
	display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
	float: right;
}

.item-image img {
   width: 100%;
}


/* END LAYOUT */	
	

/* ----------   TYPOGRAPHY  ---------------- */

body {
	color: #333333;
	font-size: 14px; 
	line-height:18px;
	font-family: "point";
}

a {
    color: #444444;
    text-decoration: none;
	cursor: pointer;
    transition: all ease .5s;
}

a:hover {
    text-decoration: none;
    color: #e75d17;
}

.readmore a {
    text-decoration: none;
}

p {
    margin: 8px 0;
    font-size: 1.2em;
    line-height: 1.5em;
}

li {
    margin: 8px 0;
    font-size: 1.2em;
    line-height: 1.5em;
}

h1, .componentheading {
    font-family: "point-black";
    color: #00a13a;
    font-size: 3vw;
    letter-spacing: 1px;
    line-height: 1em;
    text-transform: uppercase;
}

h2, .contentheading, h2 a {
    font-family: "point-light";
    color: #00a13a;
    font-size: 3vw;
    letter-spacing: 1px;
    line-height: 1.5;
    text-transform: uppercase;
}

h3, .moduletable h3 {
    color: #444444;
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 22px;
}


h4 {
    color: #702800;
    font-family: "point-bold";
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.5vw;
    line-height: 2vw;
    border-top: solid 2px #702800;
    padding: 20px 0px 20px 0px;
    margin-top: 20px;
    display: table;
}

h5 {color: #ffffff;background: #333333;padding: 2px 0 2px 4px}
h6 {color: #ffffff;background: #999999;padding: 2px 0 2px 4px}

.breadcrumbs {font-size: 12px;font-style: italic; margin-left: 0;}

/* END TYPOGRAPHY */


/* ----------   MISC ELEMENTS ---------------- */

label {
    float: left;
    min-width: 122px;
}

ul {
    margin-left: 14px;
}

ul.actions {
    margin-left: 0;
}
	
ul.actions li {
    display: inline;
    list-style: none outside none;
    padding: 0;
}

#system-message dd.error ul {
    margin-left: 0;
	background-position: 5px 40%;
}

th {
    padding: 3px;
}

caption, th, td {
    padding: 2px 10px 2px 2px;
    text-align: left;
}

thead tr {
    background: none repeat scroll 0 0 #EEEEEE;
}


fieldset.filters {margin: 10px 0;}

div.current {
    border: 1px solid #CCCCCC;
    clear: both;
    padding: 10px;
}

dl.tabs dt {
    background: none repeat scroll 0 0 #F0F0F0;
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    color: #666666;
    float: left;
    margin-right: 3px;
    padding: 4px 10px;
}

dl.tabs dt.open {
    background: none repeat scroll 0 0 #F9F9F9;
    border-bottom: 1px solid #F9F9F9;
    color: #000000;
    z-index: 100;
}

div#sliders.pane-sliders div.panel h3#basic-details.title {
    padding: 2px 5px;
}


div.pane-slider {
    padding: 10px;
}

.panel {
    border: 1px solid;
    margin-top: -1px;
}


.contentpanel {
	margin:10px;
}

/* END MISC ELEMENTS */


/* ----------   DEVELOPER  ---------------- */


.moduletable.greybox {
    background: none repeat scroll 0 0 #dddddd;
    color: #FFFFFF;
    height: 100%;
    padding: 5px;
    width: auto;
}

.custom.greybox {
	padding: 5px;
	min-height: 140px;

}

.custom.greybox p {
    color: #666666;
    line-height: 18px;
    margin: 0;
}

.greybox2 {
    background: none repeat scroll 0 0 #DDDDDD;
    color: #FFFFFF;
    height: auto;
    padding: 0 3px;
    width: auto;
}

.greybox2 p {
    color: #666666;
    margin: 0;
    padding: 0;
}

p.righleftheight {height: 206px; }

.moduletablegreybox {
    background: none repeat scroll 0 0 #DDDDDD;
    min-height: 140px;
    padding: 5px;
    width: auto;
}

.moduletablegreybox p {
    color: #666666;
    line-height: 18px;
    margin: 0;
    padding: 5px;
}



@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */

  img[src$="haus.svg"] {
    height: 100%;
  }
  

.scrolled-nav.logo {
    width: 250px;
    top: -30px;
}




#referenzen .introimage .link-button:after, #referenzen-auswahl .introimage .link-button:after {
    background-image: url(../images/button-white-arrow-18.png);
    display: none;
}



a.button:after {
    background-image: url(../images/button-arrow-18.png);
        display: none;
}


a.button-white:after {
    background-image: url(../images/a-green.png);
        display: none;
}


}


/* END DEVELOPER */