/*
		19.03.2019 Kay Aufnahme Klasse seo_zweibutton
*/
.button_box:after {
    content: "";
    display: block;
    clear: both;
}
#text_inhalt * {box-sizing:border-box;}
#text_inhalt h2 {margin: 2em 0;}
#text_inhalt article h2 { margin-top:0;}
#text_inhalt article + div {
    margin: 10px auto;
}
.teaserbox_wrap {text-align:center;}
.teaserbox { width:49%;display:inline-block;position:relative;}
.teaserbox.einsam {
    width: 100%;
}

h2.farbuebersicht, h2.eignunguebersicht {position:relative;border-bottom: 1px solid #eee;}
h2.farbuebersicht:after {background: rgba(0, 0, 0, 0) url("/bilder/seo/farbeimer.svg") repeat scroll 0 0 / 100% auto;
    content: "";
    display: inline-block;
    left: 0;
    right:0;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    top: -16px;
    height: 85px;
    width: 85px;}
h2.eignunguebersicht:after {background: rgba(0, 0, 0, 0) url("/bilder/seo/eigenschaften.svg") repeat scroll 0 0 / 100% auto;
    content: "";
    display: inline-block;
    left: 0;
    right:0;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    top: -16px;
    height: 85px;
    width: 85px;
}
    
.ab_preis {display:none;}
.haupaufschrift {
    color: #444;
    font-size: 30px;
    font-weight: 300;
}
.box_center {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 2px;
    bottom: 0;
    height: 190px;
    left: 0;
    margin: auto;
    min-height: 50%;
    padding: 2em 2.5em;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 70%;
}
	
	.box_center .explore.standard, .box_center .explore.standard:visited, .box_center .explore.standard:active {
    color: #3c455a;
}
.box_center .explore, .box_center .explore:visited, .box_center .explore:active {
    bottom: 1em;
    display: inline-block;
    left: 0;
    margin: 10px auto;
    position: absolute;
    right: 0;
    width: 200px;
}
.box_center .explore.mass:hover,
.box_center .explore.standard:hover, .explore:hover	{
			box-shadow: 4px 4px 2px 0px rgba(0,0,0,0.25);
			transition: 0.1s ease-in-out;
}
.explore {
    border: 1px solid #3c455a;
    border-radius: 3px;
    display: block;
    padding: 15px 25px;
    text-decoration: none;
	cursor:pointer;
}
div.seo.beliebte_kategorien a.explore:before {
    content:"» "
}
div.seo.beliebte_kategorien a.explore:after {
    content:" «"
}
a.explore:before, div.explore a:before {content:"» "}
a.explore:after, div.explore a:after {content:" «"}
.box_center .explore a:visited, .box_center .explore a:active, .box_center .explore a, .box_center .explore.mass, .box_center .explore.mass:visited, .box_center .explore.mass:active {
    background-color: #3c455a;
    color: #fff;
} 
div.explore a, div.explore a:visited, div.explore a:active, div.explore a:hover {
        color: #fff;
        text-decoration: none;
}

/*.box_center {max-width: 290px;}  Rollo */
.box_center {max-width: 300px;} /* balkonsicht, markisen plissee, schiebegardinen, lamellen, jalousie */
.einsam .box_center {max-width: 500px;}
.teaserbox > img, .seo.beliebte_kategorien > div > img {
    width: 98%;
}
.seo.beliebte_kategorien > div {max-width: 341px;margin:0 auto;}
.seo.beliebte_kategorien > div > img {max-width: 333px;margin:0 auto;}
.seo.eignunguebersicht ul {list-style:none;list-style-type:none;margin: 0;
    padding: 0;}
.seo.eignungsuebersicht ul li {background-size:50px 50px;}
.seo.farbuebersicht > ul {
list-style:none;
list-style-type:none;
-webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
    margin: 0
	}
.seo.farbuebersicht ul:after, .seo.eignunguebersicht:after, div.seo.beliebte_kategorien:after {content:"";display:block;clear:both;}
.seo.farbuebersicht li, .seo.eignunguebersicht ul li {
	list-style:none;
	list-style-type:none;
	vertical-align:middle;
	padding-left:60px;
	background-position:left center;
	background-repeat:no-repeat;
    cursor:pointer;
    background-size: 50px auto;
}


.seo.farbuebersicht ul li a, .seo.eignunguebersicht ul li a {
    color: #888;
    display: inline-block;
    text-decoration: none;
    padding: 2em 0;
    cursor:pointer;
}
div.seo.beliebte_kategorien .explore {
    background-color: rgba(0, 0, 0, 0.4);
    border: 1px solid #fff;
    bottom: 2em;
    color: #fff;
    font-size: 1.1em;
    right: 1em;
	position:absolute;
}

.seo_zweibutton {
		padding-top: 5px !important; 
		padding-bottom: 5px !important; 
		margin-top: 5px !important; 
		margin-bottom: 0px !important; 
		border-top-width: 0px !important; 
		position: relative !important; 
		bottom: 0.2em !important;
		font-size: 0.9em !important;
}

.seo.farbuebersicht li.weiss { background-image:url(/bilder/seo/tropfen-weiss.svg)}
.seo.farbuebersicht li.grau { background-image:url(/bilder/seo/tropfen-grau.svg)}
.seo.farbuebersicht li.beige { background-image:url(/bilder/seo/tropfen-beige.svg)}
.seo.farbuebersicht li.gelb { background-image:url(/bilder/seo/tropfen-gelb.svg)}
.seo.farbuebersicht li.orange { background-image:url(/bilder/seo/tropfen-orange.svg)}
.seo.farbuebersicht li.rot { background-image:url(/bilder/seo/tropfen-rot.svg)}
.seo.farbuebersicht li.violett { background-image:url(/bilder/seo/tropfen-violett.svg)}
.seo.farbuebersicht li.blau { background-image:url(/bilder/seo/tropfen-blau.svg)}
.seo.farbuebersicht li.gruen { background-image:url(/bilder/seo/tropfen-gruen.svg)}
.seo.farbuebersicht li.braun { background-image:url(/bilder/seo/tropfen-braun.svg)}
.seo.farbuebersicht li.schwarz { background-image:url(/bilder/seo/tropfen-schwarz.svg)}
.seo.farbuebersicht li.rosa { background-image:url(/bilder/seo/tropfen-rosa.svg)}
.seo.farbuebersicht li.silber { background-image:url(/bilder/seo/tropfen-silber.svg)}
.seo.farbuebersicht li.holzoptik { background-image:url(/bilder/seo/tropfen-holzoptik.svg)}
.seo.eignungsuebersicht li { background-size:50px 50px;background-position: 50% 50%;}
.seo.eignunguebersicht > div, div.seo.beliebte_kategorien > div {width:25%;float:left;position:relative;margin-bottom:2em;}
.seo.eignunguebersicht li.transparent { background-image:url(/bilder/seo/transparent.svg)}
.seo.eignunguebersicht li.htransparent { background-image:url(/bilder/seo/halbtransparent.svg)}
.seo.eignunguebersicht li.lichtdurchlaessig { background-image:url(/bilder/seo/lichtdurchlaessig.svg)}
.seo.eignunguebersicht li.abdunkelnd { background-image:url(/bilder/seo/abdunkelnd.svg)}
.seo.eignunguebersicht li.verdunkelnd { background-image:url(/bilder/seo/verdunkelnd.svg)}

.seo.eignunguebersicht li.wohnbereich { background-image:url(/bilder/seo/wohnzimmer.svg)}
.seo.eignunguebersicht li.kinderzimmer { background-image:url(/bilder/seo/kinderzimmer.svg)}
.seo.eignunguebersicht li.schlafzimmer { background-image:url(/bilder/seo/schlafzimmer.svg)}
.seo.eignunguebersicht li.wintergarten { background-image:url(/bilder/seo/wintergarten.svg)}
.seo.eignunguebersicht li.objekt { background-image:url(/bilder/seo/objekt.svg)}

.seo.eignunguebersicht li.bildschirm { background-image:url(/bilder/seo/bildschirmarbeitsplatz.svg)}
.seo.eignunguebersicht li.feucht { background-image:url(/bilder/seo/feuchtraum.svg)}
.seo.eignunguebersicht li.waben { background-image:url(/bilder/seo/wabenplissee.svg)}
.seo.eignunguebersicht li.sonnenschutz { background-image:url(/bilder/seo/sonnenschutz.svg)}
.seo.eignunguebersicht li.schwerentflammbar { background-image:url(/bilder/seo/schwer-entflammbar.svg)}
.seo.eignunguebersicht li.guenstig { background-image:url(/bilder/seo/guenstig.svg)}

.seo.eignunguebersicht li.floral { background-image:url(/bilder/seo/floral.svg)}
.seo.eignunguebersicht li.muster { background-image:url(/img/stoffauswahl/icon_muster.svg)}
.seo.eignunguebersicht li.streifen { background-image:url(/bilder/seo/streifen.svg)}
.seo.eignunguebersicht li.motiv { background-image:url(/bilder/seo/motiv.svg)}
.seo.eignunguebersicht li.uni { background-image:url(/bilder/seo/uni.svg)}
.seo.eignunguebersicht li.struktur { background-image:url(/bilder/seo/struktur.svg)}
.seo.eignunguebersicht li.bambus { background-image:url(/bilder/seo/bambusrollo.svg)}
.seo.eignunguebersicht li.oekotex { background-image:url(/bilder/seo/oekotex.svg)}
.seo.eignunguebersicht li.energiespar { background-image:url(/bilder/seo/energiesparen.svg)}
.seo.eignunguebersicht li.doppelrollos { background-image:url(/bilder/seo/doppelrollo.svg)}

.seo.eignunguebersicht li.schmutzabweisend { background-image:url(/bilder/seo/schmutzabweisend.svg)}
.seo.eignunguebersicht li.allergiker { background-image:url(/bilder/seo/fungizid.svg)}
.seo.eignunguebersicht li.qualitaet { background-image:url(/bilder/seo/qualitaet.svg)}
.seo.eignunguebersicht li.halogenfrei { background-image:url(/bilder/seo/pvc-frei.svg)}

.seo.eignunguebersicht li.stark_perforiert { background-image:url('/img/stoffauswahl/icon_stark_perforiert.svg');}
.seo.eignunguebersicht li.leicht_perforiert { background-image:url('/img/stoffauswahl/icon_leicht_perforiert.svg');}
.seo.eignunguebersicht li.aluminium {background-image:url(/img/stoffauswahl/icon_aluminium.svg);}
.seo.eignunguebersicht li.holz {background-image:url(/img/stoffauswahl/icon_holz.svg);}
.seo.eignunguebersicht li.hochglanz {background-image:url(/img/stoffauswahl/icon_hochglanz.svg);}
.seo.eignunguebersicht li.seidenmatt {background-image:url(/img/stoffauswahl/icon_seidenmatt.svg);}
.seo.eignunguebersicht li.matt {background-image:url(/img/stoffauswahl/icon_matt.svg);}
.seo.eignunguebersicht li.holzoptik {background-image:url(/img/stoffauswahl/icon_holzoptik.svg);}

article {-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	-webkit-column-gap: 40px;
    -moz-column-gap: 40px; 
    column-gap: 40px;
	margin-top:2em;
	}
article p {min-height:50px;}
article > h2 {margin-top:0;}
article img {max-width:99%;margin:1em auto;display: block;}

.artikel_liste * {box-sizing:border-box;}

.artikel_liste {
	display:flex;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	margin-bottom: 0;
}

.artikel_liste .artikelbox {
	width: calc(24.9% - 15px);
	margin-bottom: 2em;
	margin-right:20px;
	position: relative;
	max-width: 350px;
	min-width: 150px;
}

.artikel_liste .artikelbox_modell {
	width: calc(24.9% - 15px);
	margin-bottom: 2em;
	margin-right:20px;
	position: relative;
	max-width: 260px;
	min-width: 150px;
}

.artikel_liste .artikelbox.empty {
	margin: 0;
}

.boxZweispaltig .artikelbox {
	flex: 1 1 45%;
	margin-right: 20px !important;

}

.artikelbox:nth-child(4n) {
	margin-right:0;
}

.artikel_liste .artikelbox span {
	/*font-size:12pt;*/
	font-size: 1.2em;
	padding-bottom: 0.5em;
	display: block;
}

.artikel_liste .artikelbox span.hidden {
	font-size: inherit;
	padding-bottom: 0;
	display: inline-block;
}

.artikel_liste .artikelbox .box_wrapper {
	position:relative;
	display: block;
}

.artikel_liste .artikelbox .box_wrapper > img {
	width:100%;
}

.artikel_liste .artikelbox .box_wrapper > .artikel_liste_button {
	bottom:1.25em;
	right:1em;
	background-color: #fff;
	color:#000;
	position:absolute;
	padding: 0.5em 1em;
	text-align:center;
	transition: background 0.25s, color 0.25s;
}

.artikel_liste .artikelbox .box_wrapper > .artikel_liste_button:hover {
	background: #444;
	color: #fff;
}

.artikel_liste .artikelbox_modell .box_wrapper {
	position:relative;
	display: block;
}

.artikel_liste .artikelbox_modell .box_wrapper > img {
	width:100%;
}

.artikel_liste .artikelbox_modell .box_wrapper > .artikel_liste_button {
	bottom:1.25em;
	right:1em;
	background-color: #fff;
	color:#000;
	position:absolute;
	padding: 0.5em 1em;
	text-align:center;
	transition: background 0.25s, color 0.25s;
}

.artikel_liste .artikelbox_modell .box_wrapper > .artikel_liste_button:hover {
	background: #444;
	color: #fff;
}
@media (max-width: 1220px) {
		div.seo.beliebte_kategorien > div {width:50%;}
		.box_center {
			
			/*height: 70%;
			margin: 0 auto;
			padding: 1em;*/
			
		}
        .haupaufschrift {
   
            font-size: 22px;

        }
}
@media (max-width: 800px) {
		article {-webkit-column-count: 1;
			-moz-column-count: 1;
			column-count: 1;
			}
		.explore {
			
			padding: 5px;
			font-size:.9em;

		}
        .box_center .explore, .box_center .explore:visited, .box_center .explore:active {
            bottom: 5px;
            
        }
		.seo.eignunguebersicht > div {width:50%;}
        .box_center {
    
            height: 130px;
                min-height: 50%;
                padding:1em;
            
        }
}
@media (max-width: 660px) {
		.button_box {
			display: block!important;
		}
		.teaserbox { width:100%;}
		.seo.farbuebersicht > ul { 
			-webkit-column-count: 2;
			-moz-column-count: 2;
			column-count: 2;
		}
		h2.farbuebersicht:after, h2.eignunguebersicht:after {left:auto; right:0;}
		div.seo.beliebte_kategorien .box_center {
			
			width: 100%;
		}
        .haupaufschrift {
   
            font-size: 24px;

        }
        .box_center {
    
            min-height: 40%;
            
            
        }
        .seo.farbuebersicht > ul { 
			margin:0;
            padding:0;
		}
        .box_center .explore, .box_center .explore:visited, .box_center .explore:active {
            display: inline-block;
            width:90%;
            margin: 0 auto;

        }
}
@media (max-width: 420px) {
        .haupaufschrift {
   
            font-size: 20px;

        }
		.seo.eignunguebersicht > div { width:100%;text-align:center;}
		.seo.eignunguebersicht ul { 
			-webkit-column-count: 1;
			-moz-column-count: 1;
			column-count: 1;
		}
        
		article {padding:1em;}
		
}

