*{
	box-sizing:border-box;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
	-webkit-transition: all .35s cubic-bezier(.645,.045,.355,1);
	transition: all .35s cubic-bezier(.645,.045,.355,1);
}

@import url('fonts.css');

iframe{
 background-color:#f0f0f0;
 border-radius:15px;
 box-shadow:3px 3px 6px #999;}

.lefty, .righty{
  hyphens: auto; 
 text-align:justify;
 display:inline-block;
 float:left;
 width:48%;}

.lefty{
 margin-right:4%}

/*** LAYOUT-FONT ***/
@font-face {
    font-family: 'mtlfont';
    src: url('fonts/texgyreadventor-regular-webfont.eot');
    src: url('fonts/texgyreadventor-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/texgyreadventor-regular-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-regular-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-regular-webfont.svg#texgyreadventorregular') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
    font-family: 'mtlfontb';
    src: url('fonts/texgyreadventor-bold-webfont.eot');
    src: url('fonts/texgyreadventor-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/texgyreadventor-bold-webfont.woff') format('woff'),
         url('fonts/texgyreadventor-bold-webfont.ttf') format('truetype'),
         url('fonts/texgyreadventor-bold-webfont.svg#texgyreadventorbold') format('svg');
    font-weight:normal;
    font-style: normal;}

.gruen{
 color:#10A982;}

html,body{
 font-family:raleway, helvetica, sans-serif;
 color:#000000;
 margin:0;
 padding:0;
 width:100%;
 min-height:100%;
 overflow-x:hidden;
 background-color:#FFFFFF;}

body{
 background-color:transparent;
 font-size:.85em;}

h1,h2,.h2,.h2g{
 display:block;
 text-decoration:none;
 font-family:raleway, helvetica, sans-serif;
 font-size:1.2em;
 line-height:120%;
 font-weight:400;
 margin:0;
 margin-bottom:.2em;
}

h3,
h1{
 color:#10A982;
}

h2,.h2{
 color:#000000 !important;
}

.h2g{
column-span: all;
	font-size:1.6rem;
 color:#10A982 !important;
}

.h2,.h2g{
 margin-bottom:1em;}

#seite {
 margin:0 auto; max-width:960px;	width:100%;
	background:none;}

#innerseite{
 font-family:raleway, helvetica, sans-serif;
 font-size:.87em;
 font-weight:normal;

 padding:12px;
 padding-top:0;
 padding-left:0;
 padding-bottom:0;}

#innerseite a{
 color:#10A982;}


#copy{
 display:table-cell;
 float:right;
 text-align:right;
 vertical-align:bottom;
 padding-top:25px;
 font-weight:bold;}

#kopf {
 text-align:center;
 margin:0;padding:0;
 margin:0 auto;
 height:140px;
 width:100%;
 max-width:960px;}

#idx{
 padding-top:15px;
 margin:auto;}

#idx img{
 width:241px;}

.fl{
 float:left;}

.big{
 font-weight:normal;
 line-height:100%;
 font-size:6em;}

.noprint { display:none; }

#innerkopf {
 margin:auto;
 padding-top:5px;}
 
#navigation{
 white-space:nowrap;
 position:absolute;
 z-index:99;
 top:129px;
 left:50%;
 width:960px;
 background-color:#fff; 
 box-shadow:1px 1px 6px #D6D5D6;
 clear:both;
 margin:0;
 margin-left:-495px;
 display:inline-block;}

#navigation ul{
 display:inline-block;
 margin:0;
 padding:0;
 width:100%; }

#navigation ul li{
 margin:0;
 padding:0;
 display:inline-block;}

li a{margin:0; padding:0;}

#unterkopf{
 z-index:1;
 background-size:auto 500px;
 height:407px;
 border:none;}

.box{
 width:12px;
 height:12px;
 display:inline-block;
 border:1px solid #10A982;
 background-color:#FFFFFF;
 cursor:pointer;
 opacity:.5}

.box .on{
 width:17px;border:1px solid #CFE7DC;
 background-color:#CFE7DC;}

#content{
	padding:1rem 15px;
	min-height:400px;
	font-size:1rem !important;
	line-height:175%;
	clear:both;
	margin:auto;
	background-color:transparent; width:960px;}

#content{

 	width:100%;
	max-width:960px;}

