/* Design: Iris Moustakidis irishthehammond@gmx.at */ /* Coding: Marco di Salvo marco@freeatlastdist.at */ /* FARB PALETTE Hintergrund Body Schwarz: #050505 Grau: #1b1818 Grau: #5b5a5a Purple: #a902bc Weiss: #fffefe Schwarz: #090909 Rot (Links): #c02827 */ /* R&B */ html { overflow-y: scroll; } * { margin: 0; padding: 0; } body { font-size: 75%; font-family: Trebuchet MS, Lucida Grande, Helvetica, Arial, sans-serif; background: url(../img/bgdcy.gif) repeat #050505; overflow:hidden; } p { color: #fff; font-size: 1em; letter-spacing:1px; line-height: 1.4em; padding: 0 15px 0 20px; } p.products { color: #000; font-size: 1em; letter-spacing:1px; line-height: 1.4em; padding: 0 15px 0 20px; } p.teiler { margin: 0 0px 10px 0px; padding: 0 0 0 0; background: url(../img/teiler.jpg) no-repeat; width:550px; height:17px; } p.teiler1 { margin: 0 0px 10px 0px; padding: 0 0 0 0; background: url(../img/teiler1.jpg) no-repeat; width:550px; height:17px; } div#sideleft { margin: 10px 0 20px 10px; z-index: 10;} ol, ul { list-style: none; } img.noborder { border: none; } img.sidebar { width: 320px; padding: 10px 10px 20px 10px; border: none;} img.products { width: 60px; padding: 10px 10px 20px 10px; border: none;} img.productstshirts { width: 120px; padding: 10px 10px 20px 10px; border: none;} img.teampic { width: 160px; padding: 10px 10px 20px 0px; border: none;} img.teammember { width: 200px; padding: 15px 15px 15px 15px; border: none;} .button { border: 2px solid #08cef3; background: white; padding: 3px 8px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: 090909; } a { color: #a902bc; text-decoration: none; } a:hover, a:active { text-decoration: none; color: #fff; } a.shoplink { color: #fff; text-decoration: none; } a.shoplink:hover, a:active { color: #a902bc; text-decoration: none; } h1 { color:#fff; font-size: 1.6em; margin: 15px 15px 10px 15px; padding: 2px 0 2px 5px; background: url() center no-repeat #a902bc; } h1.products { color:#000; font-size: 1.6em; margin: 15px 15px 10px 15px; padding: 2px 0 2px 5px; background: url() center no-repeat #a902bc; } h2 { color:#fff; font-size: 1.2em; margin: 10px 0px 0 10px; padding: 20px 2px 2px 8px; background: url() center no-repeat #050505; } h3 { color:#a902bc; font-size: 1.4em; font-style: normal; margin: 5px 10px 0px 10px; padding: 2px 2px 2px 5px; background: url() center no-repeat #000; } h3.products { color:#a902bc; font-size: 1.4em; font-style: normal; margin: 5px 10px 0px 10px; padding: 2px 2px 2px 5px; background: url() center no-repeat #000; } h4 { color:#fff; font-size: 0.8em; font-weight: lighter; margin: 5px 300px 10px 32px; padding: 2px 0px 2px 10px; background: url() center no-repeat #a902bc; } address { width: 200px; float: left; color: #5b5a5a; font-size: 1em; line-height:1.4em; padding:10px 15px 100px 40px; text-align: left; } .floatleft { float: left; } .floatright { float: right; } .clear { clear: both; } /* END R&B */ /* PAGE STYLE */ body#news ul.header_navi li a.news, body#products ul.header_navi li a.products, body#team ul.header_navi li a.team, body#media ul.header_navi li a.media, body#contact ul.header_navi li a.contact { color:#fff; } div#page-wrap { width: 960px; margin: 0 auto 0; transparent fixed; z-index: 10; background: url(../img/body_bg.jpg) no-repeat #050505 center fixed; } div#header_image { margin: 0 auto; width: 960px; height: 292px; background: url(../img/header.png) center no-repeat transparent; } div#header_navi { margin: -60px 0 40px 260px; width: 680px; height:22px; padding: 0 0 0 0; background: url() center no-repeat transparent; } ul.header_navi li { display: inline; } ul.header_navi li a { margin: 0px 10px 0px 0; padding: 0px 5px 0px 5px; float: left; text-transform: uppercase; letter-spacing: 1px; background: #a902bc; color: #000; font-size: 1.5em; font-weight: bold; overflow: hidden; } ul.header_navi li a:hover { color: #fff; text-decoration: none; } ul.shoplinks li { } ul.shoplinks li a { margin: 0px 0px 0px 20px; padding: 0px 0px 0px 5px; float: left; letter-spacing: 0px; color: #fff; font-size: 1em; font-weight: bold; overflow: hidden; text-decoration: none; } ul.shoplinks li a:hover { color: #a902bc; text-decoration: none; } #leftcolumn { width: 340px; float: left; background: url(../img/sidebar_bg.jpg); margin: 0px 0px 100px 20px; } #leftcolumnteam { width: 440px; float: left; background: url() #000; margin: 0px 0px 100px 20px; } div#leftcolumn img { margin: 0 0 20px 0; } #rightcolumn { float: right; background-color: #050505; width: 550px; margin: 0px 21px 40px 0px; } #rightcolumnteam { float: right; background: url() #000; width: 440px; margin: 0px 21px 100px 0px; } #rightcolumn1 { float: right; background-color: #fff; width: 550px; margin: 0px 21px 40px 0px; } #rightcolumnproducts { float: right; background: url(../img/bg_products.png) transparent; width: 550px; height: 650px; margin: 0px 21px 40px 0px; } p#rightcolumn, pre#rightcolumn { padding: 10px 10px 10px 10px; } #centercolumn { width: 914px; height:1055px; overflow:hidden; margin: 0 auto 30px; background: url(../img/team_bg.png) no-repeat top center transparent; } #centercolumncontact { width: 914px; height:660px; margin: 0 auto 30px; background: url(../img/contact.png) no-repeat center transparent; } #centercolumncontact1 { position:relative; width: 800px; height:660px; margin: 0px auto 30px; background: url() no-repeat center #050505; } #centercolumncontact1leftinside { width: 280px; height:600px; float:left; background: url() no-repeat center #050505; } #centercolumncontact1middleinside { width: 265px; height:600px; float:left; background: url() no-repeat center #050505; } #centercolumncontact1rightinside { width: 230px; height:600px; float:right; background: url() no-repeat center #050505; } #centercolumnmedia { width: 914px; margin: 0 auto 0px; background: url() no-repeat center transparent; } table.productsskateboards { position: relative; width: 90%; margin: 5px 15px 15px 30px;} tr.textrowproductsskateboards { color: #5b5a5a; font-size: 0.9em; font-weight: bold; text-align: center; } table.productstshirts { position: relative; width: 90%; margin: 5px 15px 15px 30px;} table.team { position: relative; width: 800px; margin: 140px 27px 35px 100px;} tr.teamname { color: #5b5a5a; font-size: 0.9em; font-weight: bold; text-align: left; } tr.teamname td { width: 200px; } td.teampic img { width: 200px; margin: 20px 24px 5px 0; } table.teammember { width: 400px; margin: 15px 0px 15px 15px; border:none; color: #fff;} table.teammember td { width: 40px;} table.shop { position: relative; width: 90%; margin: 5px 15px 15px 15px;} td.shoppic img { width: 200px; margin: 20px 24px 5px 0; } div#shop { margin: 0 auto; } div#shop p { color: #fff; padding: 10px 0 0 0; text-align: center; font-size: .9em; font-weight: normal; } div#shop img { padding: 0 0 0 10px; border: none; } div#video { margin: 0 auto 0; } div#video p { color: #000; padding: 10px 0 0 0; text-align: center; font-size: .9em; font-weight: normal; } div#video img { padding: 0 0 0 10px; border: none; } div#contact { width: 666px; margin: 10px 10px 20px 10px; float: left; background: url() repeat #050505; } div#contact img { float: right; padding: 0 20px 20px 10px; border: none; } div#footer { margin: 0 20px 0px 20px; width: 920px; clear: both; background: #050505; height: 38px; z-index: 5;} div#footer p { color: #5b5a5a; padding: 5px 0 0px 0; text-align: center; font-size: .8em; font-weight: lighter; } ul#footer_nav { width: 962px; float: left; text-align: center; font-size: .9em; margin: 5px 0px 0px 0px; } ul#footer_nav li { display: inline; color: #5b5a5a; padding: 3px 1px;} ul#footer_nav li a { color: #5b5a5a; } ul#footer_nav li a:hover { background: black; color: #a902bc; } /* END PAGE STYLE */ /* CONTACT FORM */ /* Modified contact form originally created by Chris Coyier from css-tricks.com */ fieldset { width: 300px; float: left; padding:10px 10px 10px 20px; margin:0; border:0px solid #ccc; border-bottom-width:0px; } legend { color:#f8e81d; padding:0 10px; margin:0; font-size:1.5em; font-family: Palatino, Georgia, Times, serif; font-weight: bold; } input { width:300px; font:1em Helvetica, Arial, sans-serif; } input, textarea { border:4px solid #08cef3; width:300px; padding:5px; margin:10px 0 0 0; } input:focus, textarea:focus { background:#c7c8dd; } textarea { font:1em Helvetica, Arial, sans-serif; } label { color: #08cef3; display:block; margin:12px 0 0; font-size:1em; float: left; clear:left; width:90px; padding-top:3px; } label:after { content:": "; } button { display:block; float:left; clear:both; margin:1em 0 1em 00px; } input.suche { position: relative; width: 150px; font-size:.9em; margin: 15px 0 0 0; padding: 3px 2px 3px 2px;} input.submitbutton { position: relative; width: 30px; font-size:.9em; margin: 12px 0 0 0; padding: 2px 2px 2px 2px;} /* END CONTACT FORM */ /* USER FEEDBACK */ .yay, .oops { font-size:1em; text-align:center; padding:10px; color:#ccc; } .yay { background:; } p.yay { padding: 20px 50px } p.oops { padding: 20px 50px } .oops { background:#c7c8dd; } div.error { font-size:1em; font-weight:700; padding:5px 0 0; color:#f8e81d; padding:10px 0 0 2px; } /* END USER FEEDBACK */ /* MOUSEOVER TOOLTIP */ a.tooltip { display:block; margin-bottom:0px; height:30px; text-align:center; width:10px; padding:0px; text-decoration:none; } p.tooltip { display:block; margin-bottom:0px; height:30px; text-align:center; width:10px; padding:0px; text-decoration:none; } /* END MOUSEOVER TOOLTIP */ /* LIGHTBOX */ #lightbox { position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;} #lightbox img { width: auto; height: auto;} #lightbox a img { border: none; } #outerImageContainer { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #imageContainer { padding: 10px; } #loading { position: absolute; top: 30%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #hoverNav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #imageContainer>#hoverNav { left: 0;} #hoverNav a { outline: none;} #prevLink, #nextLink { width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; } #prevLink { left: 0; float: left;} #nextLink { right: 0; float: right;} #prevLink:hover, #prevLink:visited:hover { background: url(../js/lightbox/prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(../js/lightbox/nextlabel.gif) right 15% no-repeat; } #imageDataContainer { font: 10px Helvetica, Arial, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 30% ; } #imageData { padding:0 10px; color: #666; } #imageData #imageDetails { width: 70%; float: left; text-align: left; } #imageData #caption { font-weight: bold; } #imageData #numberDisplay { display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose { width: 66px; float: right; padding-bottom: 0.7em; outline: none;} #overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; } /* END LIGHTBOX */ /* GALLERIE */ .imgbrowz0r-navigation, #imgbrowz0r { font-size: 1.2em; color: #f8e81d; margin: 20 auto;width: 570px; text-align: center } .imgbrowz0r-navigation { padding: 1.5em 0 0.5em } .imgbrowz0r-navigation .img-statistics { margin-top: 1.5em } #imgbrowz0r .img-row { padding: 0 1em } #imgbrowz0r .img-directory a:link, #imgbrowz0r .img-directory a:visited { color: #f8e81d; font-family: Palatino, Georgia, Times New Roman, Times, serif;text-decoration: none } #imgbrowz0r .img-pagination {text-align: center;} #imgbrowz0r-navigation .img-breadcrums {font-size: 1.7em; } #imgbrowz0r .img-thumbnail a:link img, #imgbrowz0r .img-thumbnail a:visited img { border: 2px solid #000 } #imgbrowz0r .img-thumbnail a:hover img, #imgbrowz0r .img-thumbnail a:active img { border-color: #a43629 } #imgbrowz0r .img-directory a:link, #imgbrowz0r .img-directory a:visited { background-color: #000;border: 2px solid #000;font-size: 1.5em; } #imgbrowz0r .img-directory a:hover, #imgbrowz0r .img-directory a:active { border-color: #a43629;color: #F52542 } #imgbrowz0r .img-directory span.img-dir-name, #imgbrowz0r .img-directory span.img-thumb-date { display: block } #imgbrowz0r .img-directory span.img-dir-name { font-weight: bold;font-size: 1.2em } #imgbrowz0r .img-thumbnail a, #imgbrowz0r .img-directory a { color: #f8e81d; display: block;margin: 0 auto;width: 140px } #imgbrowz0r .img-thumbnail, #imgbrowz0r .img-directory { color: #f8e81d; float: left;padding: 1.5em 0;width: 33%;text-align: center } #imgbrowz0r .img-column-1 { font-size:0.8em; clear: left } #imgbrowz0r .img-column-2 { font-size:0.8em; } #imgbrowz0r .img-column-3 { font-size:0.8em; } #imgbrowz0r .img-directory a:link, #imgbrowz0r .img-directory a:visited { color: #f8e81d; height: 100px;line-height: 30px; background-repeat: no-repeat;background-position:30% 30% } html body div.clear, html body span.clear { background: none;border: 0;clear: both;display: block;float: none;font-size: 0;list-style: none; margin: 0;padding: 0;overflow: hidden;visibility: hidden;width: 0;height: 0 } /* END GALLERIE */