html {
   padding:0px;
   margin:0px;
   height: 100%;
}
body {
	font-family: Verdana,Arial,Helvetica,sans-serif;
	color: #000000;
	text-decoration: none;
	padding: 0px;
    margin: 0px;
	text-align:center;
	font-size: 11px;
	width: 100%;
	height: 100%;
	background: transparent url(img/segmente/hg_main.gif) repeat 0 0;
}
div,table {
	text-align:left;
}
form {
	margin: 0px;
	padding: 0px;
}
img {
	border: 0px;
}
h1 {
	font-size: 14px;
}
h4 {
	font-size: 12px;
	text-decoration:none;
	margin:5px;
}
a {
	color: #760000;
	text-decoration: none;
}
a:hover {
	color: #000;
	text-decoration: underline;
}
p {
	line-height: 135%;
}
/*Boxmodell*/
#wrapper {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position:absolute;
    }


#topright{
    width: 100%;
    height: auto;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_re_ob.gif) no-repeat top right;
    }

#topleft{
    width: 100%;
	 min-width:800px;
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_li_ob.gif) no-repeat top left;
    }

#bgleft{
    width: 100%;
	 min-width:800px;
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_li2.gif) repeat-y top left;
    }

#bgright{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_re2.gif) repeat-y top right;
    }


#bottomleft {
    width: 100%;
	 min-width:800px;
    height: 100%;
    margin:0;
    padding:0;
    position: relative;
    background: transparent url(img/segmente/hg_li_un.gif) no-repeat bottom left;
    }

#bottomright {
    width: 100%;
    height: 100%;
    margin:0;
    padding:0;
    position: relative;
    background: transparent url(img/segmente/hg_re_un.gif) no-repeat bottom right;
    }

#bgtop{
    width: 100%;
	 min-width:800px;
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_ob3.gif) repeat-x top left;
    }

#bgbottom{
    width: 100%;
	 min-width:800px;
    height: 100%;
    margin: 0px;
    padding: 0px;
    position: relative;
    background: transparent url(img/segmente/hg_unten.gif) repeat-x bottom left;
    }

#content {
	clear:both;
	padding:15px 5px 60px 65px;
	/*font-size: 12px;*/
	font-size:1.1em;
	font-family:Verdana, Geneva, sans-serif;
	line-height: 125%;
	width:690px;
	margin: 0 auto;
	text-align: left;
}
.nojs {
	border: 1px solid rgb(122, 40, 40);
	text-align:center;
	margin: 0px 0pt 0pt;
	width: 100%;
	height: 30px;
	line-height: 30px;
	color: rgb(0, 0, 0);
	background-color: rgb(212, 72, 72);
}
#menu {
	text-align: center;
	background: transparent url(img/segmente/hg_oben.gif) no-repeat top center;
	width:700px;
	margin: 0 auto;
	height: 70px;
	padding: 10px;
}
ul.menu {
	margin: 0;
	margin-top: 8px;
	margin-left:36px;
	height:30px;
	padding: 0;
	list-style: none;
	width: 100%;
}
ul.menu li {
	display: inline;
	float:left;
	padding: 0;
	margin: 0px 1px;
}
ul.menu li a {display:block; height: 32px; padding: 0px 0px 3px 0px ;}  /*12px 0px*/
a.home span {
	visibility: hidden;
}
a.home {
	 width:75px;	 
	 text-decoration: none;
     background:transparent url(img/menu/1home.gif) no-repeat top left;
}
a.home:hover {
    background-position: 0px -36px;
    }

a.angebote span {
	visibility: hidden;
}
a.angebote {
	width:195px;
	text-decoration: none;
    background:transparent url(img/menu/3preise.gif) no-repeat top left;
	 
    }
a.angebote:hover {
    background-position: 0px -36px;
    }
a.bestellung span {
	visibility: hidden;
}
a.bestellung {
	width:129px;
	text-decoration: none;
    background:transparent url(img/menu/4bestellung.gif) no-repeat top left;
    }
a.bestellung:hover {
    background-position: 0px -36px;
    }
a.referenzen span {
	visibility: hidden;
}
a.referenzen {
	 padding: 12px 30px 10px 5px;
	 text-decoration: none;
    background:transparent url(img/menu/5referenzen.gif) no-repeat top left;
	 min-height: 71px;
    }