[id^=innercontent],
#innercontent{
	margin-top:10rem;
	font-size:1em;
	display:inline-block;
 	width:100%;
	max-width:960px;}

.griddy{
	background: #E1EDE5;padding:2% 2%;margin:2px;}

.column{
	column-fill: balance;
	column-rule-style: solid;
	column-rule-color: white;
	column-rule-width: 2px;
	column-width: 50%;
	column-gap: 2%;
  column-count: 2;}


#innercontent_leistungen img{ width:50px;float:left;padding:0 1rem 0 0 ;}

#innercontent_leistungen b{
	font-size:500;}
#innercontent_leistungen h3,
#innercontent_leistungen h4{margin-top:0;margin-bottom:0rem;font-weight:700;font-size:1.2rem}

#innercontent_leistungen ul li::before{ content "- ";}

#innercontent_leistungen ul {
	margin:0 0 0 3rem;
	padding:0;
  position: relative;
  list-style-image:url(media/pfeil.png);}

#innercontent_leistungen li::before {
	color:#10A982;}

#innercontent_leistungen ul li ul{
	margin:0 -1rem 0 2rem;
  position: relative;
  list-style: none;}

#innercontent_leistungen li{

	margin-bottom:1rem;
	padding:0rem;}

#innercontent_leistungen li ul{
	padding:0;
	margin-left:0rem !important;}

#innercontent_leistungen li ul li{
	margin-bottom:.25rem;
	margin-left:1rem;}

#innercontent_leistungen ul li ul li::before {
  content:'-';
  position: absolute;
  left: 0;}

.snav,.nav,.nava,.orange{
	margin:0;
	margin:0 0px;
	min-width:100px;
	padding:9px 20px;
	text-decoration:none;
	display:inline-block;
	color:#000;
	font-size:1.3em;
	font-weight:normal; }

.snav,.nav:hover,.snav:hover,.nava,.nava:hover{
 color:#10A982;}

.nav:hover,.nava,.nava:hover{
 background-color:#CFE7DC;}

.snav,.orange{
 line-height:125%;
 font-size:.9em;
 font-family:raleway, helvetica, sans-serif;
 color:#000000 !important;}

.snav:hover,.orange{
 display:inline-block;
 width:100%;}

#sub1,#sub2{
 display:none;
 overflow:hidden;
 position:absolute;left:-1000px;top:-1000px;
 background-repeat:no-repeat;
 background-position:0 bottom;
 padding-bottom:5px;
/* background-color:#CFE7DC;
 box-shadow: 2px 4px 4px rgba(0, 0, 0, 0.5);
 */}

#umk{
 width:930px;
 margin:auto;}

.k{
 overflow:hidden;
 line-height:100%;
 padding-bottom:5px;}

#fuss {
	width:100%;
	background-color:#eee;
	border:1px solid #10A982;
	border-width:1px 0;
	margin:0;
	display:flex;
	align-items:center;
	text-align:center;}

#innerfuss {
	width:100%;
	vertical-align:top;
	max-width:960px;
	margin:0 auto;
	display:inline-block;}

#unterfuss {
 text-align:center;
 width:960px;
 height:34px;
 margin:auto; }

#unterfuss a,#unterfuss .fb-like{
 margin:0 7px 0 7px;
 text-decoration:none;
 color:#000000;}

img{
 vertical-align:middle;
	max-width:100vw;
 border:none; }

p{
 margin-top:0;
 margin-bottom:1em;}

hr{
 height:1px;
 border:none;
 background-color:#929292;
 color:#929292;}

.banner{
 display:inline-block;
 float:left;
 margin:14px 0 9px 0;
 margin-right:9px !important;
 height:122px;
 color:#000000;
 background-color:#FFFFFF;
 width:250px; }
.banner img{
 max-width:250px;}

.last{ margin-right:0;}

.cb{clear:both;}

.cb2{
 margin-bottom:1em;}

form p {
 margin-top:1em;
 margin-bottom:0;}

.cke_show_borders, #cke_19_text, #cke_20_text, .cke_panel, .cke_rcombopanel .cke_panel_block {
 background:none;}

