/************************************************************************************************************ ************************************************************************************************************* ************************************************************************************************************* **************** ********* ************* ***************** **************** ******** ************* ************** **************** ****************** ************************* ********** ************* **************** ******************* ******************** *********** ************ **************** ********************* **************** ************ *********** **************** ************************* ************ ************ *********** **************** ************************** ********* ************ *********** **************** **************************** ********* ************ *********** **************** *********************************** ********* *********** ************ **************** *********************************** ********* ********** ************* **************** ******************************** ********** ********* ************** **************** ******************* *********** *************** **************** ******************* ************** ***************** ************************************************************************************************************* ************************************************************************************************************* ******************* FLYING SPARKY DESIGN *** BY *** LORENA JURMA *** 2009 ********************* ************************************************************************************************************/ * {margin: 0; padding: 0;} body {overflow: hidden; /*Needed to eliminate scrollbars*/ font: 13px Arial, Helvetica, sans-serif; color: #666;} img {border: none;} h1 {font-size: 18px; padding-bottom: 6px} h2 {font-size: 16px; padding-bottom: 0px; line-height: 2.2} h3 {font-size: 14px; padding-bottom: 4px} p, ul {font-size: 12px; line-height: 1.8} a, a:focus, a:active, td a:active {cursor: pointer; text-decoration: none; color: #666} a:hover, td a:hover {cursor: pointer; text-decoration: none;} /* Aktive Buttons */ #navi ul li a.active {color: white; text-decoration: underline} #navi ul li a:hover {} .clear {clear: both;} /* CONTENT *******************************************************************************************************/ /* Supersize Plugin Styles */ #loading {position: absolute; top: 49.5%; left: 49.5%; z-index: 3; width: 24px; height: 24px; text-indent: -999em; background-image: url(img/progress.gif);} #supersize {position: fixed;} #supersize img, #supersize a {height: 100%; width: 100%; cursor: default; z-index: 1} /* cursor, damit nicht geklickt wird */ /**********************************************************************************************************************/ /* HOME - index.html - Einstiegsseite */ #home {display: none; position: absolute; width: 560px; z-index: 3; top: 4%; left: 2%; color: #755560; text-align: justify} p#leftcolumn-home {float: left; width: 270px; margin-right: 20px;} p#rightcolumn-home {float: left; width: 270px;} /**********************************************************************************************************************/ /* SHOP --- nur LINK!!! */ /**********************************************************************************************************************/ /* NEWS - news.html - Neuigkeiten */ #news {display: none; position: absolute; background: white; width: 600px; z-index: 3; left: 2%; top: 5%; font: normal 11px/1.8 Arial, Helvetica, sans-serif; color: #696f63; text-align: justify; padding: 20px} #scrolltext-news {position: relative; float: left; width: 580px; height: 270px; overflow: auto;} #textwrap-news {height: 270px;} /* diese Höhe muss dem aktuellen Text angepasst werden, sonst probs mit IE */ #scrolltext-gifts {position: relative; float: left; width: 580px; height: 430px; overflow: auto;} /* diese Höhe muss dem aktuellen Text angepasst werden, sonst probs mit IE */ #textwrap-gifts {height: 430px;} /* diese Höhe muss dem aktuellen Text angepasst werden, sonst probs mit IE */ /**********************************************************************************************************************/ /* COLLECTION - collection.html */ #collection {clear: both; display: none} /* Fade-Effekt */ #aloe {position: absolute; top: 20px; right: 520px; z-index: 6} #sommermodelle {position: absolute; top: 10px; right: 350px; z-index: 7} #motivdruck {position: absolute; top: 40px; right: 180px; z-index: 8} #basicmodelle {position: absolute; top: 20px; right: 10px; z-index: 9} #wellnessset {position: absolute; top: 220px; right: 520px; z-index: 3} #spitze {position: absolute; top: 210px; right: 356px; z-index: 4} #swarovski {position: absolute; top: 225px; right: 190px; z-index: 5} #weiteremasken {position: absolute; top: 220px; right: 14px; z-index: 6} #alledesigns {position: absolute; bottom: 92px; right: 30px; z-index: 3} /**********************************************************************************************************************/ /* PRESSE UND FILM - media.html */ .media {position: absolute; top: 10px; left: 20px; width: 500px;} #presscontact {position: relative; display: none; float: left; width: 170px; margin-right: 12px; height: 150px; background: #e7edee; padding: 12px} /* Text: Vanessa Gramkow */ #presscontact p {line-height: 1.8} #infofilm {position: relative; display: none; float: left; width: 110px; height: 150px; background: #e7edee; padding: 12px} #media-buttons {padding: 4px; text-align: center} /* Videofilm */ #laufbandwrap {position: absolute; z-index: 3; left: 2%; bottom: 100px;} #laufband {height: 280px; width: 840px; padding: 0; display: block; overflow: hidden;} #imagewrap {width: 22700px;} /* Breite eines Bildes: ca. 200px + 22px Space */ #imagewrap img {margin-right: 8px; padding: 6px; border: 1px solid #ccc} #laufbandpfeil {position: absolute; z-index: 4; left: 880px; bottom: 100px;} /* */ .popuppresse {width: 800px; height: 460px} /* das Popup-Bild, erstmal display: none */ .presspic, .presspic2 {float: left; width: 400px; height: 460px;} .pressdetails, .pressdetails2, .pressdetails3 {padding-top: 60px;} h1.productname {padding-top: 20px; text-indent: 30px; font: bold 20px "Trebuchet MS", Helvetica, Arial, sans-serif; text-transform: uppercase; line-height: 2; letter-spacing: -0.03em;} p.price {text-indent: 30px; font-size: 30px; font-weight: bold; letter-spacing: -0.03em;} p.extras {text-indent: 30px; text-transform: uppercase; color: #999; font-size: 9px; line-height: 1.5;} /* MwSt. + Versandinfo */ img.details, img.next, img.last {padding-left: 30px;} /**********************************************************************************************************************/ /* GESÜNDER SCHLAFEN - inside.html*/ #inside {display: none; position: absolute; background: #131912; width: 600px; z-index: 3; right: 4%; top: 6%; color: #959d8c; text-align: justify; padding: 20px} #scrolltext {position: relative; float: left; width: 600px; height: 300px; overflow: auto;} #textwrap {height: 850px;} /* diese Höhe muss dem aktuellen Text angepasst werden, sonst probs mit IE */ #inside2 ul li {list-style: none; text-indent: 20px} /**********************************************************************************************************************/ /* PROMOTION - Seite für Bilder */ #promotion {display: none; position: absolute; background: white; width: 820px; height: 430px; z-index: 3; left: 4%; top: 6%; color: black; text-align: justify; padding: 20px} #promotion h1 {} #promotion p {font-size: 11px} #promotion p.capture {font-size: 9px; text-align: center;} #pics {position: relative; float: left; width: 810px; height: 380px; overflow: auto;} #picsframe {height: 4200px;} /* diese Höhe muss dem aktuellen Text angepasst werden, sonst probs mit IE */ #promotion ul {float: left; display: inline; list-style: none} #promotion li {float: left; padding-right: 15px; padding-bottom: 15px} #promotion img {border: 1px solid #ccc;} /**********************************************************************************************************************/ /* KONTAKT - Facebox (neu: 07.11.10) */ /* IMPRESSUM - Facebox */ /* FOOTER **************************************************************************************************************
© 2008-2009 Daydream *** Flying Sparky Design
*************************************************************************************************************************/ .footerWrap {position: absolute; top: 100%; left: 0; width: 100%; height: 90px; margin: -90px 0 0 0; padding: 0; z-index: 2;} /* L O G O - Bild: 34x140px */ .logoWrap {position: relative; height: 46px; background: black;} .logoWrap img {display: block; margin: auto; width: 140px; height: 34px; padding: 6px 0;} /* B O T T O M L I N K S */ .links {text-align: center; height: 20px; padding-top: 4px; background: black; filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; z-index: 3} .links ul {} .links ul li {list-style: none; display: inline; padding-right: 14px;} .links ul li a {font: bold 14px "Trebuchet MS", Helvetica, Arial, sans-serif; text-transform: uppercase; color: #999; text-decoration: none} .links ul li a:hover {font: bold 14px "Trebuchet MS", Helvetica, Arial, sans-serif; text-transform: uppercase; color: white; text-decoration: none} /* C O P Y R I G H T */ .copyright {font-size: 11px; height: 20px; text-align: center; color: #333; background: black; filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;} .copyright a {color: #333; text-decoration: none;} /***************************************************************************************************************************/ /* FACEBOX: Halbtransparente Ecken und Rahmen */ #facebox .b {background: url(js/facebox/b.png);} #facebox .tl {background: url(js/facebox/tl.png);} #facebox .tr {background: url(js/facebox/tr.png);} #facebox .bl {background: url(js/facebox/bl.png);} #facebox .br {background: url(js/facebox/br.png);} #facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {height: 10px; width: 10px; overflow: hidden; padding: 0;} /* Die ganze Box */ #facebox {position: absolute; top: 0; left: 0; z-index: 100; text-align: left;} #facebox .popup {position: relative; top: -60px} #facebox table {border-collapse: collapse;} #facebox td {border-bottom: 0; padding: 0;} #facebox .body {padding: 30px; background: #fff;} /* TABELLENZELLE: Breite der Box */ #facebox .content {} /* Inhaltsbereich */ #facebox .footer {padding-top: 5px; margin-top: 10px; text-align: right; border-top: 1px solid #ddd;} /* Linie und Close-Button*/ #facebox .loading {text-align: center;} #facebox .image {text-align: center;} #facebox img {border: 0; margin: 0;} #facebox_overlay {position: fixed; top: 0px; left: 0px; height: 100%; width: 100%;} .facebox_hide {z-index: -100;} .facebox_overlayBG {background-color: #000; z-index: 99;} * html #facebox_overlay { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');}