/* 
    Created on : 27.04.2016, 13:16:50
    Author     : Andeas Methling
*/


/* Login */
div#login_button { display: inline-block; max-width: 40%; width: 40%; padding: 5px; float: none; text-align: left; margin: 5px 0px; background-color: #51cf0c; vertical-align: top; }
div#logout_button { display: inline-block; max-width: 40%; width: 40%; padding: 5px; float: none; text-align: left; margin: 5px 0px; background-color: #51cf0c; vertical-align: top; }
div#form_registrierung_header, div#form_anmeldung_header { display: block; width: 100%; float: left; clear: left; margin: 1% 0% 1% 0%; padding: 0% 0% 1% 0%; border-bottom: 1px solid #e5e5e5; }
div#form_registrierung_header { margin-top: 5%!important; }
div#form_registrierung_header h2 { color: #090; }
div#form_registrierung, div#form_passwort { display: inline-block; width: 94%; margin: 20px 0px 0px 0px; padding: 3%; background-color: #e5e5e5; }
div#form_anmeldung { display: inline-block; width: 100%; margin: 0px; padding: 0px; }
div#form_fullregistrierung { /* display: none; */ }
div#form_anmeldung > div.form { display: inline-block; width: 98%; padding: 1%; margin: 10px 0px 10px 0px; }
div#form_anmeldung > div.form >  p > a.passwort_vergessen { display: inline-block; width: auto; padding: 2%; margin: 1% 0% 1% 0%; background-color: #e2000a; color: #FFF; }
form#app_manager_anmeldung { background-color: #f2f2f2; margin: 2% 0% 3% 0%; }
 /* Inputfelder für iPad und iPhones */
form#app_manager_anmeldung > div.formular > input,
form#app_manager_registrierung > div.formular > input {
-webkit-appearance: none;
/* -moz-appearance: none; */
appearance: none;
}
form#app_manager_anmeldung > div.formular > a.button.close { background-color: #FFF; color: #e2000a; }
form#app_manager_anmeldung > div.formular > label.checkboxen > span { background-image: url("/resources/css/images/checkbutton_white.svg");  }
form#app_manager_anmeldung > div.formular > label.checkboxen > input[type="checkbox"]:checked + span { background-image: url("/resources/css/images/checkbuttons_ok.svg"); }
#app_manager_anmeldung > label, #app_manager_registrierung > label, form#app_manager_password_reset > label, div#form_passwort > div.form > p { color: #FFF; }
#app_manager_registrierung > p, #form_anmeldung p { display:  inline-block; width: 100%; padding: 0px; margin: 0px; text-align: center; }
#login_button a, #logout_button a { display: block; text-align: center; line-height: 25px; text-decoration: none; background-color: #FFF; color: #2d6298; padding: 5px; border-radius: 0px; }
form#app_manager_anmeldung > label > input#remember_me { width: auto; float: left; }
form#app_manager_anmeldung > label > p.remeber { width: 60%!important; padding: 5px; float: left; }

div#vorauswahl { display: inline-block; width: 94%; padding: 3%; background-color: #739fcc; }
div#vorauswahl h2 { color: #FFF; }


