@import url(http://fonts.googleapis.com/css?family=Monda:400,700);

/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0;text-decoration:none;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

body {
	text-align: left;
	font-family: Monda, verdana, arial, "sans serif";
	color: #525252;
	font-size: 13px;
	margin: 0;
	padding: 0;
    background-color: #e5e5e5;
	/* background-image: 	url(../images/body_back.gif); */
	/* background-repeat: 	repeat-x; */
}

a {
    color: #000000;
}

p { 
    line-height: 130%;
}

p.infoTextBox {
    display: block;
    margin-top: 15px;
    margin-bottom: 15px;
}

h1 {
    font-size: 150%;
    margin-bottom: 15px;
    margin-top: 15px;
}

h3 {
    display: block;
    clear: left;
    padding: 8px;
    font-size: 130%;
    color: #232323;
    background: rgba(212,212,212,1);
    background-image: -webkit-linear-gradient(#FFFFFF 0%, #E8E8E8 100%);
    background-image: -moz-linear-gradient(#FFFFFF 0%, #E8E8E8 100%);
    background-image: -o-linear-gradient(#FFFFFF 0%, #E8E8E8 100%);
    background-image: linear-gradient(#FFFFFF 0%, #E8E8E8 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#FFFFFF, endColorstr=#E8E8E8)";
    background-color: #e8e8e8;
    margin-top: 1px;
}

h4 {
    margin-top: 15px;
    font-size: 150%;
    margin-bottom: 15px;
}

body, header, nav {
    width: 100%;
}

div.container, nav ul, div.suchBox, article, div.footerContainer, .copy {
    max-width: 1170px;
    margin: auto;
    position: relative;
}

header {
    background-color: #ffffff;
    display: table;
    height: 120px;
    box-shadow: 1px 1px 1px 1px #cacaca;
    color: #cacaca;
}

header img {
    float: right;
    height: 95px;
    padding: 10px;
}

header div div.sprachBox a img {
    width: 2%;
    height: auto;
    padding: 3px;
}

div.sprachBoxResp {
    display: none;
}

ul.meinKonto {
    float: right;
    position: absolute;
    top: 0px;
    right: 0px;
}

ul.meinKonto li {
    float: right;
    border: 1px solid #eeeeee;
    padding: 8px;
    margin-left: 1px;
}

ul.meinKonto li a {
    color: #8d8d8d;
}

div.warenkorbBox {
    position: absolute;
    top: 40px;
    right: 0px;
    width: 177px;
    height: 55px;
    border: 1px solid #eeeeee;
    padding: 5px;
    border-radius: 5px;
}

div.warenkorbBox span a {
    float: right;
    background-color: #a21612;
    border-radius: 3px;
    color: #ffffff;
    margin-top: 5px;
    display: block;
    width: auto;
    padding: 5px;
}

nav ul {
    diplay: block;
}


section.oneCell {
    padding: 10px;
    background-color: #ffffff;
    line-height: 20px;
    margin-bottom: 25px;
    xborder: 1px solid #c7c7c7;
    margin-top: 25px;
    border-radius: 5px;
}


article {
    clear: left;
    min-height: 800px;
    background-color: #ffffff;
}

div.secondaryContent {
    width: 22%;
    padding-right: 1%;
    float: right;
    margin-left: 2%;
}

div.secondaryContent div p, div.secondaryContent nav ul {
    background-color: #fafafa;
    padding: 8px;
}

div.secondaryContent div h4, div.secondaryContent nav h4 {
    margin-top: 15px;
    font-size: 150%;
    padding: 8px;
    margin-bottom: 0;
    background: rgba(252,253,255,1);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(252,253,255,1)), to(rgba(233,233,233,1)));
    background: -moz-linear-gradient(center top , #FFFFFF, #E8E8E8);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffffff, endColorstr=#E8E8E8);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffffff, endColorstr=#E8E8E8)";
    background-color: #e8e8e8;
}

div.mainContent {
    width: 74%;
    float: left;
    padding-left: 1%;
}

/* ************************** Artikel ************************ */

div.artikelBlockFormat {
    width: 22%;
    float: left;
    height: 330px;
    margin: 1.5%;
    background-color: #ffffff;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.7);
    position: relative;
    overflow: hidden;
    margin-bottom: 3%;
}

div.kategorien {
    height: 250px;
}

div.artikelBlockFormat span {
    display: block;
    width: 100%;
    height: 70%;
    overflow: hidden;
}

div.artikelBlockFormat span a img {
    width: 100%;
    height: auto;
}

div.artikelBlockFormat h2 {
    font-size: 115%;
    padding: 3px;
}

div.artikelBlockFormat h2 a {
    color: #333333;
}

div.artikelBlockFormat strong {
    text-align: right;
    font-weight: bold;
    padding: 3px;
    display: block;
    margin-top: 5px;
	display: none;  /* jsr */
}

nav.bestseller ul li {
    list-style: decimal;
    margin-left: 18px;
}

nav.bestseller ul li strong {
    display: block;
    line-height: 20px;
    margin-bottom: 6px;
}


/* Listenformat */

section.artikelListFormat {
    width: 48%;
    margin: 1%;
    float: left;
    background-color: #ffffff;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.7);
    min-height: 200px;	/* jsr war 295*/
    position: relative;
}

div.bildBox {
    float: left;
    width: 35%;
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 5px;
}

div.bildBox span a img {
    width: 70%;
    height: auto;
}

div.bildBox strong {
    display: block;
}

div.artikelListContentFormat {
    padding: 5px;
    position: relative;
    float: right;
    width: 57%;
}

div.artikelListContentFormat form {
    background-color: red;
}

div.artikelListContentFormat select {
    float: left;
    margin-right: 3px;
}

div.artikelListContentFormat h2 {
    font-size: 130%;
    margin-bottom: 5px;
}

div.artikelListContentFormat h2 a {
    color: #5B8190;
}

div.artikelListContentFormat p {
    display: block;
    margin-bottom: 10px;
    height: 150px;  /* jsr war 70 */
    overflow: hidden;
    color: #b1b9bb;
}

div.artikelListContentFormat strong {
    display: block;
    text-align: right;
    font-size: 150%;
    color: red;
    margin-bottom: 10px;
	display: none;	/* jsr*/
}

div.artikelListContentFormat small {
    display: block;
    text-align: right;
    font-size: 80%;
    margin-bottom: 5px;
	display: none;	/* jsr*/
}

div.artikelListContentFormat small, div.artikelListContentFormat small a {
    color: #cccccc;
}


section.kategorieText {
    clear: both;
    margin-bottom: 25px; /*jsr von 45 */
    padding-top: 5px; /*jsr von 25 */
}

/************************* Submit Button ***********************/

div.bestellButton {
    clear: both;
    padding-top: 10px;
	display: none;	/* jsr*/
}

div.submitButton {
    background-color: #a21612;
    padding: 5px;
    border-radius: 5px;
    text-align: center;
    float: right;
    margin-left: 7px;
    margin-bottom: 7px;
}

div.submitButtonAlternative, form div.submitButtonAlternative input {
    background-color: #999999;
}

div.submitButtonAlternative {
    
}

div.submitButton a, div.submitButton a strong.button, div.submitButton a strong, ul.artikelTabelle div.submitButton a strong  {
    color: #ffffff;
    font-size: 100%;
    font-weight: normal;
    margin-bottom: 0px;
    padding-right: 0;
    text-align: center;
}

div.submitButton input {
    background-color: #a21612;
    border: 0;
    font-size: 13px;
    color: #ffffff;
}

table.standard tr td div.wkButton {
    background-color: #cccccc;
}

table.standard tr td div.wkButton a {
    color: #646464;
}


/*********** Artikel Listen Navigations Format ***********/

.weiterZurueckFormat {
    text-align: right;
    margin-bottom: 15px;
	display: none;  /* jsr */
}

.weiterZurueckFormat h2, h2.brotkruemel {
    display: block;
    text-align: left;
    border: 0;
    background-color: transparent;
    padding: 15px;
    padding-left: 0px;
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 5px;
}

.weiterZurueckFormat h2 a, h2.brotkruemel a {
    color: #999999;
}

.weiterZurueckErweitert {
    padding: 5px;
    border-radius: 5px;
	display: none;  /* jsr */
}


span.au_page_active {
    padding: 3px;
    margin: 2px;
    border: 1px solid #cccccc;
    background-color: #cccccc;
    color: #ffffff;
}

a.au_page_link{
    padding: 3px;
    border: 1px solid #cccccc;
}

span.artikelweiterButton  a {
    font-weight: bold;
    font-size: 14px;
    margin: 5px;
}

span.artikelZurueckButton a {
    font-weight:		bold;
    font-size:			14px;
    margin:				5px;
}


/************************* Artikeldetail Format ****************/

section.artikelDetailBox {
    width: 100%;
}

ul.artikelTabelle {
    display: table;
    width: 100%;
    /* margin-bottom: 25px;  jsr von 25px auf 0*/
	margin-bottom: 0px;
}

ul.artikelTabelle li {
    /* display: table-cell;  jsr*/
    table-layout: fixed;
    border-spacing: 5px;
    position: relative;
    overflow: hidden;
    border: 1px solid #eeeeee;
    padding: 15px;
    margin: 2px;
    vertical-align: top;
}

ul.artikelTabelle li div.artikelDetailBildBox {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding-top: 5px;
    width: 100%;
    text-align: center;
}

ul.artikelTabelle li div.artikelDetailBildBox a.artikelDetailBilder {
    display: block;
    float: left;
    width: 50px;
    height: 45px;
    padding-top: 5px;
    margin-right: 1px;
    margin-top: 5px;
    border: 1px solid #EEEEEE;
    overflow: hidden;
}

ul.artikelTabelle li.FuenfzigProzent {
    width: 50%;
}

ul.artikelTabelle li strong {
    font-weight: bold;
    display: block;
    margin-bottom: 5px;
	display: none;	/* jsr*/
}

/* ****** Bestelluebersicht Details ***** */

.bemerkung {
    width: 98%;
}

section.artikelDetailBox h1 {
    margin-bottom: 10px;
    display: block;
    font-size: 200%;
    border-bottom: 2px solid #ffffff;
    margin-top: 0px;
}

.mehrBilderBox {
    display: block;
    height: 55px;
}

section.artikelDetailBox div.artikelDetailBildBox strong {
    display: block;
    padding: 5px;
    clear: both;
    font-weight: normal;
    background-color: #EEEEEE;
    margin-top: 10px;
}

section.artikelDetailBox div.artikelDetailBildBox span.bewertungSterne {
    padding-bottom: 10px;
    display: block;
}

.artikelDetailInfos {
    border: 1px solid #eeeeee;
    margin-left: 3px;
    padding: 5px;
    min-width: 250px;
	display: none;	/* jsr*/
}

.artikelDetailInfos strong, div.artikelDetailInfos small, div.artikelDetailInfos p {
    display: block;
    text-align: right;
    padding-right: 10px;
    font-size: 24px;
    font-weight: normal;
    color: #FF6900;
    margin-bottom: 10px;
	display: none;	/* jsr*/
}

.artikelDetailInfos small, div.artikelDetailInfos small a {
    color: #999999;
    font-size: 9px;
    margin-bottom: 5px;
    display: block;
    text-align: right;
	display: none;	/* jsr*/
}

.artikelDetailInfos small.info {
    font-size: 11px;
    color: #999999;
    padding-bottom: 5px;
    display: block;
    text-align: right;
    margin-bottom: 0;
	display: none;	/* jsr*/
}

.artikelDetailInfos small.black {
    color: #000000;
    font-size: 100%;
	display: none;	/* jsr*/
}

.artikelDetailInfos form span.artikelMenge {
    display: block;
    text-align: right;
    padding-right: 10px;
    margin-bottom: 10px;
	display: none;	/* jsr*/
}

.artikelDetailInfos form span.artikelMenge input, div.artikelDetailInfos form select , .artikelDetailInfos form div.eingabefeld input{
    font-size: 15px;
    border: 5px solid #eeeeee;
    border-radius: 7px;
	display: none;	/* jsr*/
}

.artikelDetailInfos form select {
    margin: 10px 2px 10px;
	display: none;	/* jsr*/
}

.artikelDetailInfos div {
    margin-right: 5px;
    margin-left: 5px;
}

.artikelDetailInfos form div.eingabefeld input.error {
    border-color: red;
}

.artikelDetailInfos form div.eingabefeld input[type="checkbox"].error {
    outline: 3px solid red;
}

.artikelDetailInfos form div.eingabefeld label {
    display: block;
    width: 150px;
    float: left;
}


.artikelDetailInfos form div.eingabefeld {
    clear: both;
}

section.artikelDetailOther {
    clear: both;
}

section.artikelDetailOther h3 {
    margin-bottom: 0px;
}


textarea.artikelPartnerTextarea {
    width:				530px;
    height:				150px;
    border:				1px solid #6D808F;
    background-color:	#EDEFF0;
    font-size:			10px;
    font-family:		verdana, arial, "sans serif";
}

div.artikelDetailTabBox {
    overflow: hidden;
    margin-bottom: 30px;
}

div.artikelDetailTabBox p {
    margin-bottom: 15px;
}

div.artikelDetailTabBox p img {
    width: 100%;
}

div.artikelDetailTabBox ul, div.artikelDetailTabBox ol {
    margin-left: 25px;
    list-style: square;
}

div.artikelDetailTabBox ul li, div.artikelDetailTabBox ol li {
    list-style-type: square;
    display: list-item;
    border: 0px;
    padding: 3px;
    overflow: visible;
}

div.artikelDetailTabBox ol li {
    list-style-type: decimal;
}

ul.artikelTabelle li ul.artikelDetailTabNavi {
    margin: 0;
    padding: 0;
    list-style: none;
    clear: both;
    border-bottom: 1px solid #cccccc;
    margin-bottom: 15px;
    border-spacing: 0;
	display: none;  /* jsr */
}

ul.artikelDetailTabNavi a {
    display: block;
    padding-bottom: 1px;
    margin-left: 10px;
    margin-right: 10px;
    color: #ffffff;
    font-size: 13px;
	display: none;  /* jsr */
}

ul.artikelDetailTabNavi li {
    background-color: #cccccc;
    border-spacing: 0;
    padding: 5px;
	display: none;  /* jsr */
}

div.facebookcount {
    float: right;
}

.facettenWrapper {
    padding: 10px;
    background-color: #ffffff;
    margin-bottom: 10px;
}

.artikelSubHeadline, #artikelPreisstaffel h3 {
    background: transparent;
    display: block;
    margin-bottom: 10px;
    margin-top: 15px;
    clear: left;
    font-size: 130%;
    color: #525252;
    text-shadow: 0 0 0 #ffffff;
    padding: 0;
}

/* ************************************* Bewertungen ********************************* */

div.bewertungContent {
    clear: both;
    width: 98%;
}

div.bewertungContent span {
    display: block;
    padding: 5px;
    line-height: 29px;
    text-align: center;
    float: left;
    background-color: #a21612;
    border-radius: 5px;
    margin-bottom: 15px;
}

div.bewertungContent span a {
    color: #ffffff;
    font-weight: bold;
    font-size: 12px;
}

div.bewertungContent div {
    float: left;
    margin-right: 10px;
}

div.bewertungContent dl {
    padding-top: 10px;
    clear: both;
}

div.bewertungContent dl dd {
    background-color: #fafafa;
    padding: 5px;
}

div.bewertungContent dl dd p {
    margin-top: 5px;
}

div.bewertungContent dl dd p.kommentar {
    padding: 5px;
    border: 1px solid red;
}

div.bewertungsForm h2 {
    font-size: 14px;
    margin-bottom: 20px;
}

div.bewertungsForm fieldset {
    width: 470px;
}


/* ******************************* Formulare ************************** */

fieldset {
    width: 95%;
}

fieldset input[type=text], fieldset input[type=password], fieldset select {
    width: 98%;
    border: 1px solid #c7c7c7;
    border-radius: 3px;
    height: 30px;
    line-height: 30px;
    text-indent: 10px;
    font-size: 110%;
}

fieldset select {
    text-indent: 0px;
}

fieldset input[type=submit] {
    width: auto;
    border-radius: 3px;
    height: 35px;
    line-height: 35px;
    background-color: #a21612;
    text-align: center;
    color: #ffffff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    cursor: pointer;
    float: right;
    margin-top: 5px;
}

.variantenForm {
    border: 1px solid #cccccc;
}

fieldset.content {
    width: 100%;
}

fieldset.content div {
    clear: both;
}

fieldset.content div label {
    float: left;
    width: 30%;
    height: 30px;
    line-height: 30px;
}

fieldset.content div input, fieldset.content div select {
    width: 68%;
    margin-bottom: 6px;
}

fieldset.content div input.captcha-code {
    width: 90px;
}

fieldset.content div img {
    float: left;
    margin-right: 20px;
}

fieldset.content input.content[type="checkbox"] {
    width: 15px;
    float: left;
    margin-bottom: 20px;
    margin-right: 10px;
}

fieldset.content div textarea {
    width: 68%;
    margin-bottom: 6px;
}

fieldset.content div small {
    display: block;
    height: 30px;
    line-height: 30px;
}

fieldset.content span {
    display: block;
    height: 30px;
    line-height: 30px;
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: bold;
}

/*************************** Tabellen Formatierung **************************/

table.standard {
    width: 100%;
    table-layout: auto;
    border-spacing: 8px;
    empty-cells: show;
    border-collapse: collapse;
    margin-bottom: 25px;
}

table.bestellungsBox {
    margin-top: 20px;
}

table.bestellungsBox tr td {
    background-color: rgba(219, 235, 237, 0.29);
    border: 1px solid #ffffff;
}

th {
    font-weight: bold;
    font-size: 12px;
    padding: 8px;
    spacing: 1px;
    background-image: -webkit-linear-gradient(#595959 0%, #000000 100%);
    background-image: -moz-linear-gradient(#595959 0%, #000000 100%);
    background-image: -o-linear-gradient(#595959 0%, #000000 100%);
    background-image: linear-gradient(#595959 0%, #000000 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#595959, endColorstr=#000000)";
    background-color: #000000;
    border-bottom: 1px solid #cccccc;
    color: #ffffff;
}

td {
    padding: 7px;
    font-size: 11px;
    
    background-color: #ffffff;
    vertical-align: top;
    overflow: hidden;
    line-height: 16px;
}

td.trennlinie {
    border-bottom: 1px solid #efefef;
}

table.standard tr td input {
    border: 1px solid #D7DBDD;
}

td.streifenmuster {
    background-color: #fbfbfb;
}

td.tdSummHighlightLow, th.tdSummHighlightLow {
    text-align: right;
}

td.tdSummHighlight {
    font-size: 12px;
    text-align: right;
}

td.tdSummeGesamt {
    text-align: right;
    font-size: 18px;
}


/********************************* Content Login Formatierungen ************************/

article ul li {
}

article ul li div.loginFormatBoxen {
    min-height: 180px;
    padding-top: 10px;
}

article ul li div.loginFormatBoxen p {
    padding-bottom: 10px;
}

article ul li div.loginFormatBoxen fieldset {
    min-width: 200px;
}

article ul li div.loginFormatBoxen fieldset label {
    width: 100%;
    margin-bottom: 5px;
    display: block;
}

article ul li div.loginFormatBoxen fieldset input {
    width: 100%;
    margin-bottom: 8px;
}

article ul li div.submitButton input[type=submit], article ul li div.submitButtonAlternative {
    background-color: #a21612;
}



/******* Content Background Formatierung ****/

.contentRow {
    display: block;
    text-align: left;
    font-size: 11px;
    margin-top: 1px;
    padding: 5px;
    clear: left;
}

.contentSecondRow {
    background-color: #fbfbfb;
}

.contentRow a {
    color: #525252;
}

.contentRow img {
    float: left;
    margin-right: 5px;
}


/********************** Formatierung fuer Zahlungsart und Versandartauflistung ***********************/

.zahlVersandListFormat {
    display: 			block;
    font-weight:		bold;
    font-size:			13px;
    padding-bottom:		10px;
}

div.zahlVersandListFormat input {
    border:				0px;
}

.zahlVersandListBeschreibung {
    display: 			block;
    padding-bottom:		35px;
}

.zahlVersandListBeschreibung img {
    float:				left;
    margin-right:		5px;
    margin-bottom:		35px;
}

div.zahlVersandListSeperator {
    border-bottom: 1px solid #f6f6f6;
    clear: both;
    margin-bottom: 10px;
}
/* ****************** Footer ***************** */

div.newsletter {
    background-color: #000000;
    padding: 8px;
}

div.newsletter .container fieldset {
    width: auto;
}

div.newsletter .container h4 {
    width: 100px;
}

div.newsletter .container h4, div.newsletter .container input {
    float: left;
    width: 130px;
    margin-top: 0px;
    margin-bottom: 0px;
    line-height: 35px;
    color: #ffffff;
    font-size: 14px;
}

div.newsletter .container input {
    border: 1px solid #5c5c5c;
    background-color: #404040;
}

div.newsletter .container input[type="submit"] {
    width: 80px;
    margin-left: 5px;
    font-size: 11px;
}

footer {
    display: block;
    clear: left;
    background-color: #707070;
}

footer div.container {
 /* padding-top: 40px;   jsr  */
    clear: both;
}

footer div nav.navigationFooterBox, footer div div.navigationFooterBox {
    float: left;
    width: 233px;
    min-height: 80px;
    background-color: #F2F2F2;
    overflow: hidden;
    margin-bottom: 25px;
    background: transparent;
}

footer div nav.navigationFooterBox ul {
    padding: 0;
}

footer div nav.navigationFooterBox ul li, footer div div.navigationFooterBox p {
    display: block;
    font-size: 85%;
    line-height: 18px;
}

footer div div.navigationFooterBox p {
    width: 85%;
}

footer div nav.navigationFooterBox ul li a, footer div nav.navigationFooterBox ul li, footer div div.navigationFooterBox a, .copy a, footer div nav.navigationFooterBox h4 a, footer div div.navigationFooterBox p {
    color: #e7e7e7;
}

footer div nav.navigationFooterBox h4, footer div div.navigationFooterBox h4 {
    color: #fafafa;
    font-size: 105%;
    margin-bottom: 15px;
}

.copy {
    display: block;
    margin: auto;
    border-top: 1px solid #c7c7c7;
    clear: both;
    padding-bottom: 45px;
    text-align: center;
    padding-top: 10px;
    font-size: 80%;
}

.copy a {
    line-height: 130%;
	color: #929292;
}



/*
 * jQuery FlexSlider v2.2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */


/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}


/* Icon Fonts
*********************************/
/* Font-face Icons */
@font-face {
    font-family: 'flexslider-icon';
    src:url('../fonts/flexslider-icon.eot');
    src:url('../fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
    url('../fonts/flexslider-icon.woff') format('woff'),
    url('../fonts/flexslider-icon.ttf') format('truetype'),
    url('../fonts/flexslider-icon.svg#flexslider-icon') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; height: auto; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { margin: 12px 0 0 ; background: #fff; border: 0px solid #fff; position: relative; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: 0 0px 0px rgba(0,0,0,.2); -moz-box-shadow: 0 0px 0px rgba(0,0,0,.2); -o-box-shadow: 0 0px 0px rgba(0,0,0,.2); box-shadow: 0 0px 0px rgba(0,0,0,.2); zoom: 1; }
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 300px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { text-decoration:none; display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; }
.flex-direction-nav .flex-next { text-align: right; }
.flexslider:hover .flex-prev { opacity: 0.7; left: 10px; }
.flexslider:hover .flex-next { opacity: 0.7; right: 10px; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; }
.flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }
.flex-direction-nav a:before  { font-family: "flexslider-icon"; font-size: 40px; display: inline-block; content: '\f001'; }
.flex-direction-nav a.flex-next:before  { content: '\f002'; }

/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
    .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
    .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}


/* ************************* Warenkorb ************************* */

div.warenkorbAnzahl {
    position: absolute;
    right: 5px;
    top: 5px;
}

div.addWarenkorbPopup {
    display: none;
    position: absolute;
    background: #DBEBED;
    border: 3px solid #95C1CA;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 2px 7px 1px #999999;
    height: 80px;
    width: 240px;
    top: 60px;
    left: 0px;
    z-index: 1000;
    padding: 5px;
    font-size: 11px;
}

div.wkPopup {
    position: relative;
}

div.addWarenkorbPopupDetail {
    left: 20px;
    top: -100px;
}

div.warenkorbBox div#warenkorbFlashColor {
    background-color: #59a71c;
    display: hidden;
}



/* ************** Farbüberschreibung zur Vereinfachung der Globalisierunge *********** */

nav, .ajaxsearch_go_button {
    background-image: -webkit-linear-gradient(#595959 0%, #000000 100%);
    background-image: -moz-linear-gradient(#595959 0%, #000000 100%);
    background-image: -o-linear-gradient(#595959 0%, #000000 100%);
    background-image: linear-gradient(#595959 0%, #000000 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#595959, endColorstr=#000000)";
    background-color: #000000;
}

/* ****** Extras ****** */

div.artikelCleaner {
    clear: both;
}

.hide {
    display: none;
}

/* ********* Fehlermeldungen / Meldungen ************ */

.fehlerMeldung {
    display: block;
    padding: 10px;
    background-color: #a90000;
    color: #ffffff;
}

#formFehler {
    background-color: #DBEBED;
}

/*************** Tooltip *************/

.tooltip {
    font-weight: bold;
    float: right;
}

.tooltip .tooltiptext {
    display:none;
    background-color: #FFFFFF;
    border: 7px solid #efefef;
    font-weight: normal;
    text-align: left;
    text-decoration: none;
    z-index: 500;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 3px 3px 8px 0px #AAAAAA;
}
.tooltip:hover .tooltiptext {
    display: block;
    position: absolute;
    width: 200px;
    right: 30px
}

/* ***************** Top Button ************* */

.go-top {
    position: fixed;
    bottom: 2em;
    right: 2em;
    text-decoration: none;
    color: white;
    background-color: rgba(0, 0, 0, 0.3);
    font-size: 12px;
    padding: 1em;
    display: none;
}

.go-top:hover {
    background-color: rgba(0, 0, 0, 0.6);
    color: #ffffff;
}

/********** Toggle für Artikel- und Kategorieübersicht ***********/

div.artikelToggle {
    height: 54px;
    overflow: hidden;
}

div.artikelToggleButton {
    text-align: right;
    padding-right: 20px;
    font-size: 11px;
    font-weight: bold;
}


/* Checkoutsymbole */

ol.steps {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', 'Bitstream Vera Sans', 'Liberation Sans', Verdana, 'Verdana Ref', sans-serif;
    font-size: 13px;
    line-height: 20px;
    font-weight: bold;
    counter-reset: li;
    margin-top: 25px;
    margin-bottom: 25px;}
ol.steps li {
    list-style-image: none;
    list-style-type: none;
    margin-left: 0;
    text-align: center;
    color: #3a3a3a;
    background: #cccccc;
    position: relative;
    margin-left: 43px; }
ol.steps li:after {
    position: absolute;
    top: 50%;
    left: 100%;
    content: " ";
    height: 0;
    width: 0;
    pointer-events: none;
    border: solid transparent;
    border-left-color: #cccccc;
    border-width: 19px;
    margin-top: -19px; }
ol.steps li:first-child {
    margin-left: 0; }
ol.steps li:first-child span {
    padding: 9px;}
ol.steps li:first-child span:after {
    border: none; }
ol.steps li:last-child:after {
    border-width: 0; }
ol.steps li span {
    display: block;
    padding: 9px 15px 9px 0px; }
ol.steps li span:after {
    position: absolute;
    top: 50%;
    right: 100%;
    content: " ";
    height: 0;
    width: 0;
    pointer-events: none;
    border: solid #cccccc;
    border-left-color: transparent;
    border-width: 19px;
    margin-top: -19px; }
ol.steps li span:before {
    content: counter(li) ". ";
    counter-increment: li; }
ol.steps > li {
    float: left; }
ol.steps li.current {
    color: #fff;
    background: #7b7b7b; }
ol.steps li.current:after {
    border-left-color: #7b7b7b; }
ol.steps li.current span:after {
    border-color: #7b7b7b;
    border-left-color: transparent; }
ol.steps li.step1 {
    z-index: 9; }
ol.steps li.step2 {
    z-index: 8; }
ol.steps li.step3 {
    z-index: 7; }
ol.steps li.step4 {
    z-index: 6; }
ol.steps li.step5 {
    z-index: 5; }
ol.steps li.step6 {
    z-index: 4; }
ol.steps li.step7 {
    z-index: 3; }
ol.steps li.step8 {
    z-index: 2; }
ol.steps li.step9 {
    z-index: 1; }
ol.steps li.step10 {
    z-index: 0; }



/* **************** Ajax Suche ************ */

div.suchBox {
    overflow: visible;
    margin: auto;
    position: relative;
    background-color: #bfbfbf;
}

.ajaxsearch_container {
    padding: 20px;
    z-index:    5;
    white-space:nowrap;
    width: 96%;
}

.ajaxsearch_go_button {
    font-size: 18px;
    padding: 3px;
    color: #FFFFFF;
    margin-left: 2px;
}

.ajaxsearch_input {
    background-color:   #FFFFFF;
    border:             1px solid #ffffff;
    font-size:          20px;
    width:              94%;
    line-height:        22px;
    padding:            2px;
    padding-left:       25px;
    background-image:   url(../images/ajaxsearch_backgroundicon.gif);
    background-repeat:  no-repeat;
    background-position:    4px 4px;
}

.ajaxsearchresult_container {
    display:            none;
    left:               20px;
    top:                51px;
    position:           absolute;
    z-index:            110;
    border: 1px solid  #999999;
    box-shadow: 4px 4px 9px 0 #CCCCCC;
}

.ajaxsearchresult_focuscatcher {
    position:           absolute;
    width:              0px;
    height:             0px;
    left:               0px;
    top:                0px;
    overflow:           hidden;
}

.ajaxsearchresult_list_container {
    clear:             both;
    background-color: #f8f8f8;
}

* html .ajaxsearchresult_list_container {
    width:				100%;
}

.ajaxsearchresult_productcontainer {
    overflow:           hidden;
    cursor:             pointer;
    margin-left:        4px;
    border-top:         1px dashed #999999;
    background-color:   #FFFFFF;
    padding:            2px;
    position:           relative;
}

* html .ajaxsearchresult_productcontainer {
    width:				95%;
    display:			block;
}

.ajaxsearchresult_productcontainer_heighlight {
    background-color: #f7f7f7;
}

.ajaxsearchresult_productimagemaincontainer {
    position:           relative;
    float:              left;
    overflow:           hidden;
}

.ajaxsearchresult_productimagecontainer {
    position:           absolute;
    left:               0px;
    top:                0px;
    width:              100px;
    height:             100px;
    background-color:   #FFFFFF;
}

.ajaxsearchresult_productimagetranscontainer {
    position:           absolute;
    left:               0px;
    top:                0px;
}

.ajaxsearchresult_productnamecontainer {
    float:              left;
    overflow:           hidden;
    padding-left:       5px;
}

.ajaxsearchresult_productnamecontainer h1 {
    display:            inline;
    font-size:          14px;
    font-weight:        normal;
    padding:            2px;
    float:              left;
    border:             none;
    margin:             0px;
}

.ajaxsearchresult_productnamecontainer p {
    font-size:          10px;
    font-weight:        normal;
    padding:            2px;
    clear:              both;
}

.ajaxsearchresult_productinformationcontainer {
    float:              left;
    width:              70px;
    overflow:           hidden;
    text-align:         right;
}

.ajaxsearchresult_productinformationcontainer i {
    display:            inline;
    font-size:          10px;
    padding:            2px;
    float:              right;
    font-style:         normal;
}


.ajaxsearchresult_productinformationcontainer img {
    margin-top:         4px;
    margin-bottom:      4px;
}

.ajaxsearchresult_noresult {
    font-size:          16px;
    text-transform:     uppercase;
    padding:            5px;
    padding-left:       10px;
    padding-right:      16px;
    display:            none;
    background-color: #efefef;
    color:              #999999;
}

.ajaxsearchresult_searchheadline {
    font-size:          14px;
    color:              #999999;
    display:            none;
    overflow:           hidden;
    text-transform:     uppercase;
    padding: 4px 16px 2px 10px;
    background-color: #efefef;
}

* html .ajaxsearchresult_searchheadline {
    width:				100%;
}

.ajaxsearchresult_searchheadline_img_container {
    float:            	right;
}

* html .ajaxsearchresult_searchheadline_img_container {
    float:				left;
}

.ajaxsearchresult_searchheadline_headline_container {
    float:              left;
    margin-top:         4px;
}

.ajaxsearchresult_searchheadline img {
    border:             none;
    padding-top:        2px;
    cursor:             pointer;
}

.ajaxsearchresult_searchmore {
    display:            none;
    padding-left:       4px;
    padding-right:      16px;
    background-color: #ffffff;
}

.ajaxsearchresult_searchmore a {
    font-size:          16px;
    text-transform:     uppercase;
    display:            block;
    border-top:         1px dashed #999999;
    padding-top:        4px;
    padding-left:       4px;
}

.ajaxsearchresult_searchmore_end {
    background-color: #EFEFEF;
    color: #999999;
    height:                 20px;
}

.ajaxsearchresult_searchmore_highlight a {
    color:   #0063AB;
}



/* Grunddefinition Highligth */

.highlight_left_top_45deg, .highlight_right_top_45deg, .highlight_left_bottom_45deg, .highlight_right_bottom_45deg {
    background-image: -webkit-linear-gradient(#139731 0%, #115e24 100%);
    background-image: -moz-linear-gradient(#139731 0%, #115e24 100%);
    background-image: -o-linear-gradient(#139731 0%, #115e24 100%);
    background-image: linear-gradient(#139731 0%, #115e24 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#139731, endColorstr=#115e24)";
    background-color: #115e24;
    border: 1px solid #ffffff;
    position: absolute;
    width: 150px;
    font-size: 16px;
    color: #ffffff;
    font-weight: bold;
    z-index: 99;
    text-align: center;
    padding: 5px;
}

/* Positionierung und Transform für Highlight */

.highlight_left_top_45deg {
    left: -40px;
    top: 30px;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
}

.highlight_right_top_45deg {
    right: -35px;
    top: 30px;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
}


.highlight_left_bottom_45deg {
    left: -33px;
    bottom: 33px;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
}

.highlight_right_bottom_45deg {
    right: -33px;
    bottom: 33px;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
}