/*
+++++++++++++++++++++++++++++++++++++++++++++
+                                           +
+  Stylesheets erstellt von David Bellmann  +
+                                           +
+++++++++++++++++++++++++++++++++++++++++++++
*/

@charset "UTF-8";

/*
------------------------------------------------
 Seite - Layout
------------------------------------------------
*/

html, body
{
    width: 100%;
    height: 100%;
}

body { font-size: 100.1%; font-family: Verdana, sans-serif; font: 1.0em; color: #666; background: #fff url('/grafik/layout/hg_body.gif'); background-repeat: repeat-x; margin: 0; padding: 0; text-align: center;}
.main { position: absolute; background-color: #fff; text-align: left; left: 50%; margin: 0 0 0 -495px; height: auto; width: 990px; font-size: 70%;}
/*
------------------------------------------------
 Html Tags
------------------------------------------------
*/

img { border: 0px; margin: 0;}
.imgBorder { position: relative; border:1px solid #ddd; padding: 3px; margin: 0 5px 10px 0; display: inline;}
.imgBorderLeft { float: left; border:1px solid #ddd; padding: 3px; margin: 0 5px 10px 0; display: inline;}
.imgBorderRight { float: right; border:1px solid #ddd; padding: 3px; margin: 0 0 10px 5px; display: inline;}

.img { position: relative; padding: 3px; margin: 0 5px 10px 0; display: inline;}
.imgLeft { float: left; padding: 3px; margin: 0 5px 10px 0; display: inline;}
.imgRight { float: right; padding: 3px; margin: 0 0 10px 5px; display: inline;}

.imgRightWithText {float: right; text-align: center; border:1px solid #ddd; padding: 5px; width: 150px; clear: right; font-size: 85%; margin-bottom: 10px;}

.imgGallery, .imgGalleryLast { float: left; border:1px solid #ddd; padding: 5px; margin: 5px 5px 0 0;}
.imgGalleryLast { margin-right: 0;}
.imgLeftSide {margin: 0 0 5px 0; position: relative; width: 180px; }
.imgRightSide {margin: 0 0 5px 0; position: relative; width: 210px; }

.article a { color: #666; text-decoration: none;}

h2 { color: #666; font-size: 110%; font-weight: bold; margin: 15px 0 15px 0; text-transform: uppercase;}
h3 { color: #89ba16; font-size: 110%; font-weight: bold; margin: 15px 0 15px 0;}
h3.green { clear: left; margin: 5px 0 0 0;}
h3.greySmall { clear: left; margin: 5px 0 0 0; font-size: 90%; color: #D4D4D4;}

h3.price { clear: left; margin-top: 5px; color: #d4d4d4; font-size: 110%; font-weight: bold; height: auto;}
h4 { font-size: 90%;}
h5 { color: #89ba16; font-size: 100%; font-weight: bold; margin: 5px 0 5px 0;}

iframe { border: 1px solid #DDD;}
p { padding: 0; margin: 5px 0 5px 0;}
hr {
 border: 0px; /* Für Firefox und Opera */
 border-top: 1px dotted #d4d4d4;
 border-bottom: transparent;
 height:1px;
}

ul { padding-left: 20px;}

/*
------------------------------------------------
 Links Grundeinstellungen
------------------------------------------------
*/

a, a:link, a:visited {color: #4d7ee5; text-decoration: none;}
a:hover {text-decoration: underline;}
a.button, a.button:link, a.button:visited { float: left; width: 100%; height: 25px; display: block; text-indent: 5px; background-color: #e4e4e4;/*background-image: url('/grafik/layout/hg_button.gif');*/ line-height: 25px; font-weight: bold; font-size: 90%; text-decoration: none; margin-bottom: 1px;}
a.button:hover { /*background-image: url('/grafik/layout/hg_button_on.gif');*/}

a.back { position: relative; top: -5px; left: -5px; width: 100px; height: 20px; line-height: 20px; display: block; text-align: center; border: 1px solid #FFF; border-width: 0 2px 2px 0; background-color: #851b28; color: #FFF; text-decoration: none; font-weight: bold;}
a.more { float: right; margin-top: 5px; text-decoration: none; font-size: 90%;}
.top a { text-decoration: none; }

a.buchung { background-color: #fff200; padding: 2px;}
a.buchung:hover { background-color: #4d7ee5; color: #FFF;}

/*
------------------------------------------------
 Links mehr Bilder
------------------------------------------------
*/

.morePic { float: left; clear: left; height: 30px; margin: -8px 0 10px 0; }
a.imgMore, a.imgMore:link, a.imgMore:visited { float: left; display: block; border: 1px solid #ddd; background-color: #ddd; padding: 2px; text-align: center;}


/*
------------------------------------------------
 Layout / Struktur
------------------------------------------------
*/

#header { float: left; top: 31px; left: 0; margin: 31px 0 10px 0; width: 990px; height: 243px; background-image: url('/grafik/layout/hg_top_header.gif'); background-repeat: repeat-x; }
#leftContent { float: left; padding-left: 10px; width: 200px; }
#middleContent { margin:0 240px 0 210px; }
#rightContent { float: right; padding-right: 10px; width: 220px; }
#foot { float: left; width: 990px; height: 100px; background-position: 0 10px; background-image: url('/grafik/layout/hg_footer.gif'); background-repeat: repeat-x;}

/*
------------------------------------------------
 Kopfbereich der Seite
------------------------------------------------
*/

#logo { text-align: center; width: 200px; height: 67px; }
#language { position: absolute; top: 8px; left: 10px; width: 70px; height: 30px; display: inline;}
#header img { float: left; border: 1px solid #FFF; margin: 10px 0 0 10px; display: inline;}
#header #shop { position: absolute; top: 31px; left: 759px; width: 220px; height: 243px; margin-right: 10px; border: 1px solid #fff; border-width: 0 1px 0 1px; background-color: #4d7ee5; display: inline;}

/*
------------------------------------------------
 Fussbereich der Seite
------------------------------------------------
*/

#foot #lexi { float: right; width: 220px; height: 100px; margin-right: 10px; text-align: center; color: #FFF;border: 1px solid #fff; border-width: 0 1px 0 1px; background-color: #4d7ee5; display: inline;}
#foot a { padding: 0 5px 0 5px;}
#footCenter { float: left; width: 740px; height: 100px; margin-top: 15px; padding: 5px; display: inline; text-align: center; color: #FFF; }

/*
------------------------------------------------
 First Navigation platzieren
------------------------------------------------
*/
#headerNavi { position: absolute; top: 252px; left: 0px; }
#headerNavi a { float: left; padding: 4px 10px 5px 10px; color: #FFF; text-decoration: none;}
#headerNavi a:hover { background-color: #9d9d9d; color: #FFF;}
#headerNavi a.activ { background-color: #fff; color: #4d7ee5;}

/*
------------------------------------------------
 Impressum Navigation platzieren
------------------------------------------------
*/

#impressum { position: absolute; top: 8px; right: 10px; width: auto/*220px*/; text-align: center;}
#impressum a { float: left; color: #666; background-color: #fff; padding: 3px 5px 3px 5px;  color: #666; text-decoration: none;}
#impressum a:hover, #headNaviRight a.activ { background-color: #4d7ee5; color: #FFF;}

/*
------------------------------------------------
 Second Navigation platzieren
------------------------------------------------
*/

#secNavi { float: left; width: 190px; height: auto; margin: 0 0 10px 0;}
#secNavi a.second, #secNavi a.basket, #secNavi a.activ { display: block; width: 190px; background-color: #fff; border: 1px dotted #d4d4d4; padding: 3px 0 3px 0; text-indent: 10px; margin-bottom: 1px; color: #666; text-decoration: none;}
#secNavi a.basket { background-color: #89ba16; color: #FFF;}
#secNavi a.second:hover, #secNavi a.basket:hover, #secNavi a.activ { background-color: #4d7ee5; border: 1px solid #4d7ee5; color: #fff;}

/*
------------------------------------------------
 Inhalte platzieren
------------------------------------------------
*/

#leftContent .feld { clear: left; width: 180px; height: auto; padding: 5px; margin: 10px 0 0 0; border: 1px dotted #d4d4d4;}
#rightContent .feld { width: 210px; height: auto; padding: 5px; margin: 10px 0 0 0; border: 1px dotted #d4d4d4; background-color: #eee;}

.inhaltCenter    { text-align: center !important; margin-left: 3px;}
.inhaltLeft      { text-align: left !important; }
.inhaltRight     { text-align: right !important; margin-right: 3px;}

.clear { clear: left;}
.hr {float: left; width: 96%; height: 1px; padding: 0; margin: 10px 0 5px 2%; border-top: 1px solid #666;}

.left { float: left; width: 70%; padding: 2%; display: inline;}
.left100 { float: left; width: 96%; padding: 2% 0 2% 2%; display: inline; text-align: justify;}
.right { float: right; width: 20%; padding: 2%; display: inline; text-align: right;}
.right100 { float: right; width: 96%; padding: 2% 2% 2% 0; display: inline; text-align: right;}
.spalte { float: left;padding: 1px;}

/*
------------------------------------------------
 Schriftegroessen
------------------------------------------------
*/

.fontSize90 { font-size: 90%;}
.red { color: #ff0000;}
.blue { color: #4d7ee5;}
.priceColor { color: #666;}
.black { color: #000;}
.weiss { color: #fff;}

.textForm1 { font-size: 100%; }
.textForm2 { font-size: 105%; font-weight: bold;}
.textForm3 { font-size: 110%;}
.textForm4 { font-size: 115%; font-weight: bold;}

a.lexikon, a.lexikon:link, a.lexikon:visited { color: #FFF;}
a.lexikon:hover { color: #eee;}

/*
------------------------------------------------
 Abstandshalter
------------------------------------------------
*/

.space { float: left; width: 5px; height: 5px;}
.spaceHori { float: left; width: 100%; height: 5px; background-color: #FFF;}

/*
------------------------------------------------
 Content - Tooltip
------------------------------------------------
*/

#dhtmltooltip { position: absolute; left: -300px; width: auto; border: 1px solid #DDD; padding: 2px; background-color: #FFF; visibility: hidden; z-index: 100; font-size: 70%; color: #851b28;}
#dhtmlpointer { position: absolute; left: -300px; z-index: 101; visibility: hidden; display: none;}

/*
------------------------------------------------
 Farbige Divs 
------------------------------------------------
*/

.grey, .white, .info, .err { float: left; width: 97%; padding:1%; margin: 2px 0 10px 0; display: inline; }
.grey { background-color:#F2F2F2; color:#464548; border: 1px solid #464548;}
.white { background-color:#FFF; background-image: url(http://www.swedenstyle.de/grafik/layout/hg_divWhite.gif); background-repeat: repeat-x;}
.err {  border: 1px solid #C40000; border-width: 1px 0 1px 0; color: #C40000;}

/*
------------------------------------------------------------
 Formularformatierungen
------------------------------------------------------------
*/

form { margin: 0; padding: 0;}
fieldset { border: 0px; margin: 0 0 10px 0; padding: 0px; }
legend { display: none;}
label { float: left; width: 30%; display: block;}
.formularzeile, .formularzeile_white, .formularzeile_err, .formularzeileRed { float: left; width: 97%; display: block; padding: 1%; margin-bottom: 2px; background-color: #f2f2f2;}
.formularzeile_err, .formularzeileRed { background-color:#FDE4E4;}
.formularzeile_white { background-color:#FFF;}

.formularzeile .left, .formularzeile_white .left { width: 30%; font-weight: bold; padding: 0;}
.formularzeile .right, .formularzeile_white .right { float: left; width: 60%; text-align: left; padding: 0;}

input[type=text], textarea { width: 60%;}
input[type=submit], select { font-size: 95%;}
input, input[type=radio] { color: #464548; border: 1px solid; font-size: 110%;}
input.price { color: #C83602; font-weight: bold; border: 0; font-size: 88%; text-align: right;}

.long { width: 99%;}
.delete { float: left; background-color:#fff; border: 1px solid #C83602; width: 98%; height: auto; padding:	5px;}

button { background-color: #89ba16; margin-top: 5px; padding: 3px; color: #FFF; font-weight: bold; font-size: 90%; border: 1px solid #d4d4d4;}
button:hover { background-color: #4d7ee5; color: #FFF; font-weight: bold;}

/*
------------------------------------------------
 Referenzen auf der linke Seite
------------------------------------------------
*/

.referenzen { float: left; width: 100%; height: auto; margin-bottom: 5px;}

/*
------------------------------------------------
 Referenzen auslesen
------------------------------------------------
*/

.referenz { float: left; width: 100%; padding: 5px 0 5px 0; margin-bottom: 5px; border-top: 1px dotted #c5c5c5;}
.referenzName { float: left; width: 90%;}
.referenzLink { float: right; text-align: right; width: 10%;}

/*
======================================================================
 nach oben Button
======================================================================
*/
.top { float: left; display: block; width: 98%; text-align: right;}
.top a span  { display: none;} /*Schrift des Hoch-Buttons unsichtbar machen*/
.top a, .top a:link, .top a:visited, .top a:hover { float: right; padding: 0 0 5px 0; color: #cbcbcb; font-size: 80%; }

/*
------------------------------------------------
 Aktuelles/News auf der linke Seite
------------------------------------------------
*/

.news { float: left; width: 100%; height: auto; margin-bottom: 1px; border: 1px solid c5c5c5; background-color: #eeeeee;}
.news .innen { float: left; width: 205px; margin: 5px;}

.newsDatum{ float: left; width: 100%; font-size: 80%; color: #666;}
.newsHead { float: left; width: 100%; font-size: 90%; color: #c1332b;}
.newsText { float: left; width: 100%; font-size: 90%; margin-top: 5px;}

/*
------------------------------------------------
 Aktuelles/News auf der rechten Seite
------------------------------------------------
*/

.newsBig { float: left; width: 100%; height: auto; margin-bottom: 1px; padding: 5px 0 5px 0; border-bottom: 1px dotted #c5c5c5;}
.newsBig .innen { float: left; width: 205px; margin: 5px;}

.newsBigDatum{ float: left; width: 100%; font-size: 90%; color: #666;}
.newsBigHead { float: left; width: 100%; font-weight: bold;}
.newsBigText { float: left; width: 100%; margin-top: 10px;}

/*
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
++								     ++
++	 Shopformatierungen	                                     ++
++								     ++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/


/*
------------------------------------------------
 Warenkorb auf der linke Seite
------------------------------------------------
*/

.wkArticle { float: left; width: 98%; color: #fff; height: 110px; background-color: #89ba16; margin: 5px 0 5px 0; border: 1px solid #666; border-width: 3px 1px 1px 1px; padding: 1%; }

/*
------------------------------------------------
 Warenkorb - Ansicht
------------------------------------------------
*/

.wk { float: left; width: 100%; border: 0px; padding: 0; margin: 10px 0 20px 0; border-collapse: collapse;}
.wk th { height: 25px; background-color: #d4d4d4; padding: 2px; vertical-align: middle; border: solid #b0b0b0; border-width: 1px 0 1px 0;}
.wk td { padding: 2px; vertical-align: top;}
.wk tbody tr td { border-bottom: 1px solid #b0b0b0; padding: 5px 2px 5px 2px;}
.wk tbody tr:hover { background-color: #ddd;}
tr.foots { background-color: #eeeeee; vertical-align: middle;}
tr.footlinie_unten td { background-color: #eeeeee; vertical-align: middle; border-bottom: 1px solid #b0b0b0;}
tr.footlinie_oben  td { background-color: #eeeeee; vertical-align: middle; border-top: 1px solid #b0b0b0;}
tr.footlinie_beide  td { background-color: #ddd; vertical-align: middle; height: 30px; border: 1px solid #b0b0b0; border-width: 1px 0 1px 0;}
tr.footlinie_unten .inhaltRight, tr.footlinie_oben .inhaltRight, tr.foot .inhaltRight { background-color: #ddd;}

/*
------------------------------------------------
 Artikel - Ansicht klein
------------------------------------------------
*/

.article { float: left; height: 220px; width: 155px; background-image: url('../grafik/layout/article_hg.png'); border:1px solid #ddd; margin: 0 10px 10px 0; padding: 3px;}
.articleOhne { float: left; height: 220px; color: #fff; width: 220px; text-align: center; background-image: none; border:0; margin: 0; padding: 3px 0 0 0;}

.article a { color: #666; text-decoration: none;}
.article h3 { margin: 0; padding: 0; font-size: 90%; height: 30px;}
.article h3.price { margin-top: 5px; color: #c1332b; font-size: 110%; font-weight: bold; height: auto;}
.article h4, .articleOhne h4 { font-weight: normal; margin-top: 5px; padding: 0; font-size: 80%;}
.article .imgSmall { float: left; margin-top: 5px; height: 120px; border: 1px solid #DDD; padding: 2px;}
.article .imgMiddle { border: 1px solid #c1332b; padding: 5px;}

a.butMiddle { width: 24px; height: 24px; display: block; float: right; clear: right;
  background-image: url('../grafik/layout/article_middle.gif'); background-repeat: no-repeat; margin-top: 5px;}
a.butBig { width: 24px; height: 24px; display: block; float: right; clear: right;
  background-image: url('../grafik/layout/article_big.gif'); background-repeat: no-repeat; margin-top: 5px;}
a.butInfo { width: 24px; height: 24px; display: block; float: right; clear: right;
  background-image: url('../grafik/layout/article_info.gif'); background-repeat: no-repeat; margin-top: 5px;}
.article a span { display: none;}

.preis_now { float: right; margin-top: -22px; font-size: 150%; font-weight: bold; color: #00A600;}

/*
------------------------------------------------
 Artikel - Ansicht gross
------------------------------------------------
*/

#articleLarge .image { float: left; width: 40%; display: inline; text-align: right;}
#articleLarge .wk { float: left; width: 60%;}
#articleLarge .txt { float: left; width: 100%;}
#articleLarge label { font-weight: bold; text-align: left;}
#articleLarge h3.price { margin: 0; color: #c1332b; font-size: 110%; font-weight: bold; text-align: left;}
#articleLarge .priceShield { float: left; width: 100%; padding: 5px 0 5px 0; border: 1px solid #666; border-width: 1px 0 1px 0; text-align: left;}

#articleLarge .priceShield .price { float: left; width: 46%; text-align: left; font-size: 80%; padding: 1% 0 1px 0; }
#articleLarge .priceShield .price .preisGreat { font-size: 170%; font-weight: bold;}
#articleLarge .priceShield .wk { float: right; width: 48%; padding: 1%; text-align: center; background-color: #89ba16; color: #666; border: 1px solid #666; border-width: 3px 1px 1px 1px;}
.inwk { display: block; height: 20px; color: #FFF; font-weight: bold;}

/*
------------------------------------------
 Zurückbutton
------------------------------------------
*/
.back { float: left; padding: 5px 0 10px 0;}

/*
------------------------------------------
 Formatierungen der Blätterfunktionen
------------------------------------------
*/

.searchheader { clear:both; position:relative; height: 3.5em; background-color: #e1e1e1;}
ul.navIndex { float: left; display: block; padding: .9em 0 0;}
ul.navIndex li { float: left; padding: 0 1px 0 1px; list-style: none;}
ul.navIndex span.pageDisabled { color: #d4d4d4; }
ul.navIndex span.pageNormal { color: #666; }
ul.navIndex li a, ul.navIndex span { display: block; padding: 3px; }
ul.navIndex li a.activPage { text-decoration: underline; color: #666; }
ul.navIndex li a:hover { border: 1px solid #688722; background-color: #fff; padding: 2px;}