div.datum_von, div.datum_bis { display: inline-block; width: 46%; padding: 1%; margin: 0% 0% 1% 0%; float: none; font-size: 14px; }
@media screen and (max-width: 500px) {
div.datum_von, div.datum_bis { width: 98%; }
}    
div.datum_von > label, div.datum_bis > label { display: inline-block; width: 45%; height: 30px; line-height: 30px; float: none; padding:2%; margin-bottom: 10px; color: #FFF; vertical-align: top; }
div.datum_von > input, div.datum_bis > input { display: inline-block; width: 45%; height: 30px; padding: 1%; float: none; text-align: center; font-size: 12px; vertical-align: top; font-size: 16px; outline: none;  border: none;  background: #FFF; }
@media screen and (min-width: 350px) {
div.datum_von > label, div.datum_bis > label  { width: 25%; }
div.datum_von > input, div.datum_bis > input  { background: #FFF; background-color:  #FFF; }
} 
button.ui-datepicker-trigger {
    display: inline-block;
    width: 40px;
    height: 40px;
    background: transparent;
    background-color: #FFF;
    background-image: url("/resources/css/images/calender.svg");
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: center center;
    padding: 5px;
    border: none;
    border-radius: 5px;
    margin: 5px;
    cursor: pointer;
    float: right;
}
div.auswahlfelder { display: inline-block; width: 98%; float: none; padding: 0x; margin: 1% 0% 0% 0%; font-size: 14px; }
div.auswahlfelder > label, div.auswahlfelder > select { display: inline-block; float: none; width: 42%; height: 30px; padding: 0px; margin: 10px; font-size: 14px; line-height: 30px; border: none; vertical-align: top; }
div.auswahlfelder > label { color: #FFF; }
div.auswahlfelder > select { text-align: center; background: #FFF;}
div#filterbox > p > button, div#filterbox_open > p > button
{ border:1px solid #CCCCCC; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:18px; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;text-shadow: 0px 0px 0 rgba(0,0,0,0.3);color: #000;
 background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd); }
div#filterbox > p > button:focus, div#filterbox_open > p > button:focus { outline: none; }
div#filterbox_open { padding-bottom: 1%; }
div#show_auswahl { display: inline-block; width: 96%; margin: 2% 0% 2% 0%; padding: 2%; text-align: left; background-color: #FFF; }
div#show_auswahl > label { font-size: 20px; line-height: normal; padding-bottom: 2%; }
div.artikel_container { display: inline-block; width: 96%; margin: 10px 0px 10px 0px; padding: 2%; background-color: #f4f4f4; text-align: left; vertical-align: top; }
div.artikel_container p { font-size: 14px; padding: 2px; }
div.artikel_container p.image { background-color: #FFF; padding-bottom: 5px; margin-bottom: 5px; text-align: center; }
div.artikel_container p.pname { font-size: 18px; text-align: center; padding-bottom: 5px; margin-bottom: 5px; border-bottom:  1px solid #e5e5e5; background-color: #FFF; }
div.artikel_container button  { }
div.artikel_container button.buchung.button_close { background-color: #090!important; background-image: url("/resources/css/images/goto.svg"); background-size: 16px auto; color: #FFF; }
div#ui-datepicker-div {  }
/* Account */
div.voucher_open, div.reklamation_Geschlossen, p.stammdaten_row { display: inline-block; width: 94%; padding: 10px; margin: 0px 0px 15px 0px; text-align: left; background-color: #f4f4f4; }
p.stammdaten_row > span { display: inline-block; width: 40%; margin-right: 2%; }
div#activecard { display: inline-block; width: 300px; height: 200px; background-image: url("/resources/css/images/activecard_app_small.jpg"); background-repeat: no-repeat; background-position: top center; position:  relative; }
div#activecard > div.barcode { display: block; width: 249px; padding: 10px; position: absolute; bottom: 15px; left: 15px; background-color: #FFF; }
div#activecard > div.barcode > img { display: block; width: 100%; height: auto; }
div#activecard > div.barcode:hover { width: 99%; left: -5%; padding: 5%; border: 1px solid #2d6298; }
div#einkaeufe { }
div#retouren {  }
div.produkt_box { }
div.produkt_box > p { display: inline-block; width: 96%; padding: 2%; margin-bottom: 25px; font-size: 18px; float: none; color: #FFF; background-color:  #51cf0c; text-align:  left; }
div.voucher_open > table > tbody > tr > td { white-space: nowrap; }
div.voucher_open > div.barcode, div.voucher_close > div.barcode { display: inline-block; width: 96%; min-height: 70px; padding: 2%; margin: 2% 0% 0% 0%; position: relative; text-align: center; background-color: #FFF; }
div.voucher_open > div.barcode img, div.voucher_close > div.barcode img  { display: inline-block; width: 94%; height:auto; max-width: 379px; padding: 3%; float: none; }


/* neue Box für Bonusgutschein */
div.voucher_open > p.wert { position: relative; }
div.voucher_open > p.wert-new { display: inline-block; width: 100%; padding: 5px 0px 5px 0px; font-size: 12px; text-align: center; }
div.voucher_open > p > span#infodetailsopener { display: inline-block; width: 100%; height: 100%; padding: 0; margin: 0; position: absolute; left: 0; top: 0; }
div.voucher_open > p > span#infodetailsopener > i { display: inline-block; width: 22px; font-size: 22px; line-height: 18px; padding: 8px; border-radius: 50%; background-color: #2d6298; color: #FFF!important; float: right; }
div.voucher_open > div > span#infodetailscloser { display: inline-block; width: 22px; height: 22px; padding: 5px; float: right; background-color: #e2000a; } 
div.voucher_open > div > span#infodetailscloser > i { font-size: 22px; color: #FFF;  } 

div.bonus_box, div.voucher_close { display: inline-block; width: 96%; padding: 1%; margin: 5px 0px 5px 0px; background-color: #739fcc; }
.retoure_0 { background-image: url("/resources/css/images/noretoure.svg"); background-repeat: no-repeat; background-position: left top; background-size: 45px; padding-top: 50px!important; }
.retoure_1 { background-image: url("/resources/css/images/retoure.svg"); background-repeat: no-repeat; background-position: left top; background-size: 45px; padding-top: 50px!important; }
div.bonus_box:hover, div.voucher_close:hover { opacity: 0.9; } 
div.bonus_box > p.wert, div.voucher_close > p.wert, div.voucher_open > p.wert, div.voucher_close > div.produkte_container > p.wert { display: block; width: 42%; float: left; padding: 2%; margin: 1% 3% 1% 1%; background-color: #51cf0c; color: #FFF; font-size: 18px; }
div.voucher_close > p.wert.auswahlen_red { background-color: #e2000a; color: #FFF; }
div.bonus_box > p.wert { float: left; }
div.voucher_close > p.wert, div.voucher_open > p.wert  { text-align: center; }
div.bonus_box > p.wert_name, div.voucher_close > p.wert_name { width: 45%; float: left; text-align: left; color: #FFF; }
div.voucher_close > p.wert_name, div.voucher_close > p.wert_name, div.voucher_open > p.wert_name, div.voucher_close > div.produkte_container > p.wert_name { width: 44%; padding: 2%; margin: 1%; line-height: 25px; float: left; clear: left; word-break: break-all; font-size: 14px; }
div.voucher_close > p.small { font-size: 14px!important;}
div.fehlender_einkauswert > p.wert { background-color: #51cf0c!important; } 
div.staffeln > p.wert { display: inline-block!important; float: none!important; width: 23%!important; font-size:  16px!important; }
p.bonus_hinweis { padding: 15px; font-size: 12px!important; }
div.produkte_container { display: none; }
 /* neuer Button open */
 button.button_open,
 a.button_open,
div.voucher_close > button,
a#kollektion1_button {
display: inline-block;
width: 100%;
border:1px solid #CCCCCC;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
font-size:18px;
padding: 1%;
margin: 1% 0% 2% 0%;
text-decoration:none;
display:inline-block;
text-shadow: 0px 0px 0 rgba(0,0,0,0.3);color: #000;
background-color: #2d6298;
background-image: url("/resources/css/images/down.svg");
background-size: 30px;
background-repeat: no-repeat;
background-position: right 15px center;
color: #FFF;
line-height: 30px;
cursor: pointer;
}
a#kollektion1_button { width: 90%; }
div.information_box { display: inline-block; width: 98%; margin: 1%; text-align: left; }
div.information_box > i.fa, div#kunden_foodid > div.row100 > i.fa { display: inline-block; width: auto; font-size: 40px; }
div.information_box > i.fa { padding: 0px 15px 0px 5px; }
div#kunden_foodid > div.row100 > i.fa { width: 10%; padding: 2%; }
div.information_box > i.fa.fa-info, div#kunden_foodid > div.row100 > i.fa.fa-info { color: #2d6298; vertical-align: top; }
div.information_box > p, div#kunden_foodid > div.row100 > p { display: inline-block; float: none; width: 84%; padding: 2% 0% 2% 0%; }
div.information_box > a.button.link { display: inline-block; width: 92%; padding: 3%; margin: 3% 1% 1% 1%; float: left; clear: left; border-radius: 5px;background-color: #2d6298; color: #FFF; text-align: center; }

 /* neuer Buttoncloser */
 button.button_close,
 a.button_close,
div.produkte_container > button,
button#stammdaten_button,
div.merkliste_container a.delete_leihreservierung {
display: inline-block;
width: 100%;
border:1px solid #CCCCCC;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
font-size:18px;
padding: 1%;
margin: 1% 0% 5% 0%;
text-decoration:none;
display:inline-block;
text-shadow: 0px 0px 0 rgba(0,0,0,0.3);color: #000;
background-color: #FFF;
background-image: url("/resources/css/images/up.svg");
background-size: 30px;
background-repeat: no-repeat;
background-position: right 15px center;
color: #2d6298;
line-height: 30px;
cursor: pointer;
}
button#stammdaten_button {
background-image: url("/resources/css/images/ok.svg")!important;
}
@media screen and (max-width: 500px) {
button.button_close,
a.button_close,
div.produkte_container > button,
button#stammdaten_button,
button.button_open,
a.button_open,
div.voucher_close > button,
a#kollektion1_button {
    padding: 3%!important;
}
}
a.clearbutton { background-color: #e2000a!important; }
div.voucher_close > div.produkte_container { display: none; width: 92%; float: left; clear: left; padding: 2%; margin: 2%; background-color: #FFF; }
div.voucher_close > div.produkte_container > p.wert_name { text-align: left; }
div.voucher_close > div.produkte_container > p.wert { background-color: transparent!important; color: #000!important; }
/* Personal Shopping Fomular */
div#error {  display: inline-block; width: 100%; padding: 1% 0% 1% 0%; margin: 1% 0% 1% 0%; border-bottom: 1px solid #CCC; }
div#error > h2 {  display: inline-block; width: 98%; padding: 1%; margin: 1%; color: #090; }
div#offene_beratungstermine { width: 100%; float: left; clear: left; }
div#offene_beratungstermine > div.beratungstermine_header, div#offene_beratungstermine > div.beratungstermine_row { width: 45%; padding: 2% 2% 5% 2%; margin: 0% 0% 5% 0%; float: left; border-bottom: 1px solid #CCC; }
div#offene_beratungstermine > div.beratungstermine_header > div.left { text-align: right; }
div#offene_beratungstermine > div.beratungstermine_row  > div.left { text-align: left; }
div#offene_beratungstermine > div.beratungstermine_row  > div.left > p { font-size: 12px; padding: 10px 0px 0px 0px; margin: 0px; }
div.mform  { display: block; }
section > form { display: block; width: 98%; border: none; margin: 1% 0% 1% 0; padding: 1%; }
section > form a, section > form button { width: 90%!important; }
section > form fieldset.form-horizontal { border: none; margin-bottom: 15px; }
fieldset > legend { display: block; width: 100%; float: left; clear: left; border: none; margin: 1% 0% 1% 0%; padding: 1% 0% 1% 0%; text-align: left;  font-size: 24px; border-bottom: 1px solid #CCC; }
fieldset > div.form-group { display: block; width: 100%; padding: 0px; margin: 1% 0% 1% 0%; float: left;  }
fieldset > div.form-group label { width: 45%; padding: 1%; margin: 0px; float: left; }
fieldset > div.form-group select { width: auto; float: left; font-size: 16px;  }
fieldset > div.form-group textarea { width: 46%; min-height: 100px; float: left; padding: 1%; border: 1px solid #CCC; }
fieldset > div.form-group input { width: 46%; float: left; clear: none; padding: 1%; margin: 0px; border: 1px solid #CCC; }
fieldset button { width: 100%; float: left; clear: left; color: #FFF; padding: 2%; border: 0px; font-size: 16px; background-color: #2d6298; }
@media only screen and (max-width: 1024px){
 fieldset button { width: 96%!important; margin: 2%; }
}
form > input.button_save { display: inline-block; width: 94%; padding: 3%; margin: 0px; float: none; background-color: #51cf0c; color: #FFF!important; cursor: pointer; }
/* Stammdaten Formular */
p.stammdaten_row > span { display: block; width: 35%; float: left; padding: 3%; margin: 0px; }
p.stammdaten_row > input { display: block; width: 43%; float: left; padding: 3%; clear: none; margin: 0px; background-color: white; background-image: url("/resources/css/images/unlocked.svg"); background-position: right center; background-repeat: no-repeat; background-size: 40px;} 
p.stammdaten_row > a.fa { display: block; float: right; padding: 1%; margin: 0px; font-size: 48px; color: #2d6298; }
p.stammdaten_row > input[readonly]  { background-image: url("/resources/css/images/locked.svg"); background-position: right center; background-repeat: no-repeat; background-size: 40px; }
/* Artikelsuche */
div#artiklesuche_serachfield { display: inline-block; width: 75%; min-height: 40px; padding: 10px 10px 10px 55px; margin-bottom: 15px; background-color: #2d6298;  background-image: url("/resources/css/images/lupe.svg"); background-repeat: no-repeat; background-position: 10px center; background-size: 30px; }
div#artiklesuche_serachfield > input { display: inline-block; width: 98%; min-height: 35px; padding: 1%; margin: 0px; float: left; background-color: #FFF; border-radius: 0px; border: none; font-size: 18px; }
div#artiklesuche_serachfield > button { /* display: block; width: 15%; padding: 2%; margin: 0px; float: right; background-color: #2d6298; color: #FFF; border: none; */ }
div#show_artikel { display: inline-block; width: 100%; border: none!important; text-align: left; }
div#show_artikel > h2 { display: block; padding: 10px; margin: 0px 0px 15px 0px; font-size: 22px; border-bottom: 1px solid #CCC; }
a.backtosearch { display: inline-block; width: auto; padding: 5px; margin: 0px; float: right; background-color: #2d6298; color: #FFF; font-size: 16px; }
div#show_artikel select, div#show_artikel select:focus, div#show_artikel select:active { padding: 2%; margin: 1%; text-align: left; font-size: 16px; }
div.products_box, div.voucher_close > div.produkte_container > div.products_box { display: block; width: 94%; padding: 1%; margin: 1%; float: left; clear: left; position: relative; border-bottom: 1px solid #CCC; }
div.products_box:hover { /* background-color: #e5e5e5; */ }
div.products_box > div.left, div.produkte_container > div.products_box > div.left { display: block; width: 45%; padding: 0px; margin-right: 2%; float: left; text-align: left; background-color: #FFF; }
div.left > span { display: block; font-size: 16px; padding: 2%; margin: 2% 0% 2% 0%; border-bottom: 1px solid #ccc; word-break: break-all; }
div.products_box > div.right, div.produkte_container > div.products_box > div.right { display: block; width: 52%; padding: 0px; margin: 0px; float: left; text-align: left; }
div.products_box > div.right > b, div.products_box > div.right > p, div.products_box > div.right > span, div.products_box > div.right > button { display: block; margin-bottom: 10px; }
div.products_box > div.desc { display: block; width: 100%; float: left; clear: left; margin: 10px 0px 10px 0px; }
div.products_box > div.desc > p { padding: 5px 0px 5px 0px; }
div.products_box > div.desc > div#description { padding: 1% 0% 1% 0%; }
div.products_box > div.desc > div#description > br { display: none; }
div.products_box > div.right > b { font-weight: 400; font-size: 16px; }
div.products_box > div.right > p { font-size: 12px; padding: 0px; float: left; }
div.products_box > div.right > span { display: block; margin: 5px 0px 5px 0px; float: left; font-size: 16px; color: #2d6298; }
@media only screen and (max-width: 767px){
    div#artiklesuche_serachfield { margin-top: 10px; }
    div.products_box > div.left, div.produkte_container > div.products_box > div.left { width: 100%; }
    div.products_box > div.right > span { clear: left; }
}
div.products_box > div.right > button {
    display: block;
    background-image: url("/resources/css/images/goto.svg");
    background-repeat: no-repeat;
    background-position: right 10px center;
    width: 100%;
    background-color: #2d6298;
    color: #FFF;
    padding: 5px;
    margin: 5px 0px 5px 0px;
    border: none;
    font-size: 18px;
    cursor: pointer;
    text-align: center; }

div#show_artikel > div.products_box > div.right > div.desc a,
div.products_box > div.desc > p > a {
    display: block;
    background-image: url("/resources/css/images/down.svg");
    background-repeat: no-repeat;
    background-position: right 10px center;
    width: 100%;
    background-color: #2d6298;
    color: #FFF;
    padding: 5px 0px 5px 0px;
    margin: 5px 0px 5px 0px;
    border: none;
    font-size: 18px;
    cursor: pointer;
    text-align: center; }



div.products_box > div.left > img, div.voucher_close > div.produkte_container > div.products_box > div.left img { display: block; width: 100%; height: auto; margin-bottom: 20px; }
div#varianten_lager { display: inline-block; width: 100%; margin: 10px 0px 10px 0px; padding: 1% 0% 3% 0%; border-bottom: 1px solid #e5e5e5; }
div#varianten_lager p.location { display: inline-block; width: 44%; float: left; clear: left; height: 15px; line-height: normal; margin: 0.5%; padding-right: 1%; border-right: 1px solid #e5e5e5; border-bottom: none; }
div#varianten_lager p.quantity { display: inline-block; width: 5%; float: right; height: 15px; line-height: normal; margin: 0.5%; }
div#varianten_lager p.quantity { clear: right; }
div#varianten_lager p.quantity.red { background-color: #e2000a; }
div#varianten_lager p.quantity.green { background-color: #51cf0c; }
div#varianten_lager > span.uvp,
div#varianten_lager > span.vp {
display: inline-block;
width: 100%;
padding: 1% 0% 1% 0%;
margin: 1% 0% 1% 0%;
}
div#varianten_lager > span.uvp { border-top: 1px solid #ccc; margin-top: 5%; color: #2d6298; }
div#varianten_lager > span.vp { font-size: 18px; }
div#varianten_lager > a {
    display: block;
    width: 97%;
    float: right;
    color: #FFF;
    line-height: 45px;
    font-size: 18px;
    padding-left: 10px;
    margin: 2% 0% 0% 0%;
    background-image: url("/resources/css/images/productshopping.svg");
    background-repeat: no-repeat;
    background-size: 35px auto;
    background-position: right 10px center;
    background-color: #2d6298; }
/* Servie */
div#vorauswahl { width: 100%!important; padding: 0px!important; background-color: #FFF!important; }
div#vorauswahl > h2 { color: #000!important; }
div#vorauswahl > div#filterbox { /*width: 35%; float: left; */ padding: 1%; margin: 2% 0% 0% 0%; background-color: #739fcc; }
div#merliste { display: none; }
div#merkliste_open { display: none; }
div#merkliste_close { display: none; width: 98%; padding: 1%; margin: 0px; background-color: #e5e5e5; }
div#merkliste > button, div#merkliste_open > p > button, div#merkliste_close > p > button, div.merkliste_container > button, div#add_angaben > button
{ border:1px solid #CCCCCC; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:18px; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block; text-shadow: 0px 0px 0 rgba(0,0,0,0.3);color: #000;
 background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd); }
div#merkliste > div.merkliste_container > button.button_open.angaben {  background-image: url("/resources/css/images/down.svg"); background-color: #090; color: #FFF; }
div#merkliste > div > button.button_close.sale { background-image: none; background-color: #51cf0c; color: #FFF; text-align: center; }
div.merkliste_container { width: 96%; padding: 2%; background-color: #e5e5e5; }
div.merkliste_container a.delete_leihreservierung { width: 98%; padding: 1%; margin: 1% 0% 1% 0%; background-image: url("/resources/css/images/tool_close.svg"); color: #e2000a; }
div.merkliste_container p { display: inline-block; width: 100%; margin: 0px; padding: 5px 0px 5px 0px; background-color: #FFF; }
div.merkliste_container p > img { display: inline-block; width: auto; margin: 0px; padding: 5px 0px 5px 0px; background-color: #FFF; }
div#add_angaben > input, div#add_angaben > label, div#add_angaben > select { display: inline-block; float: none; width: 45%; padding: 1%; vertical-align: top; }
div#add_angaben > select { width: 48%; padding: 2%; }
div#add_angaben > a { display: inline-block; width: 96%; padding: 2%; margin: 2% 0% 0% 0%; background-color: #51cf0c; color: #FFF; border-radius: 10px;  }
div.merkliste_container > select { font-size: 16px; margin-top: 15px; }
div#reservierungen { width: 100%; padding: 0px; }
div#reservierungen >button#reservieurngen_opener { background-color: #090; }
div#reservierungen > div#reservierungen_container, div#reservieurngen > div#reservierungen_container > div.reservierungen_box { display: inline-block; width: 100%; }
div#reservierungen_container > div.reservierungen_box { margin: 1% 0% 2% 0%; background-color: #739fcc; color: #FFF; }
div.reservierungen_box > p.pname { font-size: 22px; }
/* Markenlogos */
div#brands { display: inline-block; width: 100%; margin: 15px 0px 15px 0px; padding: 0px; text-align: center; }

/* Ausgabe Events Content */
.snowcontent { clear: left; display: block; float: left; width: 100%; text-align: left; }
@media only screen and (min-width: 1280px){
.snowcontent { display: inline-block; width: 48%; margin: 0% 2% 2% 0%; float: none; vertical-align: top; }
}
.snowcontent .infobox { display: block; width: 100%; padding: 2%; margin: 1% 0% 1% 0%; float: left; clear: left; background-color:#f4f4f4; }
.snowcontent  h3, div#events > div.snowcontent > div.infobox > h3 { display: block; margin-bottom: 1%; padding: 1% 1% 1% 65px; font-size: 22px; font-weight:400; line-height: normal; border-bottom: 1px solid #ccc; background-image: url("/resources/css/images/wanninger.svg"); background-repeat: no-repeat; background-position: left center; background-size: 50px; }
@media only screen and (max-width:767px){
.snowcontent  h3, div#events > div.snowcontent > div.infobox > h3 { font-size: 16px; }
}
.snowcontent .infobox .info, div#events > div.snowcontent > div.infobox > div.info { display: block; width: 100%; float: left; clear: left; padding: 1% 0% 1% 0%; border-bottom: 1px solid #CCC; }
div.info > ul > li { list-style: square; }
div#events > div.snowcontent > div.infobox > div.starthidden { display: none; }
.snowcontent .infobox .info .left, div#events > div.snowcontent > div.infobox > div.info > p.left  { display: block; width: 45%; float:left; }
.snowcontent .infobox .info .right, div#events > div.snowcontent > div.infobox > div.info > p.right { display: block; width: 45%; float: right; }
.snowcontent .infobox .red, div#events > div.snowcontent > div.infobox > div.red  { /* background-color: #F00; */ background-image: url("/resources/css/images/not_ok.svg"); background-repeat: no-repeat; background-position: right center; background-size: 25px }
.snowcontent .infobox .red p, div#events > div.snowcontent > div.infobox > div.red p  { color: #e2000a; }
.snowcontent .infobox .green, div#events > div.snowcontent > div.infobox > div.green { /* background-color: #090; */ background-image: url("/resources/css/images/ok.svg"); background-repeat: no-repeat; background-position: right center; background-size: 25px }
.snowcontent .infobox .green p, div#events > div.snowcontent > div.infobox > div.green p { /* color: #090; */ }
.snowcontent .infobox .info .right a, div#events > div.snowcontent > div.infobox > div.info > p.right > a.booking { display: block; width: auto; padding: 5px; background-color: #2d6298; color: #FFF; text-align: center; }
div#brands > ul { width: 100%; padding: 0px; margin: 0px; list-style: none; }
div#brands > ul > li { display: inline-block; width: 100px; float: none; padding: 5px; margin: 5px; vertical-align: top; list-style: none; border: 1px solid #f4f4f4; }

/* Tabs Ausgabe */
div.tabbed-content { display: block; width: 99%; padding: 1%; float: left; clear: left; text-align: left; }
div.tabbed-content > ul.tabs { display: inline-block; width: 100%!important; margin-bottom: 10px; padding: 0px!important; border-bottom: 1px solid #CCC; }
div.tabbed-content > ul.tabs > li { display: inline-block; width: auto; padding: 10px; margin: 0px 10px 0px 0px; list-style: none; float: none; cursor: pointer; background-color: #e5e5e5; }
div.tabbed-content > ul.tabs > li.active { display: inline-block; width: auto; padding: 10px; margin: 0px 10px 0px 0px; list-style: none; float: none; cursor: pointer; background-color: #2d6298; color: #FFF; } 
div.tabbed-content > ul.content { padding: 0px; margin: 0px; }
div.tabbed-content > ul.content > li { display: none; list-style: none; }
div.tabbed-content > ul.content > li.active { display: block; width: 100%; padding: 0px; margin: 0px; }
div.tabbed-content > ul.tabs > li > b { font-weight: normal; }
div.tabbed-content div.contentfull { padding: 0px; }

/* Tabs Ausgabe für Block auf- und zuklappen */


@media only screen and (max-width:768px){
div#show_artikel > div.products_box > div.right > b, div#show_artikel > div.products_box > div.right > span { font-weight: 400; font-size: 15px; }
div.products_box > div.right, div.produkte_container > div.products_box > div.right { width: 100%; }
div.products_box > a { display: inline-block; width: 96%; padding: 1% 2% 1% 2%; }
div.products_box > div.right > sp
fieldset > div.form-group label,
fieldset > div.form-group textarea,
fieldset > div.form-group input {
    width: 96%;
    clear: left;
    padding: 2%;
}
fieldset > div.form-group select { width: 100%; }
}
div#show_artikel > h3 { display: inline-block; width: 100%; padding: 2% 0% 2% 0%; clear: left; border-bottom: 1px solid #CCC; }
@media screen and (min-width : 769px) {
div#artiklesuche_serachfield { width: 30%; float: left; } 
div#show_artikel { width: 60%; float: right; margin-bottom: 80px; }
input[type='checkbox'] { -ms-transform: scale(1); /* IE */ -moz-transform: scale(1); /* FF */ -webkit-transform: scale(1); /* Safari and Chrome */ -o-transform: scale(1); /* Opera */ }
/* Service */
div.voucher_open, div.voucher_close  { width:45%; padding: 1%; margin: 1%; float: none; vertical-align: top; }
div#vorauswahl > div#show_auswahl, div#vorauswahl > div#show_auswahl2 { width: 60%; float: right; }
div#vorauswahl > div#show_auswahl > .artikel_container { width: 44%; margin: 1%; }
}
@media only screen and (max-width: 400px){
.snowcontent .infobox .info .left, div#events > div.snowcontent > div.infobox > div.info > p.left, .snowcontent .infobox .info .right, div#events > div.snowcontent > div.infobox > div.info > p.right { font-size: 14px;}
/* google Maps */
/* Personal Shopping Fomular */
div.form > div#rex-yform textarea { width: 92%; padding: 2%; }

/* Stammdaten Formular */
p.stammdaten_row > span { width: 98%; }
p.stammdaten_row > input { width: 75%; } 
p.stammdaten_row > a.fa { font-size: 35px; }
p.stammdaten_row > input[readonly]  { background-image: url("/resources/css/images/locked.svg"); background-position: right center; background-repeat: no-repeat; background-size: 40px; }
 /* neuer Button open */
 button.button_open,
 a.button_open,
div.voucher_close > button,
button#stammdaten_button {
font-size: 16px;
text-align: left;
line-height: 25px
}
 /* neuer Buttoncloser */
 button.button_close,
 a.button_close,
div.produkte_container > button {
font-size: 16px;
text-align: left;
line-height: 25px;
}

}

@media only screen and (max-width: 767px){
.coupon-image {
    width: 150vw;
    max-width: 50rem;
    height: 100vh;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 90%;
    background-color: #FFF;
    transform: rotate(90deg);
    padding: 0;
    margin: 0;
    position: fixed;
    left: -25vw;
    top: 0;
    z-index: 100000; 
    }
}
 div.voucher_close > div.barcode img:hover {  border: 2px solid #2d6298; width: 110%; max-width: 110%; left: -15%; bottom: 1%; padding: 20px 10px 30px 10px; position: absolute; transform: rotate(90deg); background-color: #FFF;}
/* Werbung iframe Ausgabe */
#werbungcontent { display: none; width: 90%; height: 90%; padding: 1% 2% 2% 2%; margin: 1%; position: fixed; top: 1%; left: 1%; border:  1px solid #ccc; z-index: 200000; overflow: scroll; background-color: #FFF; text-align: center; }
iframe.werbung { display: block; width: 100%; height: 83%; border: 0px; padding: 0px; margin: 0px; }
a.close_werbungcontent { display: inline-block; width: 98%; padding: 1%; float: none; background-color: #2d6298; color: #FFF; font-size:  18px; text-decoration: none; text-align: center; margin: 2% 0% 2% 0%; cursor: pointer; }

/* Scroller Top Artkelsuche */
div#gototop { display:  block; width: 50px; height: 50px; position: fixed; bottom: -70px; right: 0px; text-align: center; z-index: 2000; background-color: #2d6298; }
div#gototop.showgototop { bottom: 0px!important;  }
div#gototop > a { display: block; width: 100%; height: 100%; font-size: 25px; line-height: 50px; color: #FFF; cursor: pointer;background-image: url("/resources/css/images/scrollup.svg"); background-position: center center; background-repeat: no-repeat; background-size: 30px; }

/* Skiverleihpreisliste */
div#skiverleihpreisliste_close { display: none; }
div#skiverleihpreisliste_close > div.column-1.infoheadline { text-align: left; border-bottom: 1px solid #CCC; }
div#skiverleihpreisliste_close > div.column-1.infoheadline > h2 { font-size: 30px; }
div#skiverleihpreisliste_close > div.column-1.infoheadline > h3, div#skiverleihpreisliste_close > div.column-1.infoheadline > p { display: inline-block; width: 46%; padding: 1% 0% 1% 0%; margin: 1%; float: none; vertical-align: top; } 
div#skiverleihpreisliste_close > div.column-1.infoheadline > h3 { font-size: 30px; color: #e2000a; }
div#skiverleihpreisliste_close > div.column-1.celltop { border-bottom: 3px solid #2d6298; }
div#skiverleihpreisliste_close > div.column-1.info { width: 96%; padding: 2%; margin: 2% 0% 2% 0%; background-color: #e2000a; }
div#skiverleihpreisliste_close > div.column-1.info > h2 { color: #FFF; margin: 0px; padding: 0px; }
div#skiverleihpreisliste_close > div.column-1 { margin: 0px; }
div#skiverleihpreisliste_close > div.column-1.celltop > div.column-5 { border: none; } 
div#skiverleihpreisliste_close > div.column-1 > div.column-5 { display: inline-block; width: 18%; padding: 0.5%; margin: 1% 0% 1% 0%; border-top: 1px solid #CCC; vertical-align: top; text-align: center; }
div#skiverleihpreisliste_close > div.column-1 > div.column-5 > h2 { font-size: 24px; }
div#skiverleihpreisliste_close > div.column-1 > div.column-5 > p { padding: 0px; margin: 0px; line-height: normal; font-size: 12px; }
div#skiverleihpreisliste_close > div.column-1 > div.column-2 { display: inline-block; width: 44%; padding: 1%; margin: 1%; float: none; text-align: left; }
div#skiverleihpreisliste_close > div.column-1 > div.column-2 > strong { font-size: 18px; }


@media only screen and (max-width: 768px){
 div#skiverleihpreisliste_close strong { font-size: 14px; }   
}    
@media only screen and (max-width: 400px){
    div#skiverleihpreisliste_close > div.column-1 > div.column-5 { width: 17%; padding: 0.5%; }
    div#skiverleihpreisliste_close > div.column-1 > div.column-5 > h2 { font-size: 20px; }
}    

/* Gesundheitscoach Ausgabe */
div.headline.appinformation > h1, div.headline.appinformation > h2, div.headline.appinformation > h3  { display: inline-block;  width: 85%!important; float: none; vertical-align: top; text-align: left; }
div.headline.appinformation > i.fa-info { display: inline-block; width: 10%; float: left; padding: 0px; margin: 5px 0px 0px 0px; font-weight: 400;  }
div.headline > i.fa-info.big { font-size: 40px; }
@media only screen and (max-width: 400px){
div.headline.appinforamtion > i.fa-info.big { font-size: 30px; }   
}  
i.fa-info.blue { color: #2d6298; }
/* Deaktivierung Formular APP Kudenkarte bis zum onlone Gang */
button#form_fullregistrierung_button.button.open { /* display: none!important; */ }

/* New Loading Spinner */
div#uploading { display: none; height: 100%; width: 100%; margin: 0px; position: fixed; left: 0px; top: 0px;  background-color: rgba(80, 80, 80, 0.7); z-index: 1000000; text-align: center; }
div#animation { display: inline-block; width: 100px; height: 100px; background-color: #FFF; background-image: url("/resources/css/images/loading.gif"); background-repeat: no-repeat; background-position: center 15px; background-size: 50px 50px; padding: 0px; margin: 55% 0% 0% 0%;border-radius: 10px; float: none; vertical-align: top; z-index: 2000000; }
div#animation:after { content: "Lade Daten"; display: block; position: relative; padding-top: 70px; } 