.link{
 display:inline-block;
 margin-bottom:1em;
 text-decoration:none;
 color:#000000 !important;}

.link:hover{}

.link:before{
 text-decoration:none !important;
 margin-right:5px;
 color:#CFE7DC;
 content: '\02192';}

#gitter1 { width:960px;height:518px;background-repeat:no-repeat;background-image:url(media/hline.png);background-position:left 50%;}
#gitter2 { width:960px;height:518px;background-repeat:no-repeat;background-image:url(media/vline.png);background-position:50% top;}

.square {
 background:none;
 display:inline-block;
 float:left;
 width:475px;
 height:262px;
 padding:2px;
 overflow:hidden;}

.squarediv{
background-size:contain;
background-repeat:no-repeat;
 cursor:pointer;
 height:255px !important;
 width:470px !important;}

.squaretext{
 padding:10px;
 font-size:.9em;
 line-height:1.4em;}

.l10{
 float:left;text-align:left;
 margin-left:15px;}

.r10{
 float:right;text-align:right;
 margin-right:5px;}

.hggreen{
 padding:8px 3px;
 background-color:#10A982;
 color:#FFFFFF;
}


h1,h3{
 font-family:raleway, helvetica, sans-serif;
	font-size:1.5rem;
 margin-bottom:1rem;}

.redline{
 font-size:1pt;
 font-weight:normal;
 text-decoration:none;
 border-bottom:2px #cc0000 solid;}

#bigbutton{
 background:none;
 background-color:transparent;
 border:none;}

#bigbutton:hover{
 cursor:pointer;
 background-image:url(layout/pfeile.png);
 background-position:center center;
 background-repeat:no-repeat;}

#chk{ /* Test-DIV, wird per Javascript inkludiert und "vermessen" für die Umrechnung mm<->px */
 position:absolute;
 top:-100mm;left:-100mm;
 width:100mm;
 height:100mm;
 background-color:transparent;}

#vcontent{
 max-width:960px;
 font-family:raleway, helvetica, sans-serif; /* 'Arial';*/
 color:#000000;
 font-size:12pt;}
#vcontent table{
 max-width:960px;}

