@font-face {
 font-family: 'M PLUS Rounded 1c';
 src: url('fonts/MPLUSRounded1c-Regular.ttf') 
      format('truetype');
}
@font-face {
 font-family: 'Rubik-Light';
 src: url('fonts/Rubik-Light.ttf' /*'fonts/Rubik-VariableFont_wght.ttf'*/ /*'fonts/Quicksand-Light.ttf'*/) 
      format('truetype');
}
@font-face {
 font-family: 'Rubik-Regular';
 src: url('fonts/Rubik-Regular.ttf' /*'fonts/Rubik-VariableFont_wght.ttf'*/ /*'fonts/Quicksand-Light.ttf'*/) 
      format('truetype');
}
@font-face {
 font-family: 'Dosis-Regular';
 src: url('fonts/Dosis-Regular.ttf') 
      format('truetype');
}

* { font-family:"Rubik-Light" /*Verdana*/; }
body { background:url(../assets/css/bg_fliegenpilz.png) no-repeat fixed center; background-size:cover; }
h1 { margin:0 0 20px; font-size:20px; color:#fff; font-family:"Dosis-Regular", sans-serif; font-weight: 400; font-style: normal; }
h2 { font-size:16px; }
h3 { font-family:"Rubik-Regular"; }
h1, h2, h3 { text-align:center; }
p, td { margin:10px 0 0 0; font-size:15px /*14*/; line-height:20px/*17px*/; color:#222; }
p.important { font-style:italic; font-weight:bold; }
li { margin:10px 0; }
li p { margin-top:3px; }
ul { margin-bottom:30px; list-style-position: outside; margin-left:-20px; }
td { vertical-align:top; }
table.bordered td { padding:4px; border:1px solid #000; }
small { font-size:0.75em; }
form { margin:0; }

/*.page { position:relative; z-index:-1; opacity: 0.5; float:left; }*/
.content { margin:35px auto; padding:35px; width:700px; border:1px solid #AAA; border-radius:0.25em; box-shadow:rgba(0, 0, 0, 0.35) 0px 5px 15px; }
.white { background-color:#fff; color:#000; opacity:95%; }
.white h1 { color:#000; }
/*.content_block1 { background:#fff; }*/
.vid { width:320px; height:180px; margin:0 auto 20px auto; border:1px solid #000; overflow:hidden; }

a { color:#000; }
a:hover { color:#00f; }
a.act_lnk { cursor:pointer; text-decoration:none; }
.customerlist { margin:10px 0; }
.customerlist a.err { color:#f00; font-weight:bold; }
/*.customerlist a { cursor:hand; }*/
.customerlist a { cursor:pointer; }
#customerlist td { padding:3px 6px; /*border-bottom:1px solid #333;*/ }

.page2 .content h1 { color:#000; }
.banner { margin:20px auto; width:575px; display:block; }
.footer { margin:15px auto; width:575px; font-size:12px; color:#000; }
.error { margin:10px 0; padding:10px; border:1px solid red; }
.info { margin:10px 0; padding:10px; border:1px solid green; }

.col3 { float:left; }
.colleft { width:280px; margin-right:20px; margin-bottom:20px; border:1px solid #000; float:left; overflow:hidden; }
.colright { width:305px; float:left; }
.colright2 { width:340px; float:left; }
.attr_list { width:300px; padding:12px; margin:0 10px 32px 10px; color:/*#010d57*/rgb(0,32,96); background-color:#fff; float:left; border:1px solid rgb(0,32,96); }
.attr_col { width:200px; padding:10px; margin:0 5px 30px 5px; color:/*#010d57*/rgb(0,32,96); font-size:0.90em; background-color:#fff; float:left; border:1px solid rgb(0,32,96); }
.attr_col2 { width:300px; padding:10px; margin:0 10px 20px 10px; color:/*#010d57*/rgb(0,32,96); font-size:0.90em; background-color:#fff; float:left; border:1px dotted rgb(0,32,96); }
.attr_col2 img { width:300px; }
.attr_col3 { width:200px; padding:10px; margin:0 5px 20px 5px; color:/*#010d57*/rgb(0,32,96); font-size:0.90em; background-color:#fff; float:left; border:1px dotted rgb(0,32,96); }
.img_left { width:270px; height:270px; margin-right:20px; margin-bottom:20px; border:1px solid #000; float:left; overflow:hidden; }
.img_right { width:350px; float:left; }

button.call2act, input[type=submit].call2act { padding:12px; margin:20px auto; border:1px solid #aaa; border-radius:0.25em; box-shadow:rgba(0, 0, 0, 0.35) 0px 5px 15px; background-color:rgb(255,204,0); color:#010d57/*#003A7D*/; font-weight:bold; display:block; cursor:pointer; }
button.call2act:hover, input[type=submit].call2act:hover { background-color:#ffc439/*#ffca49*/; }
td.cb_right small { font-size:0.8em; }
td.ar { text-align:right; }
#popup form#orderform input[type=text]#email { width:300px; }

#popup { z-index:10; }
#popup .hl { margin:5px 0 15px; font-weight:bold; text-align:center; }
#popup .popup_content { margin:0 15px; font-size:12px; text-align:center; }
#popup form#orderform input[type=submit].call2act { margin-top:10px; margin-bottom:0px; }

@media (max-width: 881.98px) { /* 2-spaltiger content bricht um */ 
.content { margin:3%; padding:5%; width:84%; }
.banner { width:80%; }
h1.col { width:100%; float:none; clear:both; }
/*.vid { width:90%; }*/
.colright { margin:20px auto; float:none; }
.colleft { margin:auto; float:none; }
.attr_list { margin-left:0; margin-right:0; }
.attr_col2 { margin: 0 auto 20px auto; float:none; }
.img_left { margin:0 auto 20px; float:none; }
.img_right { margin:auto; float:none; }
.col3 { margin:auto; width:250px; float:none; clear:both; }
.colp3 { width:100%; text-align:center; clear:both; }
}

@media (max-width: 881.98px) { /* 3-spaltiger content bricht um */
}

@media (max-width: 649.98px) { /*575.98px*/
.content { margin:1%; padding:4% 2% 2% 2%; width:92%; }
.banner { width:90%; }
.footer { width:90%; }
.colright2 { width:100%; }
.attr_col2 { width:auto; }
.attr_col2 img { margin:auto; width:100%; }
#popup form#orderform input[type=text]#email { display:block; margin:auto; width:90%; }
.vid { width:100%; height:auto; }
.vid video { width:100%; /*height:calc(0.56*width);*/ }
}

/*----debug----*/
/*td { border:1px solid #f33; }
table { border:1px solid #555; }*/