/* Author: Perfica, www.perfica.se * Contact: info@perfica.se * Version: 1.0 * Created: 2008 * * * CONTENTS * ----------------- * == INCLUDE * ----> defaults * ----> forms * ----> navigation * == LAYOUT **----------------------------------------------------------------------------------- /* == INCLUDE -----------------------------------------------------------------------------------*/ @import url(defaults.css); @import url(forms.css); @import url(navigation.css); @import url(external/slimbox.css); /*----------------------------------------------------------------------------------- * == LAYOUT * --------------------------------------------------------------------------------- */ div#wrapper{margin:0px auto 0px; width:900px; padding:0 15px;} #wrapper {background:#fff; position:relative; min-height:100%; border-right:5px solid #ccc; border-left:5px solid #ccc;} div#container {} div#header {position:relative;} #header h1 {padding:40px 0 40px;} #header h1 a {text-decoration:none; color:#333333; font-size:125%; font-weight:normal;} div#content {padding:20px 5px 70px 5px;} div#content p {max-width:600px;} div#footer {clear:both; width:910px; margin:0 auto; background:#ccc; border-top:5px solid #ccc; color:#666; font-size:12px; position:relative;margin-top:-45px; height:40px; line-height:40px; padding:0 10px;} #footer p {margin:0;} #footer a {color:#666;} div.section {width:200px; float:left;} /*----------------------------------------------------------------------------------- * == INDEX * --------------------------------------------------------------------------------- */ div#index {width:400px; float:left;} /*----------------------------------------------------------------------------------- * == LANGUAGE * --------------------------------------------------------------------------------- */ ul#language {overflow:hidden; float:right; margin:5px 5px 0 0;} #language li {float:left; margin-left:5px;} /*----------------------------------------------------------------------------------- * == PROMOTION && SLIDESHOW * --------------------------------------------------------------------------------- */ #slideshow_container, #slideshow, #slideshow li {height:130px; width:550px;} div#slideshow_container {position:absolute; right:5px; top:20px; border:5px solid #000;} #promotion img {} #promotion p {} #overlay {position:absolute; z-index:100; top:0; left:0; padding:15px; background:url(../img/overlay_slideshow.png) no-repeat;} div#slideshow {position:relative; overflow:hidden;} div#slideshow li {position:absolute;} /*----------------------------------------------------------------------------------- * == GUESTBOOK * --------------------------------------------------------------------------------- */ .guestbook form {margin:15px 0;} /* Validation code */ p.validation_code span {padding:5px 10px;} .validation_code .black {color:#000000; background:#000000;} .validation_code .blue {color:#0000FF; background:#0000FF;} .validation_code .green {color:#00FF00; background:#00FF00;} .validation_code .red {color:#FF0000; background:#FF0000;} .validation_code .yellow {color:#FFFF00; background:#FFFF00;} /*----------------------------------------------------------------------------------- * == LINKS * --------------------------------------------------------------------------------- */ div.links {overflow:hidden;} .links .column {float:left; width:30%; margin-right:2%; margin-bottom:15px;} .links .row {clear:left;} .links h3 {} .links ul {} .links ul li {margin-bottom:3px;} /*----------------------------------------------------------------------------------- * == STAFF * --------------------------------------------------------------------------------- */ div.staff {overflow:hidden;} .staff .column {float:left; width:340px;padding:10px;margin:0 15px 15px 0; border:1px solid #ccc; border-right:2px solid #ccc;border-bottom:2px solid #ccc;} .staff .row {clear:left;} .staff span.title {letter-spacing:2px; color:#666666; display:block; margin-bottom:5px;} .staff h3 {margin: 0 0 5px 0;} .staff dl dt {font-weight:bold; margin-top:10px;} /*----------------------------------------------------------------------------------- * == PORTFOLIO * --------------------------------------------------------------------------------- */ div.portfolio {} /*----------------------------------------------------------------------------------- * == GALLERY * --------------------------------------------------------------------------------- */ div.gallery {} .gallery ul {overflow:hidden; margin-bottom:15px;} .gallery ul li {float:left; margin-right:10px;} div.gallery_image {text-align:center;} /*----------------------------------------------------------------------------------- * == WEBSHOP * --------------------------------------------------------------------------------- */ div.webshop {margin-left:215px;} .webshop span.price {font-size:200%; color:#990000; display:block; margin:5px 0;} .webshop_latest span.price, .webshop_category span.price {font-size:120%;} .webshop a.more_info {margin-top:15px; float:left;} form#add_to_basket {padding:10px; background:#efefef; text-align:center; margin-bottom: 20px; } #add_to_basket legend {} #add_to_basket label {display:inline;} #add_to_basket button {display:inline;} #add_to_basket .small {width:50px;} /* LATEST & CATEGORY LIST */ div.webshop_latest, div.webshop_category {} .webshop_latest ul, .webshop_category ul {overflow:hidden;} .webshop_latest ul li, .webshop_category ul li {float:left; margin:0 12px 15px 0; width:200px;height:220px; overflow:hidden; position:relative;} .webshop_latest ul li div, .webshop_category ul li div {height:150px; position:relative; } .webshop_latest ul li div img, .webshop_category ul li div img {position:absolute; bottom:0;} .webshop_latest ul h3, .webshop_category ul h3 {padding-top:5px; font-size:100%;} .webshop_latest ul li.row, .webshop_category ul li.row {clear:left;} .webshop_latest .price, .webshop_category .price {position:absolute; bottom:0; padding:5px; width:200px;} /* PRODUCT */ div.webshop_product {} .webshop_product ul {overflow:hidden;} .webshop_product ul li {float:left; margin:5px;} .webshop_product ul li.row {clear:left;} .webshop_product .column {float:right; width:250px; margin-left:15px;} .webshop_product dl {overflow:hidden;} .webshop_product dt {font-weight:bold; clear:left; float:left; width:150px;} .webshop_product dd {} .webshop_product dd, .webshop_product dt {padding:5px 0; border-bottom:1px dashed #ccc;} /* CART */ div#cart {border:2px solid #777; padding-bottom:5px;} #cart ul {padding-left:10px;} #cart ul li {} #cart p {padding-left:10px;} #cart label {font-weight:normal;} #cart li {margin-bottom:3px;} #cart p.summary {} /* CHECKOUT */ div.webshop_checkout {} .webshop_checkout tr.summary th {} .webshop_checkout .summary button {display:inline;} .webshop_checkout .summary a {padding:0 15px; font-weight:normal;} .webshop_checkout .list {margin-bottom:15px;} .webshop_checkout fieldset {overflow:hidden; margin-bottom:30px;} .webshop_checkout .row {clear:left;} /* SEARCH */ form#webshop_search {margin-left:5px;} #webshop_search .input_text {height:23px; width:125px;} #webshop_search button {display:inline;} /*----------------------------------------------------------------------------------- * == VIDEO * --------------------------------------------------------------------------------- */ div.video {} /* PLAYER */ #video_player {margin-bottom:15px; float:left;} /* LIST */ ul#video_list {} #video_list li {overflow:hidden; margin-bottom:5px; padding:5px;} #video_list li.row1 {} #video_list li.row2 {} #video_list img {float:left; margin-right:10px; width:100px;} #video_list p {margin-bottom:3px;} /* DESC */ p#video_description {float:left; margin-left:15px; width:300px;} /* MISC */ #h_video_more {clear:left;} /*----------------------------------------------------------------------------------- * == LEVERANTÖRER * --------------------------------------------------------------------------------- */ div.suppliers {} .suppliers table {width:100%;} .suppliers table td {width:60%; padding-top:15px;} .suppliers table tr {border-bottom:2px solid #efefef;} .suppliers table td.image {text-align:right; padding-right:5%; width:25%;} .suppliers table td a {display: block; margin-top: 5px;} /*----------------------------------------------------------------------------------- * == LUNCH * --------------------------------------------------------------------------------- */ ul.lunch_list { margin-bottom: 20px; } ul.lunch_list li { list-style:square inside; } /*----------------------------------------------------------------------------------- * == CONTACT * --------------------------------------------------------------------------------- */ div.contact {overflow:hidden;} .contact form {float:left; width:300px;} .contact .large {} .contact #extra_info {} #extra_info p {margin:0;} /* MAP */ div#map {float:left; width:400px; margin:48px 0 0 20px; padding:10px;} /*----------------------------------------------------------------------------------- * == SITEMAP * --------------------------------------------------------------------------------- */ div.sitemap {} .sitemap ul {margin-left:30px;} /*----------------------------------------------------------------------------------- * == POST - container that's beeing used for news, blog etc * --------------------------------------------------------------------------------- */ div.post {overflow:hidden; margin-bottom:35px;} div.post h3 {margin:0 0 5px;} span.date {font-size:80%; margin-bottom:5px; display:block;} .post ul {clear:both;float:right; overflow:hidden;} .post ul li {float:left; margin-left:10px;} /*----------------------------------------------------------------------------------- * == IMAGES CONTAINERS - determines what side of the page the images should be display on. * --------------------------------------------------------------------------------- */ .right {float:right; margin:0 0 5px 10px;} .left {float:left; margin:0 10px 5px 0;} ul.right img, ul.left img {display:block; margin-bottom:5px;} /*----------------------------------------------------------------------------------- * == FX * --------------------------------------------------------------------------------- */ /* MESSAGES */ div#fx_messages_container {overflow:hidden; height:45px; width:950px; margin:0 auto; position:relative;} ul#fx_messages {position:relative; width:8000000px;} ul#fx_messages li {height:45px; width:950px; float:left; line-height:45px; font-size:18px; text-align:center;} /*----------------------------------------------------------------------------------- * == CLOSED.PHP * --------------------------------------------------------------------------------- */ div.closed {text-align: center;} div.closed p {margin: 0 auto; width: 450px;} div.closed_languages {margin: 40px 0;} div.closed_languages a {padding: 0 2px; margin: 0;} /*----------------------------------------------------------------------------------- * == BOXES - Boxes that beeing included on desired places. * --------------------------------------------------------------------------------- */ div.webshop {} .webshop h3 {background:#fff; margin-bottom:0;} div#boxes {float:right; width:230px; margin-top:55px; margin-left:20px;} /* GENERAL */ div.boxes {background:#efefef; padding:10px; margin-bottom:20px;} .boxes a {display:block; margin-top:10px;} .boxes h3 {font-size:18px;} .boxes ul {list-style-type:disc; list-style-position:inside;} /* BLOG */ div#blog_latest {} #blog_latest dl {} #blog_latest dl dt {} #blog_latest dl dd {} /* CALENDAR */ div#calendar_latest {} #calendar_latest dl {} #calendar_latest dl dt {} #calendar_latest dl dd {} /* GALLERY */ div#gallery_latest {} #gallery_latest dl {} #gallery_latest dl dt {} #gallery_latest dl dd {} /* LUNCH */ div#lunch_latest {} #lunch_latest dl {} #lunch_latest dl dt {} #lunch_latest dl dd {} /* NEWS */ div#news_latest {overflow:hidden;} #news_latest h4 {margin:5px 0;} #news_latest img {float:right; margin:0 0 5px 10px;} #news_latest dl dt {} #news_latest dl dd {} /* PORTFOLIO */ div#portfolio_latest {} #portfolio_latest dl {} #portfolio_latest dl dt {} #portfolio_latest dl dd {} /* WEBSHOP */ div#webshop_latest {} #webshop_latest ul {} #webshop_latest ul li {} /* MAGNUS TIPSAR */ #magnus_tipsar {clear:left;} #magnus_tipsar ul {overflow:hidden;} #magnus_tipsar li {float:left; width:130px;margin-right:15px;} #magnus_tipsar h4 {font-weight:normal;} .price {color:#991B25;text-decoration:none; font-weight:bold;} #webshop_aktuellt, #webshop_begagnat {float:left; width:230px; margin-left:15px;} #webshop_aktuellt h4, #webshop_begagnat h4 {font-weight:normal;} #webshop_aktuellt li, #webshop_begagnat li {overflow:hidden;margin-bottom:5px;} #webshop_aktuellt img, #webshop_begagnat img {float:left; margin-right:10px;} #webshop_aktuellt a, #webshop_begagnat a, #magnus_tipsar a {text-decoration:none;} #webshop_aktuellt a:hover, #webshop_begagnat a:hover, #magnus_tipsar a:hover {text-decoration:underline;} /*----------------------------------------------------------------------------------- * == MISC * --------------------------------------------------------------------------------- */ .split {}