.mybutton{
 font-family:raleway, helvetica, sans-serif;
 font-size:10.5pt !important;
 display:inline-block;
 min-width:120px !important;
 font-weight:normal !important;
 cursor:pointer;
 text-align:center;
 text-decoration:none !important;
 padding:2px 5px;
 border:none;
 border-radius:3px;
 box-shadow:1px 1px 2px #333;
 background-color:#ccc;
 margin-top:0px;
 margin-bottom:5px;
 margin-left:0px;
 margin-right:5px;
 background:linear-gradient(0deg, #ccc 0%,#fff 100%); }

.mybutton:hover{
 margin-top:2px;
 margin-bottom:3px;
 margin-left:2px;
 margin-right:3px;
 box-shadow:0px 0px 1px #333;
}

label {
 display: block;
 width:100px;
 padding-left: 25px; 
 text-align:right;
 margin-bottom:5px;
 cursor: pointer;
 position: relative;
 margin-right: 15px;
 font-size: 11pt;} 

label:before {
 content:"";
 display:inline-block;
 width: 12pt;
 height:12pt;
 margin-right:10px;
 position:absolute;
 left: 0;
 bottom:2px;
 border:1px solid #999;
 border-radius:3px;
/* background-color: #e0e0e0;
 box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .2), 0px 1px 0px 0px rgba(255, 255, 255, .8);
*/
 }

.eingabe_fehlt{
 border-radius:3px;
 border:1px solid #cc0000 !important;
 background-color:#ffeeee !important;}

span.eingabe_fehlt{
 padding-left:5px;
 padding-right:5px;}

.pflicht{
 font-size:10pt;}

label{
 text-align:left;
 display:inline-block;}

label.r{
 text-align:right;}

label.l25_40{
 width:40px;
 padding-top:2px;
 padding-left:25px;}

label.l25{
 padding-left:25px;}

#kartenanzahl,
#adressen{
 width:100%;}

#kartenanzahl td,
#adressen td {
 font-family:raleway, helvetica, sans-serif; /* 'Arial';*/
 font-size:11pt;}

.rtitle{
 display:inline-block;
 font-size:13pt;
 margin-bottom:.5em;
 font-weight:bold;
 color:#cc0000;}

.preise,.preise1{
 display:inline-block;
 width:90px;
 text-align:right;
 font-weight:bold;
 color:#cc0000;}

.tpreise{
 display:inline-block;
 text-align:left;
 width:100px;}

.preise1{
 text-align:right;
 width:110px;
 font-weight:bold;
 color:#000;}

.red{
 font-weight:bold;
 color:#cc0000;}

.radio label:before {
  border-radius: 8px;}

.checkbox label {
 margin-bottom: 10px;}

.checkbox label:before {
 border-radius: 3px;}

input[type=radio]:checked + label:before {
 content: "x";
 color: #333;
 text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
 font-family:raleway, helvetica, sans-serif;
 font-weight:normal;
 font-size: 11pt;
 line-height: 10pt;
 text-align: center;}

input[type=checkbox]:checked + label:before {
 content: "x";
 text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
 font-family:raleway, helvetica, sans-serif;
 font-weight:normal;
 font-size: 11pt;
 line-height: 10pt;
 color: #333;
 text-align: center;}

.mycheckbox{
 cursor:pointer;
 margin-right:5px;
 margin-bottom:5px;
 border:1px solid #999;
 background-color:transparent;
 border-radius:3px;}

.hide{
 display:none;}

.green{
 font-weight:bold;
 color:#009900;
 font-size:11pt;}

.btext{
 cursor:pointer;
 font-weight:bold;
 display:inline-block;
 background:none;
 border:none;
 margin:0;
 padding:0;}

sup{
 font-size:xx-small;}

.inl{
 display:inline;
 margin:0;
 padding:0;}

.bdivcss{
 background-color:#fff;
 border:1px solid #ccc;
 height:150px;
 width:150px;}

.bsmall{
 font-family:raleway, helvetica, sans-serif; /* Arial,sans-serif;*/
 font-size:8pt;
 color:#333; }

.remove_x{
 z-index:2001; /* TOP-ZIndex bei Drag/Drop ist 1000 (siehe drag.js.php) */
 position:relative;
 vertical-align:top;
 padding:1px;
 padding-left:5px;
 padding-right:5px;
 margin-left:-19px;
 margin-top:-5px;
 border-radius:15px;
 text-decoration:none;
 font-weight:bold;
 background-color:transparent;
 color:#cc0000;}

.remove_x:hover{ /* nochmals hervorheben, wenn Maus drüber */
 color:#ffff00;
 background-color:#ff0000;
}

.link,.text{
 color:#333;
 font-size:12pt;
 text-decoration:none;
 font-family:raleway, helvetica, sans-serif; /* 'Arial';*/}

.link:hover{
 text-decoration:underline;}

img{
 border:none; }

fieldset{
 padding:20px;
 border-color:#aaa;
 margin-bottom:10px;
 border-radius:5px;
 border:none;}

legend{
 padding-left:10px;
 padding-right:10px;
 font-weight:700;}

form{
 margin:0;padding:0; }

input[type="email"],
input[type="text"],textarea,select{
 border-radius:3px;
 background-color:#f8f8f8;
 padding:2px;
 height:20px;
 font-size:12pt;
 border:1px solid #999;}

.inp2{
 font-family:raleway, helvetica, sans-serif;
 font-size:11pt !important;
 width:400px;}

.i330{
 width:330px !important;}

.i60{
 width:60px !important;}

select{
 font-size:11pt;
 height:24px;}

hr{border:none;background-color:#000000;color:#000000;}

.L{
 height:10px;
 line-height:10px;
 font-size:10px; }

.L5{
 height:5px;
 line-height:5px;
 font-size:5px; }

.cp2{
 vertical-align:top;
 display:inline-block;
 padding-top:12px;
 margin-bottom:6px;}

input[type="submit"],input[type="button"],.cp,.cp2{
 cursor:pointer;}

input[type="email"],
input[type="text"],select{background-color:#ffffff;}

#s{
 margin-top:5px;
 margin-bottom:5px;
 background-color:#ffffff;
 font-weight:bold;
 font-size:11pt;
 text-align:center;
 border:1px solid #ccc;}


#seite2 {
 margin:auto;
 padding:10px;
 font-size:12pt;
 width:960px;
 min-height:665px;
 border:none;
 margin-top:0px;
 margin-bottom:1px;
 background-color:#fff;
 width:842px;
 min-width:653px;}

abbr{
 cursor:help;
}

.link{
 color:#fff;}

.link2{
 color:#333;text-decoration:underline;}

.one2four{
 z-index:0;
 position:absolute;
 top:293px;
 left:50%;
 margin-left:-660px;}

.greenshoe{
display:none;
 margin-left:204px;
 margin-top:120px;}

.font01{ min-height:20px;font-family: 'Arial';}
.font02{ min-height:20px;font-family: 'Tahoma';}
.font03{ min-height:20px;font-family: 'Verdana';}
.font04{ min-height:20px;font-family: 'Helvetica';}
.font05{ min-height:20px;font-family: 'Times';}
.font06{ min-height:20px;font-family: 'bitstream_vera_serif';}
.font07{ min-height:20px;font-family: 'gadaj';}
.font08{ min-height:20px;font-family: 'jaapokki';}
.font09{ min-height:20px;font-family: 'bolina';}
.font10{ min-height:20px;font-family: 'beautiful_es';}
.font11{ min-height:20px;font-family: 'rundschrift_cat';}
.font12{ min-height:20px;font-family: 'freebooter_script';}
.font13{ min-height:20px;font-family: 'louisacp';}
.font14{ min-height:20px;font-family: 'modeschrift';}
.font15{ min-height:20px;font-family: 'rundkursiv';}
.font16{ min-height:20px;font-family: 'handschrift';}
.font17{ min-height:20px;font-family: 'norse';}
.font18{ min-height:20px;font-family: 'daggersquare';}
.font19{ min-height:20px;font-family: 'bebas_kai';}
.font20{ min-height:20px;font-family: 'breamcatcher';}
.font21{ min-height:20px;font-family: 'furgatorio';}
.font22{ min-height:20px;font-family: 'alanus';}
.font23{ min-height:20px;font-family: 'high_sans_serif_7';}
.font24{ min-height:20px;font-family: 'lovinn';}
.font25{ min-height:20px;font-family: 'kilsonburg';}
.font26{ min-height:20px;font-family: 'manbow';}
.font01,.font02,.font03,.font04,.font05,.font06,.font07,.font08,.font09,.font10,.font11,.font12,.font13,.font14,.font15,.font16,.font17,.font18,.font19,.font20,.font21,.font22,.font23,.font24,.font25,.font26{
 font-size:12pt;}
.thumbnail{
 cursor:pointer;
 max-width:145px;
 max-height:145px;
 margin:2px;}

.thumbnail_wrapper{
 cursor:pointer;
 max-width:150px;
 max-height:150px;
 margin:2px;}


.f{background-color:inherit;}

.sbutton,.sbutton3,.sbutton2{
 cursor:pointer;
 display:inline-block;
 min-width:15px;
 line-height:19px;
 height:19px;
 text-align:center;
 padding:2px;
 margin-top:2px;
 background-color:#ccc;}

.sbutton,.sbutton3{
 border:1px outset #999;}

.sbutton2,.sbutton3:hover{
 border:1px inset #999;}

.b60,.b100,.b155{
 font-family:raleway, helvetica, sans-serif;
 display:inline;float:left;
 font-size:10.5pt;
 text-align:center;
 cursor:pointer;
 background-image:url(layout/b100.png);
 min-width:120px;
 height:30px;
 font-weight:bold;
 background-repeat:no-repeat;
 padding-left:0px;
 padding-top:0px;}

.b60:hover,.b100:hover,.b155:hover{
 display:inline;float:left;
 background-image:url(layout/b100a.png);
 min-width:118px;
 height:28px;
 background-repeat:no-repeat;
 padding-left:2px;
 padding-top:2px;}

.b60{
 background-image:url(layout/b60.png);
 min-width:63px;}

.b60:hover{
 background-image:url(layout/b60a.png);
 min-width:61px;}

.b155{
 background-image:url(layout/b155.png);
 width:153px;}

.b155:hover{
 background-image:url(layout/b155a.png);
 min-width:151px;}

.b190,.b190a,.b190:hover{
 display:inline-block;float:left;
 font-size:10.5pt;
 text-align:center;
 cursor:pointer;
 background-image:url(layout/b190.png);
 background-repeat:no-repeat;
 min-width:187px;
 height:30px;
 margin-right:5px;
 padding-left:0px;
 padding-top:0px;}

.b190a,.b190:hover{
 background-image:url(layout/b190a.png);
 min-width:185px;
 height:28px;
 padding-left:2px;
 padding-top:2px;}

.b190a,.b190a:hover{
 padding-top:6px;
 height:27px;
 font-size:10pt;
 font-weight:bold;
 background-image:url(layout/b190a1.png);}

#subplane{
 margin-top:5px;
 font-size:11pt;
 height:30px;
 vertical-align:middle;}

.r5{
 margin-right:14px;}

.feld{
 border:1px solid #ccc;
 width:40px;}

#p1,#p2,#p3,#p4,#p5,#r1,#r2,#r3,#r4,#r5{
 line-height:125%;
 position:absolute;
 display:inline-block;
 white-space:nowrap;
 margin:0px;
 padding:0;
 border:none;
 overflow:hidden;}

#p1,#p2,#p3,#p4,#p5,#p6,#r1,#r2,#r3,#r4,#r5,#r6{
 position:absolute;
 display:inline;
 overflow:hidden;}

#p1{ z-index:10;}
#r1{ z-index:10;}
#p2{ z-index:20;}
#r2{ z-index:20;}
#p3{ z-index:30;}
#r3{ z-index:30;}
#p4{ z-index:40;}
#r4{ z-index:40;}
#p5{ z-index:50;}
#r5{ z-index:50;}


#p6{ z-index:7;}
#r6{ z-index:7;}


#p1:hover,#p2:hover,#p3:hover,#p4:hover,#p5:hover,#p6:hover,#r1:hover,#r2:hover,#r3:hover,#r4:hover,#r5:hover,#r6:hover{
 cursor:pointer;
 margin:0px;
}


th{
 border-bottom:1px solid #999;
 font-family:raleway, helvetica, sans-serif; /* 'Arial';*/
 font-weight:normal;text-align:left;
 font-size:12pt;}

.mass{
 border:1px solid #ccc;
 width:40px;}

#upload,#datenemail{
 z-index:101;
 width:400px;
 height:300px;
 margin:auto;
 position:absolute;top:140px;left:50%;
 margin-left:-200px;
 border:2px outset #cccccc;
 background-color:#FFFFFF;
 display:none;}

#shadow,#shadow2{
 z-index:100;
 display:none;
 width:400px;
 height:300px;
 margin:auto;
 position:absolute;top:120px;left:50%;
 margin-left:-185px;
 background-image:url(layout/shadow.png);}

#plane{
 display:block;
 box-shadow:1px 1px 3px #666;
 margin:0;
 padding:0;
 height:250px;
 width:850px;
 overflow:hidden;
 border-bottom:none;
 border-right:none;}

#plane2{
 background-color:#fff;
 display:block;
 box-shadow:1px 1px 3px #666;
 margin:0;
 padding:0;
 height:250px;
 width:850px;
 overflow:hidden;
 border-bottom:none;
 border-right:none;}

#Name_plane,#Name_plane2{
 cursor:pointer;
 font-weight:bold;
}

.di{display:inline-block;}
.cb{clear:both;}

#anzbilder_hinweis{
padding-top:10px;}


/*** Bildupload ********************************/
#dragandrophandler
{
 display:inline-block;
height:90px;
width:135px;
color:#333;
text-align:left;
vertical-align:middle;
padding:5px;
padding-top:50px;
text-align:center;
font-size:100%;}

.progressBar {
 width: 150px;
 height: 22px;
 border: 1px solid #ddd;
 border-radius: 5px;
 overflow: hidden;
 display:inline-block;
 margin:10px 0px 0px 0px;
 vertical-align:top;}
 
.progressBar div {
 height: 100%;
 color: #fff;
 text-align: center;
 line-height: 22px; /* same as #progressBar height if we want text middle aligned */
 width: 0;
 background-color: #0ba1b5; border-radius: 3px;}

.statusbar{
 min-height:40px;
 min-width:145px;
 display:inline-block;
 overflow:hidden;
 vertical-align:top;}

.statusbar:nth-child(odd){
}

.filename{
 display:inline-block;
 display:none;
 vertical-align:top;
 width:250px;}

.filesize {
 display:inline-block;
 display:none;
 vertical-align:top;
 color:#30693D;
 width:100px;
 margin-left:10px;
 margin-right:5px;}

.abort{
 background-color:#A8352F;
 border-radius:4px;
 display:inline-block;
 color:#fff;
 font-family:raleway, helvetica, sans-serif; /* Arial,sans-serif;*/
 font-size:13px;
 font-weight:normal;
 padding:4px 15px;
 cursor:pointer;
 vertical-align:top }

b,strong{
 font-weight:700 !important;
 font-family:raleway, helvetica, sans-serif;}

i,em{
 font-family:mtlfonti;}

strong>i, strong>em, b>i,b>em, i>strong, em>strong, i>b, em>b{
 font-family:mtlfontb;font-style:italic;}

#submit_next{
 position:relative;left:-400px;}

#farbwahl{
 text-align:center;
 border:none;
 margin:0;
 padding:0;
 white-space:nowrap;
 height:280px;
 width:280px;
 margin-top:5px;
 margin-bottom:10px;}

#farbwahl div{
 border-radius:6px;}

.dfield{
 text-align:center;
 margin-right:60px;
 display:inline;float:left;}

.dfield a{
 text-decoration:none;
 color:#333;
 font-size:16pt;
 font-weight:normal;}

.dfield a small{
 font-size:8pt;}


.dfield a:hover{
 text-decoration:underline;}

.hm1,.hm2,.hm3{
 font-size:16pt;
 float:right;
 padding:3px;
 padding-left:10px;
 padding-right:10px;
 border:none;
 border-radius:5px;
 border:1px solid #333;
 margin-bottom:4px;}

.hm1,.hm2{
 margin-right:10px;}

.hm1.on, .hm2.on, .hm3.on{
 border:1px solid #cc0000;
 background-color:#eee;}

.footerdiv{
	font-size:1rem;
	color:#000;
	display:inline;
	float:left;
	width:25%;
	padding:1rem 15px;
	text-align:left;}

.footerdiv a:hover{
	text-decoration:underline;}

.footerdiv a{
	color:#10A982 !important;
	font-size:1rem;}

/***********************************************/

#container{height:450px;width:100%;}
#slider{position:relative;}
#slider img{position:absolute;z-index:1;}
#slider img.active{z-index:3}

#imargin{margin-top:16rem;}

@media (max-width: 960px) {
#imargin{margin-top:0rem;}
div[id^="innercontent"],	#innercontent{
		 margin-top:2rem !important;}

	#container{min-height:165px !important; height:auto;}

	#navigation{
		background:rgba(255,255,255,.8);}
	#navigation,
	#navigation ul li a,
	#navigation ul li{
		display:block;}

	#navigation {
	  transition: height .3s ease-in-out;
		top:0;
	  height: 2.3rem;
	  overflow: hidden;
	  position: relative;
	  background-color: rgba(255,255,255,.3);
	  color: #10A982;
	  transition: height 0.3s ease;
		margin-bottom: -129px;}

	#navigation ul {
	  list-style: none;
	  padding: 0;
	  margin: 0;}

	#navigation ul li {
		width:100%;
	  border-bottom: 1px solid #444;}

	#navigation ul li a {
	  color: black;
	  text-decoration: none;
	  pointer-events: none;}

	#navigation.open ul li a {
  pointer-events: auto;}

	#seite{width:100vw;}
	#seite{width:100%;}

	#navigation::after {
	  content: "▼";
		position:absolute;
	  top:0;
		right:20%;
		width:20%;
		text-align:right !important;
		z-index:100;
	  top: 1rem;
	  transform: translateY(-50%);
	  font-size: 1.5rem;
	  transition: transform 0.3s ease;
	  cursor: pointer;}

	#navigation.open {
	background:white;}
	#navigation.open::after {
	  content: "✖";
	  transform: none;
	  font-size: 1.5rem;
	  top: 2px;}

	#navigation.open {
	  height: auto;}

	#seite,#innerseite{
		max-width:90vw;}

	.column{
		column-fill: balance;
		column-rule-style: solid;
		column-rule-color: white;
		column-rule-width: 2px;
		column-width: 100%;
		column-gap: 2%;
	  column-count: 1;}
}

