@charset "UTF-8"; /* charset festlegen */

/* Formatierung des body */

body { font-family: "Trebuchet MS", Verdana, sans serif; background-color: #340122; font-size: 62.5%; overflow: scroll; 

scrollbar-3dlight-color:#3a3539;
scrollbar-arrow-color:#FFF;
scrollbar-base-color:#000;
scrollbar-darkshadow-color:#000;
scrollbar-face-color: #000;
scrollbar-highlight-color:#000;
scrollbar-shadow-color:#3a3539;
scrollbar-track-color:#000;
}

#bg-ornament { background: none; margin: 0 auto; width: 993px; height: 636px; }
#bg-ornament-kachel { background-image: url(../images/bg_ornamente_kachel_dunkler.png); background-repeat:repeat-x; background-attachment: fixed; }
#wrapper { width: 823px; height: auto; background-repeat:repeat-x; background-color: #000000; margin: auto; padding-left: 30px; padding-right: 9px; }

#content {
width:803px;
height: auto;
min-height: 200px;
color: #FFFFFF;
padding-top: 30px;
}

* html #content {
height: 200px;
}

#content.produktseite {
width: 575px;
margin: 0 0 0 212px;
padding: 0;
}

#header {
width:803px;
height:96px;
}

#logo {
width:156px;
height:96px;
float:left;
}

#meta {
height:14px;
float:right;
font-size: 1em;
font-family: "Trebuchet MS", verdana;
}

#visual {
width:803px;
height:264px;
}

#footer-left {
color: #6d5b67;
font-family: "trebuchet MS", verdana;
font-size: 1.1em;
float: left;
margin: 30px 0 6px 0;
}

#footer-right {
color: #6d5b67;
font-family: "trebuchet MS", verdana;
font-size: 1.1em;
float: right;
margin: 30px 2px 6px 0;
}

* html #footer-right {
color: #6d5b67;
font-family: "trebuchet MS", verdana;
font-size: 1.1em;
float: right;
margin: 30px -1px 6px 0;
}

div#breadcrumb {
margin: 20px 0 0 212px;
}

/* Intro Seite */

body.intro { background: url(../images/body_bg_intro.gif) top left repeat; }
#bg-ornament-intro { background: url(../images/bg_ornamente_intro.png) top center no-repeat; width: 100%; height: 636px; }
#bg-ornament-kachel-intro { background-image: url(../images/bg_ornamente_kachel_intro.png); background-repeat: repeat-x; }
.intro #content { width: 516px; padding-top: 53px; }

#wrapper-intro {
width: 516px;
height: 634px;
margin-left: auto;
margin-right: auto;
}

#logo-intro {
width: 137px;
height: 89px;
margin: 0 0 33px 189px;
}

#logo-intro a {
background-image: none !important;
padding: 0 !important;
}

#sprachwahl {
margin-left: 189px;
height: 1%;
}

#sprachwahl li {
display: inline;
}

#sprachwahl li a,
#sprachwahl li span {
float: left;
height: 9px;
padding: 0 !important;
margin: 0 26px 0 0;
display: inline;
background: none !important;
}

#sprachwahl .de a {
background: url(../images/deutsch.gif) top left no-repeat    !important;
width: 56px;
}

#sprachwahl .en a {
background: url(../images/english.gif) top left no-repeat    !important;
width: 55px;
}

#sprachwahl .en span {
background: url(../images/english_grau.gif) top left no-repeat    !important;
width: 55px;
}

#visual-intro {
margin: 29px 0 0 50px;
}

#footer-intro {
margin-top: 10px;
text-align: center;
}

#footer-intro span {
color: #795869;
font-family: "trebuchet MS", verdana;
font-size: 1.1em;
}

/* Typo */
#text span {
font-size: 13px;
font-weight: bold;
}

#content a,
#content a.lila:hover {
background-image:url(../images/feil_white.gif);
background-repeat:no-repeat;
background-position: center left;
padding: 0 0 0 8px;
color: #FFFFFF;
border: 0;
outline: 0;
}

