/* =======================================
	Reset
======================================= */
* { padding: 0; margin: 0; }
body {
    position: relative;
    font-family: "Montserrat-Light", sans-serif;
    font-weight: 300;
    font-size: 100%;
    color: #615b49;
    background-color: white;
//    background-image: url(../img/bg_noise_white.png);
//    background-repeat: repeat;
}
#wrapper_header img, #wrapper_content img, #wrapper_footer img, #slider img  { width: 100%; height: auto; }


/* Typography   =========================== */
p { font-size: 0.938em; line-height: 1.5em; }
h1 { font-size: 1.75em; line-height: 1.25em; font-family: "Montserrat-Light", sans-serif; font-weight: 300; margin-bottom: 15px; }
h2 { font-size: 1.125em;; line-height: 1.5em; font-family: "Montserrat-Bold", sans-serif; font-weight: 700; margin-bottom: 5px; }
h3 { font-size: 1.25em; line-height: 1.25em; font-family: "Montserrat-Bold", sans-serif; font-weight: 700; clear: both; }
h4 { font-size: 1.25em; line-height: 1.125em; font-weight: normal; }
aside h3 { margin-bottom: 20px; }
aside h4 { margin-top: 30px; }

header { font-size: 1.125em; }
header ul { list-style-type: none; }
#wrapper_content ul { list-style-type: disc; margin-left: 0.75em; padding-left: 0.5em; }
#wrapper_content li { line-height: 1.5em; padding-bottom: 5px; }
#wrapper_content .flexslider ul { list-style-type: none; margin-left: 0; padding-left: 0; }
#wrapper_content .flexslider li { line-height: normal; padding-bottom: 0; }
#wrapper_content .login_warenkorb_container ul { list-style-type: none; margin-left: 0; padding-left: 0; color: #000000; }
#wrapper_content .login_warenkorb_container li { line-height: 1em; padding-bottom: 0; }

nav label i, #wrapper_content i, #wrapper_footer i { margin-right: 8px; }
.overview i { margin-left: 8px; }

strong { font-family: "Montserrat-Bold", sans-serif; font-weight: 700; }
sub, sup { line-height: 0; }