@media (max-width: 560px) {
	#navigation::after {
	  right:25%;
		width:25%;
}}

@media (max-width: 480px) {
	#navigation::after {
	  right:30%;
		width:30%;
}}

@media (max-width: 360px) {
	#unterkopf,#container{min-height:100px !important; height:auto !important;
}}


.row{
	clear:both !important;
	display:block;
	width:100% !important;}

.row>p{
	margin-top:.5rem !important;}

.row::before,
.row::after {
  content: " ";
  display: table;} 

.row::after {
  clear: both;}

.row {
  *zoom: 1;} /* Für den IE6 und IE7 */

.col-2{
	display:inline-block;
	float:left;
	width:16.66%;}

.col-4{
	display:inline-block;
	float:left;
	width:33.33%;}

.col-6{
	display:inline-block;
	float:left;
	width:50%;}

.col-8{
	display:inline-block;
	float:left;
	width:66.66%;}

.col-1{
	display:inline-block;
	float:left;
	width:8.3%;}

.col-10p{
	display:inline-block;
	float:left;
	width:10%;}

.col-3{
	display:inline-block;
	float:left;
	width:25%;}

.col-5{
	display:inline-block;
	float:left;
	width:42%;}

.col-7{
	display:inline-block;
	float:left;
	width:58%;}

