/* General HTML elements */
form, p, h1, h2, h3, h4, h5, h6, div, img, ul, ol, li, blockquote { margin: 0; padding: 0; }
body { margin: 0; padding: 0; background: #333; color: #fff; font: 62.8% Arial, Helvetica, sans-serif; text-align: center; }
img { border: none; }
h1 { margin: 15px 0; padding: 5px 10px; font: bold 1.7em Arial, Helvetica, sans-serif; }
h1.main { padding: 0; }
h1.brand { padding: 0; }
h2 { color: #333; margin: 0; border-bottom: #333 1px solid; font: bold 1.5em Arial, Helvetica, sans-serif; }
h2 img { vertical-align: middle; }
h3 { margin: 15px 0; font: bold 1.3em Arial, Helvetica, sans-serif; }
h3.store_title { padding: 5px; }
p { margin: 15px 0; font-size: 1.2em; }
p.postmetadata { padding-bottom: 10px; border-bottom: 1px solid #000; margin-top: 10px; }
address { margin: 15px 0; font-size: 1.2em; font-style: normal; }
ul, ol { margin: 15px 0; padding: 0 0 0 2em; font-size: 1.2em; font-style: normal; }
li { margin: 4px 0; }
ul ul, ul ol, ol ul, ol ol { font-size: 1em; }
/* Link Colours */
a { color: #8bc53f; }
a:visited { color: #8bc53f; }
a:focus { color: #47A228; text-decoration: none; }
a:hover { color: #47A228; text-decoration: none; }
a:active { color: #080; }
/* Useful Classes */
.error, .errors { color: #f00; }
.left { float: left !important; }
.right { float: right !important; }
img.left { margin: 0 10px 10px 0; }
img.right { margin: 0 0 10px 10px; }
img.synthgeek {float: right; margin-top: -22px;}
.clear_left { clear: left; display: block; }
.clear_right { clear: right; display: block; }
.clear_both { clear: both; display: block; }
.hide { display: none; }
img.icon { vertical-align: middle; }
div.column { width: 50%; }
p.click_image { font-weight: bold; }
ol.numerals { list-style-type: lower-roman; }
ol.alpha { list-style-type: lower-latin; }
p.login_field { text-align: right; }
.center { text-align: center !important; }
p span.pence { font-size: 0.7em; vertical-align: top; }
ul.subcategories { padding: 0; }
ul.subcategories li { display: inline; margin: 0; padding: 0 3px 0 5px; border-left: 1px solid #8bc53f; }
ul.subcategories li.first { border-left: none; padding: 0 3px 0 0; }
/* General Forms */
form { display: inline; }
label { float: left; width: 150px; padding: 0 5px 0 0; }
label.inline { display: inline; float: none; width: auto; padding: 0; }
input.text, select, textarea { vertical-align: middle; border: 1px #999 solid; }
/* Blog Search Text */
input.text_blog, select, textarea { float: left; padding-left: 10px; vertical-align: middle; border: 1px #999 hidden; margin-right: 0px; margin-top: -6px; height: 28px; width:600px; font-size: 12px; margin-left: 6px; }
input.button_blog { float: right; cursor: pointer; vertical-align: middle; border-width: 0; background: #8bc53f; color: #333; text-align: center; font: bold 1em Arial, Helvetica, sans-serif; padding: 7px; width:77px; margin-right: 5px; margin-top: -30px; height:30px; font-size: 15px;}
input.required, select.required, textarea.required { border-color: #f00; }
input.button { cursor: pointer; vertical-align: middle; border-width: 0; background: #8bc53f; color: #333; text-align: center; font: bold 1em Arial, Helvetica, sans-serif; }
input.button:hover, input.button:focus { background: #47A228; color: #ff0; }
input.add_to_basket, input.checkout, input.pay { background: #f00; }
input.add_to_basket:hover, input.checkout:hover, input.pay:hover, input.add_to_basket:focus, input.checkout:focus, input.pay:focus { background: #900; }
input.checkout { font-size: 1.3em; }
fieldset { padding: 5px; margin: 10px 5px; border: 1px #999 solid; }
legend { padding: 0 10px; margin: 0 0 0 -5px; font-size: 1.4em; font-weight: bold; }
input.checkbox { border: none; }
ul.errors label { display: inline; float: none; width: auto; padding: 0; }
fieldset.active { margin: 5px 0; padding: 1px 15px; border: none; }
fieldset.active legend { padding: 3px 10px; margin: 0 0 0 -15px; }
fieldset.inactive { margin: 5px 0; padding: 1px 15px; border: none; }
fieldset.inactive legend { padding: 3px 10px; margin: 0 0 0 -15px; }
fieldset.left, fieldset.right { margin: 10px 0; padding: 1px 5px; border: none; width: 48%; }
fieldset fieldset { padding: 1px 5px; margin: 10px 0; border: none; }
fieldset fieldset legend { padding: 3px 0; margin: 0 0 0 -5px !important; }
/* Tables */
table { width: 100%; margin: 0; clear: both; color: #000; background: #fff; font-size: 1em; }
th, td { padding: 2px 5px; }
thead tr { background: #8bc53f; color: #fff; }
thead th { font-size: 1.2em; text-align: center; }
tbody th { font-size: 1em; }
tbody td { font-size: 1.2em; text-align: center; }
tr.even { background: #f6f6f6; }
tr.sub_total { background: #eee; }
tr.vat_total { background: #ddd; }
tr.delivery { background: #ccc; }
tr.grand_total { background: #8bc53f; color: #fff; }
tr.grand_total td, tr.grand_total th { font-size: 1.2em; }
td.functions { text-align: right; }
td.was_price { color: #CD72C7; text-decoration: line-through !important; }
td.save { color: #f00; }
td.now_price { color: #6C2669; font-weight: bold; }
tr.last td { padding: 2px 5px; background: #ececec; border: 1px #dbdbdb solid; text-align: center; font-family: Verdana, Arial, Helvetica, sans-serif; text-transform: uppercase; font-size: 1em; text-align: right; }
table img { vertical-align: middle; }
/* Header */
div#header { text-align: left; background: #333; padding: 0; width: 920px; /*height: 140px;*/ margin: auto; }
a#logo { float: left; clear: left; margin: 5px 0 5px 0; }
/* Top Menu */
ul#top_menu { font-size: 1em; font-style: normal; color:#ccc; padding: 5px 0 25px 0; margin: 0; clear: both; text-align: right; font-weight: bold; }
ul#top_menu li { display: inline; border-left: 1px #808080 solid; padding: 0 10px; margin: 0; }
ul#top_menu li.first { border-left: none; }
ul#top_menu li a { color: #ccc; text-decoration: none; }
ul#top_menu li a:hover, ul#top_menu li a:focus { color: #8bc53f; }
/* Categories */
ul#main_menu { font-weight: bold; text-align: center; padding: 20px 0 10px 0; margin: 0; font-size: 1.2em; color: #ccc; position: relative; clear: both; }
ul#main_menu li { list-style-type: none; display: inline; border-left: 1px solid #808080; padding: 5px 20px; margin: 0; color: #ccc; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; }
ul#main_menu li.first { border-left: none; margin: 0; }
ul#main_menu li:hover { color: #8bc53f; }
ul#main_menu li a { text-decoration: none; color: #ccc; }
ul#main_menu li a:hover, ul#main_menu li a:focus { color: #fff !important; }
ul#main_menu li:hover a, ul#main_menu li.active a { color: #333; }
ul#main_menu li:hover a:hover, ul#main_menu li.active a:hover { color: #fff; }
ul#main_menu li ul.subcategories a { color: #ccc; background: transparent !important; }
ul#main_menu li:hover, ul#main_menu li.active { background: #8bc53f; color: #ccc; }
ul#main_menu li ul.subcategories li { background: transparent !important; }
ul#main_menu li strong a { color: #8bc53f !important; }
ul#main_menu li strong a:hover { color: #fff !important; }
ul#main_menu li ul.subcategories { font-weight: normal; /*text-align: left;*/ color: #ccc; z-index: 80; position: absolute; left: -10px; top: 40px; margin: 0; padding: 1px 10px 1px 10px; margin: 0; width: 920px; height: 230px; display: none; background: #333 url("../gfx/layout/background-subcategories.jpg") bottom left no-repeat; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; border: 2px solid #8bc53f; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
ul#main_menu li:hover ul.subcategories { display: block; }
ul#main_menu li ul.subcategories li { display: block; float: left; width: 20%; border-width: 0; margin: 0; padding: 0; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; }
ul#main_menu li ul.subcategories li a { display: block; margin: 2px 10px; }
ul#main_menu li ul.subcategories li.clear_both { float: none; }
ul#main_menu li ul.subcategories li.clear_left { float: none; width: 100%; }
ul#main_menu li ul.subcategories li ul { margin: 0; padding: 0; }
ul#main_menu li ul.subcategories li ul li { float: none; width: auto; margin: 0; padding: 0; }
ul#main_menu li ul.brands { overflow: auto; }
ul#main_menu li ul.brands li { width: 19.5%; }
/* Container */
div#container { padding: 0; margin: 0 auto; clear: both; background: #000 url("../gfx/blog/background.jpg") top center repeat-y; color: #000; text-align: center; }
/* Inner */
div#inner { clear: both; width: 920px; margin: auto; background: rgba(255, 255, 255, 0.7) top left repeat-x; padding: 1px 20px; -moz-border-radius: 0 0x 0 0; -webkit-border-radius: 0 0 0 0; border-radius: 0 0 0 0; /*-moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333;*/ text-align: left; }
/* Homepage Block */
div#big_block { height: 300px; margin: 10px auto 0 auto; padding: 0; background: #333; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; }
div#big_block a.left { margin: 0 10px 0 0; }
div#big_block object { margin: 0 10px 0 0; float: left; }
div#big_block h1 { font: bold 1.7em Arial, Helvetica, sans-serif; color: #8bc53f; margin: 0; padding: 20px 10px 0 0; }
div#big_block p { font: 1.3em Arial, Helvetica, sans-serif; color: #fff; margin: 0; padding: 10px 42px 0 10px; line-height: 135%; }
div#big_block p#block_end { height: 1px; width: 1px; margin: 0 0 0 646px; padding: 0; }
#free_shipping { z-index: 100; position: absolute; left: auto; top: auto; margin: -40px 0 0 200px; }
/* Large Banner */
div#small_block { text-align: left; height: 147px; margin: 10px auto 0 auto; padding: 0; }
a#banner_link { float: right; clear: right; margin: 0; }
/* Phone Box */
div#phone_box { clear: both; float: right; background: #333; height: 85px; width: 250px; padding: 0; margin: 10px 0 0 0; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; -moz-border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; }
div#phone_box h2 { font: 1.9em Arial, Helvetica, sans-serif; color: #fff; margin: 0; padding: 11px 0 0 10px; }
div#phone_box address { font: bold 3.4em Arial, Helvetica, sans-serif; color: #8bc53f; margin: 0; padding: 2px 0 0 10px; }
/* Search Box */
form#search_box { float: left; background: #000; height: 85px; width: 655px; padding: 0; margin: 10px 0 0 0; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; -moz-border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; }
form#search_box h2 { font: 1.9em Arial, Helvetica, sans-serif; color: #fff; margin: 0; padding: 11px 0 0 10px; }
form#search_box p { padding: 0; margin: 10px; background: #fff; text-align: right; }
form#search_box p input.text { border-width: 0; margin: 0 10px 0 0; width: 525px; font-size: 1.1em; }
form#search_box p input.button { border-width: 0; padding: 2px 5px; color: #333; font-size: 1.2em; }
form#search_box h2.blogsearch { font: 1.9em Arial, Helvetica, sans-serif; color: #fff; margin: 0; padding: 11px 0 0 17px; }
/* Left Column */
ul#right_column { width: 250px; float: right; margin: 10px 0; padding: 0; font-size: 1em; }
ul#right_column li { list-style-type: none; background: #fff; padding: 10px; margin: 0 0 10px 0; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; -moz-border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; }
ul#right_column li h2 { margin: 0 0 10px 0; }
ul#right_column li img { margin: 0; }
ul#right_column li a { text-decoration: none; color: #8bc53f; }
ul#right_column li a:hover { text-decoration: none; color: #333; }
ul#right_column ul { font-size: 1.2em; }
ul#right_column ul li { margin: 5px 0; padding: 0; -moz-box-shadow: 0 0 0 #fff; -webkit-box-shadow: 0 0 0 #fff; box-shadow: 0 0 0 #fff; list-style-type: disc; }
div#left_column {width: 250px; }
ul#left_column { width: 250px; float: left; margin: 10px 0; padding: 0; font-size: 1em; }
ul#left_column li { list-style-type: none; background: #fff; padding: 10px; margin: 0 0 10px 0; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; -moz-border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; }
ul#left_column li h2 { margin: 0 0 10px 0; }
ul#left_column li img { margin: 0; }
ul#left_column li a { text-decoration: none; color: #8bc53f; }
ul#left_column li a:hover { text-decoration: none; color: #333; }
ul#left_column ul { font-size: 1.2em; }
ul#left_column ul li { margin: 5px 0; padding: 0; -moz-box-shadow: 0 0 0 #fff; -webkit-box-shadow: 0 0 0 #fff; box-shadow: 0 0 0 #fff; list-style-type: disc; }
/* Social Icons */
ul#right_column ul#social_icons { padding: 0; margin: 0; clear: both; text-align: center; }
ul#right_column ul#social_icons li { display: inline; padding: 0; margin: 0; }
ul#right_column ul#social_icons li a { opacity: 0.8; }
ul#right_column ul#social_icons li a:hover { opacity: 1; }
/* Content */
div#content { width: 635px; float: left; background: #fff; padding: 10px; margin: 10px 0 0 0; -moz-box-shadow: 0 5px 10px #333; -webkit-box-shadow: 0 5px 10px #333; box-shadow: 0 5px 10px #333; -moz-border-radius: 0 15px 0 0; -webkit-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; }
div#content h1 { margin: 10px 0; padding: 0; font-size: 2.5em; text-align: left; }
div#content p { text-align: justify; }
div#text_blog { width: 500px; }
/* Copyright */
p.copyright { clear: both; margin: 5px; padding: 0; text-align: center; font-size: 0.9em; }
/* Footer */
#footer { clear: both; margin: 5px auto; padding: 0; width: 940px; }
#footer p { margin:0; padding: 5px 0; clear: both; }
#footer img { }
#footer h2 { border-bottom: #fff 1px solid; color:#fff; text-align: left; font:bold 14px Arial, Helvetica, sans-serif; margin:0; padding:5px 0; }
#footer div { line-height:200%; color: #fff; text-align: left; border-right: 1px solid #fff; float: left; margin: 5px 0 30px 0; padding: 15px 15px 0 20px; width: 199px; height: 270px; }
#footer div.last { border: 0 none; }
#footer div.last ul li a img { float: right; opacity: 0.8; }
#footer div.last ul li a:hover img { opacity: 1; }
#footer div.last ul li { clear: right; }
ul#footer_news { font-size: 1em; }
ul#footer_news li { font-size: 1em; color: #fff; padding: 5px 0; margin: 0; border-bottom-width: 1px; }
ul#footer_news li h3 { font-size: 1.2em; margin: 0; }
ul#footer_news li p { color: #fff; margin: 0; }
#banner_text {
position:absolute;
width: 200px;
margin-left: 0px;
margin-top: 10px;
margin-bottom: 10px;
margin-right: 10px;
padding-top: 2px;
padding-left: 546px;
color: #fff;
font-size: 31px;
font-weight:bold;
}
/* Lightbox */
/**
* jQuery lightBox plugin
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
* and adapted to me for use like a plugin from jQuery.
* @name jquery-lightbox-0.5.css
* @author Leandro Vieira Pinho - http://leandrovieira.com
* @version 0.5
* @date April 11, 2008
* @category jQuery plugin
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
* @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
*/
#jquery-overlay {
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
}
#jquery-lightbox {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#lightbox-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
width: 49%;
height: 100%;
zoom: 1;
display: block;
}
#lightbox-nav-btnPrev {
left: 0;
float: left;
}
#lightbox-nav-btnNext {
right: 0;
float: right;
}
#lightbox-container-image-data-box {
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%;
padding: 0 10px 0;
}
#lightbox-container-image-data {
padding: 0 10px;
color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
width: 70%;
float: left;
text-align: left;
}
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
display: block;
clear: left;
padding-bottom: 1.0em;
}
#lightbox-secNav-btnClose {
width: 66px;
float: right;
padding-bottom: 0.7em;
}
/* Added at request of Paul @ Production */
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}
/* end */