a.referenzen:hover {
    background-position: 0px -36px;
    }
a.vorlagen span {
	visibility: hidden;
}
a.vorlagen {
	width:116px; 
	text-decoration: none;
    background:transparent url(img/menu/5vorlagen.gif) no-repeat top left;
    }
a.vorlagen:hover {
    background-position: 0px -36px;
    }
a.kontakt span {
	visibility: hidden;
}
a.kontakt {
	width: 103px;
	text-decoration: none;
    background:transparent url(img/menu/6kontakt.gif) no-repeat top left;
    }
a.kontakt:hover {
    background-position: 0px -36px;
    }
body#home a.home, body#angebote a.angebote, body#nadelbuttons a.angebote, body#magnetbuttons a.angebote, body#flasche_spiegel a.angebote,
body#schluessel a.angebote, body#kroko-clip a.angebote, body#kleidung a.angebote, body#butterfly a.angebote, body#spezial a.angebote, body#konfektionierung a.angebote, body#preise a.preise, 
body#bestellung a.bestellung, body#referenzen a.referenzen, body#vorlagen a.vorlagen, body#kontakt a.kontakt, body#bsp2 a.referenzen, 
body#bsp3 a.referenzen, body#bsp4 a.referenzen, body#bsp5 a.referenzen, body#bsp6 a.referenzen, body#bsp7 a.referenzen, body#bsp8 a.referenzen, 
body#bsp9 a.referenzen {background-position: 0px -36px;}
#submenu {
	clear:both;
	width: 620px;
	height: 100px;
	margin: 0 auto;
	margin-top: 20px;
	padding-bottom:3px;
	font-size:12px;
	background: transparent url(img/segmente/linkmenu.gif) no-repeat bottom center;
}
.logo {
	float:left; margin-right:10px; margin-left:5px;
}
.english {
	float:right;
	margin-top:75px;
	text-decoration: none;
	height: 18px;
	background: transparent url(img/segmente/text_engl.gif) no-repeat top center;
}

.english:hover {
	background: transparent url(img/segmente/text_engl2.gif) no-repeat top center;
	text-decoration: none;
}
.deutsch {
	text-decoration: none;
	height: 18px;
	background: transparent url(img/segmente/text_ger.gif) no-repeat top center;
	float:right;
	margin-top: 1px;
}
.deutsch:hover {
	background: transparent url(img/segmente/text_ger2.gif) no-repeat top center;
	text-decoration: none;
}
.top {
	float:right;
	font-size:90%;
	margin: 15px 25px 15px 0px;
	background: transparent url(img/content/arrow_up.png) no-repeat top right;
	padding-right: 20px;
}

.tab {
	margin-left: 5px;
}
.td {
	vertical-align:top; padding-top: 12px;
}
.liste {
	list-style: square;
}
/*Kontakt- Formular*/

.formmaileralles {
	margin-bottom: 0px;
	margin-top: 5px;
	margin-left: 25px;
	width: 520px;
}
.formmaileralles p {
	clear: both;
	float: left;
}

.formmailertext {
	width: 240px;
	display: block;
	clear: none;
	float: left;
	padding: 3px;
}

.formmailertextrechts {
	width: 240px;
	display: block;
	clear: right;
	float: left;
	padding: 3px;
}
.formmailertextfeld {
	border: 1px solid #C85500;
	margin-top:2px;
	background-color: #FFF;
	width: 230px;
	color: #000;
}
.formmailertextfeld:hover {
	background-color: #e8e8e8;
}
.formmailertextfeldspam {
	border: 1px solid #C85500;
	background-color: #fff;
	width: 80px;
	text-align: center;
	padding: 3px;
	margin: 0px 25px 0px 3px;
	color: #000;
}
.formmailertextfeldspam:hover {
	background-color: #e8e8e8;
}
.formmailertextfeldlang {
	border:1px solid #C85500;
	background-color: #fff;
	width: 475px;
	margin-left: 3px;
	margin-top:2px;
	color: #000;
}
.formmailertextfeldlang:hover {
	background-color: #e8e8e8;
}
.formmailertextarea {
	border: 1px solid #C85500;
	background-color: #fff;
	width: 475px;
	margin-top:2px;
	margin-left: 3px;
	height: 70px;
	color: #000;
}
.formmailertextarea:hover {
	background-color: #e8e8e8;
}
.formmailerbutton {
	border:1px solid #000;
	height: 22px;
	width: 150px;
	margin-right: 10px;
	border: 1px solid #333;
	/*background-color: #fff;*/
	margin-top: 5px;
	margin-left: 50px;
	color: #000;
}
/*.formmailerbutton:hover{
	color:orange;
}*/
.formmailerimg {
	text-align: left;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	height: 10px;
	width: 10px;
}
.multi {
	border: 1px solid #C85500;
	margin-top:5px;
	margin-left: 3px;
	background-color: #fff;
}
.multi:hover {
	background-color: #e8e8e8;
}