.col-9{
	display:inline-block;
	float:left;
	min-width:75%;
	width:75%;}

#proofform{
	line-height:150%;
	padding:10px 30px !important;
	background:#CFE7DC;
}

#proofform input[type="radio"],
#proofform input[type="checkbox"]{
	display:none;}

#proofform .black{
	color:#000 !important; }

#proofform a:hover{
	text-decoration:underline;}

#proofform input[type="submit"]{
	background:#B3CFBF;
	font-size:1.2rem;
	color:#000;}

#proofform small{
	hyphens:auto;}

#proofform a[href^="tel:"] {
	color:#000;}

#proofform .nw{
	white-space:nowrap !important;}

#proofform label {
	display: block;
	width:85%;
	padding-left: 25px; 
	text-align:left;
	cursor: pointer;
	margin-right: 15px;
	font-size: 11pt;} 

#proofform label:before {
	content:"";
	background:#B3CFBF;
	vertical-align:top;
	display:inline-block;
	width: 12pt;
	height:12pt;
	margin-right:10px;
	position:absolute;
	left: 0;
	top:3px;
	border:1px solid #999;
	border-radius:3px; }

#_proofform input:not(:checked):required + label{
	box-shadow:0 0 4px 2px rgba(255,0,0,.6);
}

#proofform input[type=checkbox]:checked + label:before,
#proofform input[type=radio]:checked + label:before {
 content: "x";
 text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
 font-family:raleway, helvetica, sans-serif;
 font-weight:normal;
 font-size: 12pt;
 line-height: 10pt;
 background: white;
 color: #57A282;
 text-align: center;}