/* Linkverhalten   =========================== */
a:link, a:visited, a:active { color: #d09d02; border-bottom: none; text-decoration: none; }
a:focus, a:hover { color: #d09d02; border-bottom: 1px solid #d09d02; text-decoration: none; }

header a:link, header a:visited, header a:active { color: #918975; border-bottom: none; }
header a:focus, header a:hover { color: #cc9933; border-bottom: none; }
#logo a { display: block; position: relative; z-index: 50; }

.overview a:focus, .overview a:hover { color: #d09d02; border-bottom: none; text-decoration: none; opacity: 0.7; }
.thumbnail:focus, .thumbnail:hover { opacity: 0.7; }

.teaser a { line-height: 0; display: block; border-bottom: none; opacity: 0.7; }
.teaser a:focus, .teaser a:hover { border-bottom: none; text-decoration: none; opacity: 0.8; }

.nav_member a, .nav_warenkorb a { display: block; }
.nav_member a:link, .nav_member a:visited, .nav_member a:active, .nav_warenkorb a:link, .nav_warenkorb a:visited, .nav_warenkorb a:active { color: #999; text-decoration: none; }
.nav_member a:focus, .nav_member a:hover, .nav_warenkorb a:focus, .nav_warenkorb a:hover { color: #d09d02; text-decoration: none; border-bottom: none; }

footer a:link, footer a:visited, footer a:active { color: #f3ce5e; border-bottom: none; text-decoration: none; }
footer a:focus, footer a:hover { color: #f3ce5e; border-bottom: 1px solid #f3ce5e; text-decoration: none; }
footer .footer_icons a:focus, footer .footer_icons a:hover { border-bottom: none; }


/* Layout Header   =========================== */
#wrapper_header { position: absolute; top: 0; z-index: 10; width: 100%; background-color: rgba(255,255,255,0.9); }
header { position: relative; height: 80px; width: 92%; min-width: 300px; padding: 0 4%; }
#logo { position: absolute; top: 3px; max-width: 250px; }
#utility { position: absolute; right: 4%; top: 48px; }
#utility li { float: left; padding: 0 0 0 30px; transition-duration: 0.5s; }
#btn_warenkorb i { padding-right: 8px; }


/* Layout Content   ========================== */
#wrapper_content {
    position: relative;
    width: 92%;
    padding: 0 4% 30px 4%;
    min-width: 300px;
    background-color: white;
    // background-image: url(../img/bg_noise_white.png);
    // background-repeat: repeat;
    transition-duration: 0.25s;
    overflow: hidden;
}
#home #wrapper_content { padding: 0 4%; margin: 0 0 10px 0; border-top: none; }
.content { max-width: 1400px; margin: 0 auto; padding: 10px 0; overflow: hidden; transition-duration: 0.25s; }
.content_25 { padding: 10px 0; }
.content_50 { padding: 10px 0; }

.einspaltig { text-align: center; max-width: 700px; }
.zweispaltig .content_50 .content_25:nth-of-type(2n) { margin-bottom: 10px; border-bottom: 1px solid #CCC; }
.dreispaltig .content_25:nth-of-type(n) { width: 48%; margin-right: 4%; float: left; }
.dreispaltig .content_25:nth-of-type(2n) { margin-right: 0; }
.vierspaltig .overview { width: 48%; margin-right: 4%; float: left; }
.vierspaltig .overview:nth-of-type(2n) { margin-right: 0; margin-bottom: 0; }

.flex-container_3 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex_3 { flex: 100%;}

.flex-container_produktuebersicht { display: flex; flex-direction: row; flex-wrap: wrap; margin-left: -1%; margin-right: -1%; }
.flex_produktuebersicht { flex: 31.333333%; max-width: 31.333333%; margin: 0 1% 2% 1%; position: relative; padding-top: 23%; background-size:cover; background-position:center; }
.flex_produktuebersicht a { position: absolute; top: 0; width: 100%; height: 100%; display: block; }
.flex_produktuebersicht a:hover { background-color: rgba(0,0,0,0.25); transition-duration: 0.25s; }

#wrapper_footer { position: relative; min-width: 300px;

    // background-image: url(../img/bg_noise.png);
    background-color: rgb(142,135,116);

}
footer { width: 92%; padding: 20px 4% 60px 4%; max-width: 1400px; margin: 0 auto; color: #FFF; transition-duration: 0.25s; }
footer .content_25 { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #CCC; }
footer .content_25:last-of-type { border-bottom: none; }
.footer_icons { max-width: 200px; padding: 10px 0 15px 0; }


/* Extras   ========================== */ 
.overview { position: relative; }
.overview p { position: absolute; bottom: 0.85em; width: 100%; padding: 7px 0; display: table-cell; text-align: center; background-color: rgba(252, 251, 247, 0.9); font-size: 0.75em; line-height: 0.938em; }

.diashow { position: relative; padding-top: 56.25%; width: 100%; overflow: hidden; background-size:cover; background-position:center; }
#wrapper_content .diashow i { margin: 0; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); }
.next { position: absolute; right: 0; top: 0; font-size: 3em; }
.prev { position: absolute; left: 0; top: 0; font-size: 3em; }
.diashow-direction-nav a { display: block; border-bottom: none; color: #FFF; opacity: 0.6; }
.diashow .next a:hover, .diashow .prev a:hover, .diashow .next a:focus, .diashow .prev a:focus { text-decoration: none; opacity: 1; }

.right { float: right; padding: 0 0 20px 20px; }
.left { float: left; padding: 0 20px 20px 0; }
.clear { clear: both; }

#google_map { margin: 0 15% 0 0; }
.google_fluid_wrapper { position: relative; padding-bottom: 385px; /* Padding bestimmt Kartenformat */ height: 0; overflow: hidden; }
.google_fluid_wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 400px; border: none; }



/* Extras Home   ========================== */
.wrapper_startvideo { position: relative; width: 100%; height: 25%; margin-bottom: 20px; padding-top: 80px; overflow: hidden; }
#startvideo { width: 100%; height: 56.25%; }
video img { width: 100%; height: auto; }



/* =======================================
	Responsive
======================================= */
@media screen and (min-width: 1024px) {
header { height: 70px; }
#logo { top: 5px; max-width: 300px; }
#utility { top: 17px; }
#utility li { padding: 0 0 0 80px; }

.content { padding: 30px 0; overflow: hidden; }
.content:nth-of-type(1) { padding: 30px 0 0 0; }

.zweispaltig .content_50 { width: 48%; margin-right: 4%; float: left; }
.zweispaltig .content_50:nth-of-type(2n) { width: 48%; margin-right: 0; }
.zweispaltig .content_50 .content_25:nth-of-type(n) { width: 100%; margin-right: 0; border: none; float: none; }
#content_50 { padding: 10px 0; background-color: transparent; width: 48%; }
    
.dreispaltig .content_25:nth-of-type(n) { width: 30.666666%; margin-right: 4%; border-bottom: none; }
.dreispaltig .content_25:nth-of-type(3n) { margin-right: 0; }
    
.vierspaltig .content_25 { width: 48%; margin-right: 4%; float: left; }
.vierspaltig .content_25:nth-of-type(2n) { margin-right: 0; margin-bottom: 0; }

.flex-container_3 { margin-left: -1.25%; margin-right: -1.25%; }
.flex_3 { flex: 47.5%; max-width: 47.5%; margin: 0 1.25% 5% 1.25%; }
        
footer { overflow: hidden; clear: both; }
footer .content_25 { width: 48%; margin-right: 4%; float: left; }
footer .content_25:nth-of-type(2n) { margin-right: 0; }
footer .content_25:nth-of-type(3) { display:block; border-bottom: none; }

.overview p { bottom: 0.85em; font-size: 1.064em; line-height: 1.064em; }
.next { font-size: 4em; }
.prev { font-size: 4em; }
#google_map { margin: 0; }  

.wrapper_startvideo { padding-top: 0px; margin-bottom: 20px; }
}


@media screen and (min-width: 1024px) {
p { font-size: 1.125em; }
h1 { font-size: 2.125em; }
#content_container li { font-size: 1em; }
#wrapper_header { position: fixed; }

.vierspaltig .overview:nth-of-type(n) { width: 22%; margin-right: 4%; border-bottom: none; }
.vierspaltig .overview:last-of-type { margin-right: 0; }

.flex-container_3 { margin-left: -1%; margin-right: -1%; }
.flex_3 { flex: 31.333333%; max-width: 31.333333%; margin: 0 1% 30px 1%; }
    
}


@media screen and (min-width: 1400px) {
.zweispaltig .content_50 { width: 48%; margin-right: 4%; float: left; }
.zweispaltig .content_50:nth-of-type(2n) { margin-right: 0; }
.zweispaltig .content_50 .content_25:nth-of-type(n) { width: 48%; margin-right: 4%; float: left; }
.zweispaltig .content_50 .content_25:nth-of-type(2n) { margin-right: 0; }
.vierspaltig .content_25:nth-of-type(n) { width: 22%; margin-right: 4%; border-bottom: none; }
.vierspaltig .content_25:last-of-type { margin-right: 0; }

footer .content_25:nth-of-type(n) { width: 22%; margin-right: 4%; border-bottom: none; }
footer .content_25:last-of-type { margin-right: 0; }

.next { font-size: 6em; }
.prev { font-size: 6em; }
}


/* Mobile only   =========================== */
@media only screen and (max-width: 1024px) and (orientation: portrait) {
#wrapper_header { position: fixed; top: 0; }
}

@media only screen and (max-width: 1024px) and (orientation: landscape) {
    #wrapper_header { position: fixed; }
}