.formmailerfehler {
	background-image: url(http://www.dionic.de/mogono/layout/img/images/stop.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 40px;
	margin-left: 25px;
	height: 40px;
	padding-top: 2px;
}
.formmailerok {
	font-size:1.1em;
	font-family:Verdana, Geneva, sans-serif;
	margin-left: 25px;
	padding-top: 2px;
	height: 40px;
}
.formmailerfehler p, .formmailerok p {
	margin: 0;
	padding: 0;
	font-size: 11px;
}
/* Ende Kontakt- Formular*/

/* Referenzen Liste*/
.ref ul {
	list-style: none;
	margin: 0;
	padding:0;
}
ul.ref li {
	display: inline;
	padding: 0px 3px;
}
a.aktiv {
	background-position: 0px -14px;
}
a.eins {
	background: transparent url(img/menu/menu_1r.gif) no-repeat 0px 0px;
	padding: 0px 0px 0px 5px;
}
a.eins:hover {
	background-position: 0px -14px;
}
a.zwei {
	background: transparent url(img/menu/menu_2r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.zwei:hover {
	background-position: 0px -14px;
}
a.drei {
	background: transparent url(img/menu/menu_3r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.drei:hover {
	background-position: 0px -14px;
}
a.vier {
	background: transparent url(img/menu/menu_4r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.vier:hover {
	background-position: 0px -14px;
}
a.fuenf {
	background: transparent url(img/menu/menu_5r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.fuenf:hover {
	background-position: 0px -14px;
}
a.sechs {
	background: transparent url(img/menu/menu_6r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.sechs:hover {
	background-position: 0px -14px;
}
a.sieben {
	background: transparent url(img/menu/menu_7r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.sieben:hover {
	background-position: 0px -14px;
}
a.acht {
	background: transparent url(img/menu/menu_8r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.acht:hover {
	background-position: 0px -14px;
}
a.neun {
	background: transparent url(img/menu/menu_9r.gif) no-repeat 0px 0px;
	padding:0px 0px 0px 5px;
}
a.neun:hover {
	background-position: 0px -14px;
}
div.referenzen a.eins, div.bsp2 a.zwei, div.bsp3 a.drei, div.bsp4 a.vier, div.bsp5 a.fuenf, div.bsp6 a.sechs, div.bsp7 a.sieben, div.bsp8 a.acht, div.bsp9 a.neun {
	background-position: 0px -14px;
}
/* Ende Referenzen Liste*/

.rahmen, .rahmen td
    {
      border:1px solid black;
      border-collapse:collapse;
      padding: 1px;
      }
a.info{
    position:relative; /*this is the key*/
    z-index:24;
    color:#000;
    text-decoration:none}

a.info:hover{z-index:25;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:-10em; width:15em;
    border:1px solid #000;
    background-color:#FF9900; color:#000;
    text-align: center;
	 }
a.info2{
    position:relative; /*this is the key*/
    z-index:24;
    color:#000;
    text-decoration:none}

a.info2:hover{z-index:25;}

a.info2 span{display: none}

a.info2:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:-10em; width:53em;
    border:1px solid #000;
    background-color:#FF9900; color:#000;
    text-align: left;
    padding:5px 5px 5px 5px;
	 }
a.info3{
    position:relative; /*this is the key*/
    z-index:24;
    color:#000;
    text-decoration:none}

a.info3:hover{z-index:25;}

a.info3 span{display: none}

a.info3:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:-43em; width:44em;
    border:1px solid #000;
    background-color:#FF9900; color:#000;
    text-align: left;
    padding:5px 5px 5px 5px;
}

.produkte {
	margin-top:35px;
	width:625px;
	border-top:1px dotted #000; 
}

.produkte h3 {	
	/*width:555px; */
	padding: 3px 0px;
	margin-top:0px;
	font-size:10pt;
}
.produkte p {
	width:555px;
}
.produkte div {
	clear: both; 
	text-align: center;
}
.produkte ul {
	position:relative;
	top: -30px;
	right: 5px;
	float:right;
	margin: 0;
	padding:0;
	list-style:none;
}
.produkte ul li {
	display:inline;
	padding-left: 19px;
	background:transparent url(img/content/arrow.png) no-repeat top left;
}

.produkte ul li a {
	clear:both;
}
ul.preis {
	list-style:none;
	width:350px;
	text-align:center;e
	margin:0 auto;
	/*border:1px solid black;*/
}
ul.preis li {
	padding:3px;
	text-align:left;
	/*background: transparent url(img/content/punkt.png) no-repeat center left;*/
}
.preview {
	cursor: url("img/magplus.cur"), pointer;
}

#preis_tabelle {
	margin-left: 10px;
	margin-bottom:10px;
	border:1px solid black;
}
#preis_tabelle th{
	border-bottom-color: #000;
    border-bottom-style: solid;
    border-bottom-width: 1px;
	text-align: left;
	background-color:#FFFFCC;
}
#preis_tabelle td {
	padding-bottom: 7px;
    padding-top: 7px;
	border-bottom-color: #000;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}
.first {
	background:#E6E6E6;
}
.second {
	background:#fff;
}
#preis_tabelle tr:hover td {
    background-color: #FC3;
	color:#000;
}
ul.angebote, ul.kategorie {
	list-style:none;
	margin:0;
	text-align:center;
	padding:0;
	margin-top: 15px;
	margin-bottom:15px;
	margin-left: 60px;
}
ul.angebote li {
	display:inline;
	float:left;
	width:150px;
	margin-left:15px;
	text-align:center;
}
ul.kategorie {
	margin:0;
}
ul.kategorie li {
	display:inline;
	float:left;
	width:225px;
	height:210px;
	margin-top: 10px;
	text-align:center;
}
ul.angebote li a, ul.kategorie li a {
	color:#000;
	font-weight:bold;
	line-height: 140%;
}

ul.angebote li a:hover, ul.kategorie li a:hover{
	text-decoration:none;
	color:#760000;
}
/*Bestellung*/
.buttons {
	line-height:175%; 
	margin-left: 15px; 
	font-size:120%;
}
.vorschau_img {
	position: relative; 
	top: 15px; 
	left:135px; 
	height:234px; 
	width:234px; 
	border: 2px solid #000; 
	text-align:center; 
	float:left;
}
.next_arrow {
	width:600px; 
	margin:0 auto; 
	text-align:center; 
	margin:20px 0px;
}
.preis_uebersicht {
	font-size:120%; 
	margin-left: 25px; 
	margin-top: 15px;
}
.stueckzahl {
	font-size:13pt;
	text-align:right; 
	padding:3px; 
	width:150px;
}
.gesamtpreis {
	font-weight: bold; 
	text-decoration:underline;
}
.upload {
	font-size:120%; margin-left: 25px;
}
.in_warenkorb {float:right; margin-right:20px;}

/*FAQ*/
#faq h5 {font-size:9pt; margin: 10px 0px 0px 5px; height:15px; font-weight:bold;}
body#faq a.faq_m {text-decoration: underline; color:#000;}
.more-info {margin-top:0px;}
.more-info ul {
	margin:0;
	padding:0;
	list-style:none;
	margin-left:15px;
}
.more-info ul li {background: transparent url(img/content/punkt.png) no-repeat 0px 6px; padding-left:15px; padding-top:3px;}
.trigger_more_info  { margin:0; cursor:pointer; color: #000; }
.trigger_more_info:hover {text-decoration:underline;}
.active_more_info { text-decoration:underline; font-weight:bold;}