#proofform h1, #proofform h2, #proofform h3{
	font-weight:normal;}

#proofform h3{
	margin-top:2rem;}
#proofform h3 span{
	cursor:pointer;}

#proofform  table{
	width:95%;}

.dropzone{
	font-weight:bold;
	color:#57A282 !important;
	margin:0 0 2rem 0;
	width:92% !important;
	background:#B3CFBF !important;}
#proofform table th,#proofform table td{
	vertical-align:top;
	padding:2px 10px;
	text-align:left;}

#proofform table th{
	color:#fff;
	font-weight:bold;
	background:#10A982;}

#proofform table tr:nth-child(odd) td{
	background:#B3CFBF;}

#proofform input[type="text"],
#proofform input[type="email"],
#proofform select,
#proofform textarea{
	background:#B3CFBF;
	font-size:1rem;
	font-family:inherit;}

#proofform select{
	height:150%;
	margin-bottom:1.5rem;}

#proofform textarea,
#proofform input[type="text"],
#proofform input[type="email"]{
	color:#000;
	padding:2px;
	margin: 1rem 0 0 0rem;
	width:90%;}

#proofform textarea{
	width:95%;
	height:5rem;overflow:auto;}

#proofform small{
	text-indent:-.85rem;
	margin-left:1rem;
	display:inline-block;
	width:95%;
	font-size:.75rem;line-height:120% !important;}

#togglearea{
	display:none;}