#content a.lila,
#content a.lila:hover {
font-weight: bold;
}

#content a.lila,
#content a:hover {
background-image:url(../images/pfeil_lila.gif);
background-repeat:no-repeat;
background-position: center left;
padding: 0 0 0 8px;
color: #d90075;
border: 0;
outline: 0;
}

* html #content a {
background: none !important;
padding: 0 !important;
}

* + html #content a {
background: none !important;
padding: 0 !important;
}

* html #content a:hover {
background: none !important;
padding: 0 !important;
}

* + html #content a:hover {
background: none !important;
padding: 0 !important;
}

div#breadcrumb span {
font-size: 1.2em;
color: #fff;
float: left;
margin: 0 10px 0 0;
}

div#breadcrumb span#breadcrumbcurrent {
font-size: 1em;
color: #d90075;
display: block;
float: left;
}



h1 {
font-size: 2.2em;
color: #FFF;
margin: 50px 0 0 0;
font-weight: normal;
}

h2 {
font-size: 2.2em;
color: #FFF;
margin: 38px 0 0 0;
font-weight: normal;
}

h3 {
font-size: 1.3em;
font-weight: bold;
color: #ffffff;
margin: 0px 0px 30px 0;
}

h4{
font-family: "trebuchet MS", verdana;
font-size: 1.3em;
font-weight: bold;
border-bottom: 1px solid #684d5f;
margin: 40px 0 12px 0;
}

h5{
font-family: "trebuchet MS", verdana;
font-size: 1.3em;
font-weight: bold;
margin: 15px 0 0 0;
}

p {
font-size: 1.3em;
margin: 15px 0 0 0;
}

/* Links: <a> */
/* a href="" und a name="" fuer IE */
a {
color: #FFFFFF;
border: 0;
outline: 0;
}

a.bold {
color: #FFFFFF;
border: 0;
outline: 0;
font-weight: bold;
font-size: 1em;
}

a.bold.nagelstudio {
color: #FFFFFF;
border: 0;
outline: 0;
font-weight: bold;
font-size: 1.3em;
margin: 0 0 2px 19px;
}

a.bold.eingerueckt {
color: #FFFFFF;
border: 0;
outline: 0;
font-weight: bold;
font-size: 1.3em;
margin-left: 286px;
}

* html a.bold.eingerueckt {
margin-left: 280px;
}

/* a href="" sonstige Ausgabegeraete */
a:link {
color: #d90075;
border: 0;
outline: 0;
text-decoration: none;
}
/* besuchter Link */
a:visited {
color: #FFF;
border: 0;
outline: 0;
}

/* maus down = klick und im IE auch wiederbesuch der Seite ueber backspace */
a:active {
color: #000000;
border: 0;
outline: 0;
}
/* wenn link ueber tab "aktiviert" wird */
a:focus {
color: #000000;
border: 0;
outline: 0;
}

a.img {
background: none !important;
padding: 0 !important;
}

/* Listen */

ul {
font-size: 1.2em;
}

ul ul {
font-size: 1.0em;
}

/* Listen im content */
#content ul li {
font-size: 1em;
}

#content ol li {
font-size: 1.3em;
}

#content ol {
margin: 5px 0 0 18px;
}

* html #content ol {
margin: 5px 0 0 22px;
}

* + html #content ol {
margin: 5px 0 0 22px;
}

#content ol li {
list-style-type: decimal;
list-style-position: outisde;
}

#content ul {
margin: 0 0 0 14px;
}

* html #content ul {
margin: 0 0 0 16px;
padding-bottom: 5px;
}

* + html #content ul {
margin: 0 0 0 16px;
padding-bottom: 5px;
}

#content ul li {
margin: 3px 0;
list-style-type: circle;
}

#content ul ul {
margin: 0 0 0 10px;
}

#content ul ul li {
font-size: 1em;
list-style-type: square;
}

#content ul#sprachwahl {
margin-left: 189px;
}






/* Metanavigation */

#meta ul li {
float:left;
margin-left: 8px;
margin-top: 14px;
color: #d90075;
font-weight: bold;
}

#meta ul li a {
color: #b6b7b7;
font-weight: normal;
}

#meta ul li a:hover {
color: #FFF;
font-weight: normal;
}

#meta ul li.last {
margin-right: 30px;
width: auto;
}

#meta ul li.last a {
color: #B6B7B7;
}


#meta ul li span {
color: #6b6b6b;
margin-left: 5px;
}

/* Breadcrumb */
div#breadcrumb ul  {
height: 20px;
margin: 0;
float: left;
}

div#breadcrumb ul li  {
float: left;
display: block;
color: #d90075;
margin: 0 10px 0 0;
}

div#breadcrumb ul li a  {
background: transparent url(../images/lila_pfeil.gif) center right no-repeat;
padding: 0 10px 0 0;
color: #d90075;

}

div#breadcrumb ul li a:hover  {
background: transparent url(../images/pfeil_fff.gif) center right no-repeat;
padding: 0 10px 0 0;
color: #fff;
}

div#breadcrumb ul li.last a  {
background: none;
padding: 0 10px 0 0;
}


/* Bilder */

img {
border: none;
background-image: none !important;
}

a img {
border: none;
background-image: none !important;
display: inline;
}

div.bildlinks img {
float: left;
margin: 4px 10px 10px 0;
}

* html div.bildlinks img {
float: left;
margin: 18px 10px 10px 0;
}

* + html div.bildlinks img {
float: left;
margin: 18px 10px 10px 0;
}


div.bildlinks h3 {
margin: 0 0 -10px 0;
}


div.bildrechts img {
float: right;
margin: 0 0 10px 10px;
}

* html div.bildrechts img {
float: right;
margin: 10px 0 10px 10px;
}


/* Produkt-Links */

#produktuebersicht div {
padding: 0 0 0 5px;
margin: 0 5px 0 0;
width: 135px;
float: left;
text-align: center;
}

#produktuebersicht div a,
#produktuebersicht div a:hover {
background-position: 5px left;
}

* html #produktuebersicht div a,
* html #produktuebersicht div a:hover {
background-position: 6px left;
}

#produktuebersicht div.last {
margin: 0;
}

#produktuebersicht div img {
margin-left: -5px;
margin-bottom: 30px;
}

* html #produktuebersicht div img {
margin-left: -5px;
margin-bottom: 0px;
}

/* Teaserboxen */

ul.liste-teaserboxen {
margin: 38px 0 0 0;
}

ul.liste-teaserboxen li {
float: left;
width: 200px;
text-align: center;
font-size: 1.7em;
}

ul.liste-teaserboxen li a {
font-weight: normal;
color: #FFF;
}


.teaserboxen  {
float: left;
width: 630px;
}

.teaserboxen-breit  {
float: left;
width: 820px;
}


.teaserboxen-breit .teaserbox  {
width: 190px;
height: 200px;
float: left;
margin: 0 10px 10px 0;
color: #cdcccd !important;
}

.teaserbox  {
width: 190px;
float: left;
/*margin: 0 10px 0 0;*/
margin: 0 15px 0 0 !important;
/*color: #cdcccd !important;*/
color: #ff0000;
}

.teaserbox.last  {
width: 190px;
float: left;
margin: 0 0px 0 0;

}

.teaserbox h3 {
height: 35px;
display: block;
margin: 0;
color: #cdcccd;
}

.teaserbox h3 a {
color: #cdcccd !important;
}

* html .teaserbox img {
margin-top: 5px;
}

* + html .teaserbox img {
margin-top: 5px;
}

.teaserbox h3 a:hover {
color: #d90075 !important;
}

.teaserbox a {
background-image: none !important;
color: #cdcccd;
height: 1%;
}

.teaserbox img {
padding-top: 5px;

}

.teaserboxen h3.last  {
margin: 0;
}


/* Haendler-Login */

.haendler-login {
float: left;
width: 170px;
}

.haendler-login h3 {
padding: 0;
margin: 0;
}

.haendler-login p,
.haendler-login p a {
color: #64505e !important;
font-size: 1.1em;
margin-top: 15px;
}

.haendler-login p a {
background-image:url(../images/pfeil_675060.gif) !important;
background-repeat:no-repeat;
background-position: center left;
padding: 0 0 0 8px;
color: #64505e !important;
font-size: 1.1em;
}

.haendler-login p a:hover {
color: #ffffff !important;
background-image:url(../images/pfeil_fff.gif) !important;
background-repeat:no-repeat;
background-position: center left;
padding: 0 0 0 8px;
}



/* Sitemap */

#sitemap ul li { /* Hauptnavipunkte */
text-transform: uppercase;
font-weight: bold;
font-size: 1.25em;
border-top: 1px solid #4b3f40;
margin: 10px 0 -10px 0;
padding: 5px 0;
}

* html #sitemap ul li { /* Hauptnavipunkte */
border-top: none;
}

#sitemap ul li ul li { /* 2. Ebene */
font-size: 0.95em;
text-transform: none;
font-weight: bold;
margin: 3px 0 0 1px;
border: none !important;
padding: 3px 0;
}

#sitemap ul li ul li a { /* 2. Ebene a*/
margin: 3px 0 0 1px;
border: none !important;
padding: 3px 0;
background-image: none;
}

#sitemap ul li ul li a:hover { /* 2. Ebene a:hover*/
margin: 3px 0 0 1px;
border: none !important;
padding: 3px 0;
background-image: none;
}

#sitemap ul li ul li ul li {
margin: 0 0 -2px 0;
font-weight: normal;
}

#sitemap ul li ul li ul li a{ /* 3. Ebene a */
margin: 0;
color: #cacbcb;
background-image:url(../images/pfeil_sitemap.gif);
background-repeat:no-repeat;
background-position: center left;
padding: 0px 0 2px 8px;
}

#sitemap ul li ul li ul li a:hover { /* 3. Ebene a:hover */
margin: 0;
font-weight: normal;
color: #d90075;
background-image:url(../images/pfeil_sitemap_hover.gif);
background-repeat:no-repeat;
background-position: center left;
padding: 0px 0 2px 8px;
}

/* Footer */

#footer-left ul,
#footer-right ul {
margin-top: 30px;
}

#footer-left ul li {
color: #6e5966;
font-family: "trebuchet MS", verdana;
font-size: 0.9em;
float: left;
margin: 0 15px 0 0;
}

#footer-left ul li a {
color: #6e5966;
font-weight: normal;
}

#footer-left ul li a:hover {
color: #FFF;
}

#footer-left ul li span {
color: #6e5966;
margin-left: 5px;
}

#footer-right ul li {
color: #6e5966;
font-family: "trebuchet MS", verdana;
font-size: 0.9em;
float: left;
}

#footer-right ul li a {
color: #6e5966;
font-weight: normal;
margin: 0 15px 0 0;
}

#footer-right ul li a:hover {
color: #FFF;
font-weight: normal;
}

#footer-right ul li span {
color: #6e5966;
margin-left: 5px;
}

* html #footer ul {
margin-right: 29px;
margin-bottom: 15px;
}


.clear {
clear: both;
margin: -1px 0px 0px 0px;  /* laesst 1px clear nach oben verschwinden */
height: 0px;  /* laesst &nbsp; auf 1px schrumpfen fuer IE */
font-size: 0px;
line-height: 0px;
width: 100%;
}

.ahem {  /*  entspricht im wesentlichen display:none; , ist aber screenreaderfreundlich */
position: absolute;
overflow: hidden;
height: 0px;
width: 0px;
left: -1000px;
top: -1000px;
}

.left {
float: left;
margin: 0 12px 5px 0;
}