body {font-family: Tahoma, Arial, Verdana; font-size: 80%; background-color: #fff; margin: 0; padding: 0; color: #082e56; min-width: 770px;}

fieldset, img {border: 0px none;}
input, button, option {color: #082e56;}

button {background: #eee url(/Images/gui/buttonGreyBackground.gif) repeat-x; border: 1px solid #bbb;}
button:hover {background: #eee url(/Images/gui/buttonGreyBackground.gif) repeat-x; border: 1px solid #777;}

button.alert {background: #eee url(/Images/gui/buttonRedBackground.gif) repeat-x;}
button.alert:hover {background: #eee url(/Images/gui/buttonRedBackground.gif) repeat-x;}

button.process {background: #afa url(/Images/gui/buttonGreenBackground.gif) repeat-x; height: 2.5em;}
button.process:hover {background: #afa url(/Images/gui/buttonGreenBackground.gif) repeat-x;}

button.back {margin-left: 0.6em; color: #555;}
button.back:hover {margin-left: 0.6em; color: #333;}

a:visited {color: #5a6464;}
a:hover {color: #2957ff;}

#loginInfoButton {visibility: hidden; height: 0; width:0;}

.hidden {display: none;}
.clr {clear: both;}

.paragraph {margin: 2em 0 1em 0; clear: both;}
.paragraph h3 {margin-top: 0;}
.paragraph .photo {float: left; margin: 0 1em 1em 0;}
.paragraph .personalInfo {float: left;}
.paragraph .personalInfo .name {font-size: 110%;}
.paragraph .note {padding: 1em 0 1em 0; font-size: 110%;}
.paragraph.highlight {background-color: #eee; padding: 1em;}

h2.homeTitle {width: 90%;}
h2.homeTitle img {margin: 0 auto 0 auto; display: block; width: 361px;}


#leftCol {float: left; width: 20%; min-width: 150px; padding-bottom: 3em;}
#rightCol {float:left; width: 75%; padding: 0 0.5em 1em 2em;}

#mainMenuColumn {float: left; width: 21%; min-width: 150px; background-color: #ecf5fd;}
#mainContentColumn {float:left; padding-left: 2em; width: 70%;}


div#header {height: 87px; width: 100%; background: #3173ba url(/Images/gui/bgHeader.gif) no-repeat left top; position: relative;}
div#logo {width: 269px; height: 38px; position: absolute; left: 11px; top: 9px; }
h1#slogan {margin: 0; padding: 0 0 0 0; font-size: 22px; font-weight: normal; position: absolute; left: 84px; top: 25px; }
h1#slogan a {text-decoration: none; color: #fff;}
h1#slogan img {margin: 4px 0 0 1px;}

form#searchForm {margin: 0; padding: 0; position: absolute; right: 1em; top: 26px;}
form#searchForm fieldset {margin: 0; padding: 0; border: 0 none;}
form#searchForm input {border: 1px solid #ddd; width: 20em;}

h1#headerTitle {position: absolute; margin: 0; left: 8.6em; top:0.8em; font-size: 200%; font-weight: normal; color: #5a6464;}

div#headerMenuContainer {height: 2.4em; width: 100%; position: absolute; bottom: 0; background: #fff url(/Images/gui/headerShadow.gif) repeat-x bottom;}
ul#headerMenu {margin: 0.4em 0 0 21%; padding: 0 0 0 0.3em; width: 50em; list-style: none; }
ul#headerMenu li {float: left; margin: 0 0.2em;}
ul#headerMenu li a {color: #26598e; padding: 0.4em 1em 0.4em 1em; text-decoration: none;}
ul#headerMenu li a:hover {color: #5a6464; background-color: #d8e7f8;}
ul#headerMenu li.highlight {font-weight: bold;}
ul#headerMenu li.spacious {margin: 0 2em;}

a#headerBasketLink {color: #26598e; position: absolute; padding: 0.2em 0 0.3em 30px; right: 1em; top: 0.2em; background: url(/Images/gui/cartIcon.gif) no-repeat;}
a#headerBasketLink:hover {color: #5a6464; background-color: #fff;}


#footer {margin: 0 0 1em 0; height: 22px; background-color: #fff; border-top: 1px solid #3e7dc1; border-bottom: 1px solid #3e7dc1; clear: both;}
#footerMenu {list-style: none; margin: 3px auto 0 35%;}
#footerMenu li {float: left; margin: 0 3em 0 0; font-size: 85%;}
#footerMenu li a {color: #26598e;}
#footer .counter {float: left; margin: 4px 0 0 3px;}

#smallCart {margin: 0 0 2em -1px; width: 100%; min-height: 12em; border: 1px solid #3173ba; background-color: #fff; text-align: center;}
#smallCartHeader {background: #3173ba url(/Images/gui/bgSmallCartHeader.gif) no-repeat left top; height: 20px; }
#smallCartHeader a {color: #fff; margin: 0.1em 0 0.2em 0.5em;  }
#smallCartContainer {border: 1px solid #d8e7f8; min-height: 12em;}
#smallCartContainer div {clear: both; padding: 0.1em 0 0.2em 0.2em;}
#smallCartContainer div.note {margin: 3.5em auto 4em auto; width: 60%; font-size: 110%;}
#smallCartContainer span {float: left;}
#smallCartContainer .link {float: right; padding: 2px; cursor: pointer;}
#smallCartContainer #smallCartButton {display: none;}
#smallCartContainer table {font-size: 85%; }
#smallCartContainer table td {text-align: left;}
#smallCartContainer table tr.odd {background-color: #ecf5fd;}
#smallCartContainer table tr.removed {background-color: #faa;}
#smallCartContainer table .number {text-align: right;}
#smallCartContainer table td.actions {width: 6em;}
#smallCartContainer table td.actions button {width: 1.5em;}
#smallCartContainer table button { padding: 0; margin-right: 0.1em; width: 1em;}
#gotoFillinButton {clear: both; margin: 0.4em auto 0.4em auto; font-size: 90%;}

.ui-drop-hover {border: 1px dashed #3173ba !important;}
.ui-drop-active {border: 1px dotted #3173ba !important;}


#categories {clear: both; padding-bottom: 1em;}
#categories .category {width: 18em; margin: 0 1em 0 1em; height: 16.5em; float: left; position: relative;}
#categories .category .categoryImage img {margin: 0 auto auto auto; width: 225px; display: block;}
#categories .category .categoryTitle {position: absolute; bottom: 0.4em; width: 100%; text-align: center; font-size: 120%;}


#categoriesTree {padding: 0.6em 0 1em 0; background-color: #ecf5fd;}
#categoriesTree li span {text-decoration: underline;}


.catalogBreadCrumbs {clear: both; margin: 0.8em 0 2em 0; padding: 0; border: 1px solid #fff;}
.catalogBreadCrumbs li {float: left; list-style: none; margin: 0;}
.catalogBreadCrumbs li span {margin: 0 0.5em 0 0.5em;}

#categoriesCompact {clear: both; }
#categoriesCompact {float: left; width: 35%; padding-left: 1em;}
#categoriesCompact .category {margin: 0 0 0.5em 0; font-size: 110%;}

.columnsContainer #brands {float: left; width: 60%; margin: 0 0 0 1em;}
.columnsContainer #brands .brand {float: left; vertical-align: middle; height: 45px; text-align: center; margin: 1em 1.8em 0.5em 0;}
.columnsContainer #brands .brand .image {display: block; margin: 0 0 0.1em 0;}
.columnsContainer #brands .brand a {display: block; }


#brandsCompact { margin: 1em 1em 1em 0; float: left; padding: 0.3em 0.3em 0.2em 0.3em; border: 2px solid #d8e7f8;}
#brandsCompact .brand {float: left; height: 30px; margin-right: 1.5em; padding: 0.2em 1em; border: 1px solid #fff;}
#brandsCompact .active {border: 1px solid #ddd;}

#products {clear: both;}
#products .product {position: relative; float: left; width: 20em; height: 14em; margin: 0.1em; border: 1px solid #fff;}
#products .product:hover {border: 1px solid #fff;}
#products .inCart {border: 1px dashed #2a0;}
#products .inCart:hover {border: 1px dashed #ccc;}
#products .product .productImage img {margin: 1em auto auto 1em; display: block;}
#products .product .productName {position: absolute; left: 0.5em; top: 11em; font-size: 90%;}
#products .product .productPrice {position: absolute; left: 6.5em; top: 3em; font-size: 150%;}
#products .product .productFields {position: absolute; left: 9.5em; top: 6.6em;}
#products .product .productFields input {width: 1.5em; border: 1px solid #aaa;}
#products .product .productFields button {padding: 0.2em 0.2em;}
#products .product .productInCart {position: absolute; right: 0.5em; top: 0.5em; color: #2a0;}


#productDetails {clear: both;}
#productImagesPart {float: left; min-width: 400px; margin: 0 0.2em 0.2em 0; }
.productProperties {padding: 0 1em 0 0;}
.productProperties .productPrice {margin: 0 0 0.5em 0; font-size: 150%;}
.productProperties .productFields button {margin: 0 0 1em 0; padding: 0.3em 0.7em;}
.productProperties .productFields input {width: 1.5em; border: 1px solid #aaa;}
.productProperties .brand {margin: 0 0 0.5em 0;}
.productProperty {margin: 0 0 1.2em 0;}
.productProperty label {font-weight: bold;}
.productProperty .paragraph {margin: 0.5em 0 1.2em 0; clear: none;}

#productNameField {width: 70%;}
#productDetails textarea.description {width: 50%; height: 20em; display: block;}

#cartReview {display: inline; }
#processOrderForm {position: relative; top: 2em;}
#processOrderForm button.process {position: absolute; right: 0; font-weight: bold; padding-left: 2em; padding-right: 2em;}

#fullCartTable {width: 100%;}
#fullCartTable thead tr {background-color: #fff;}
#fullCartTable thead tr th {padding: 0.2em 0.4em; }
#fullCartTable th {color: #26598e;}
#fullCartTable td {padding: 0.4em; }
#fullCartTable tr.even {background-color: #fff;}
#fullCartTable tr.odd {background-color: #ecf5fd;}
#fullCartTable td.actions {text-align: center;}
#fullCartTable td.actions button {padding: 0.2em 0.6em; margin: 0 0.2em 0 0.2em;}
#fullCartTable td.number, #fullCartTable th.number {text-align: right; padding-right: 0.6em;}
#fullCartTable th.totalLabel {text-align: right; padding-right: 1em;}
#fullCartFormButton {display: none;}


#ordersStatusTable {border-left: 1px solid #ccc; border-top: 1px solid #ccc;}
#ordersStatusTable thead tr {background-color: #fff;}
#ordersStatusTable thead tr th {padding: 0.2em 0.4em; }
#ordersStatusTable th {border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; color: #26598e;}
#ordersStatusTable td {padding: 0.4em; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc;}
#ordersStatusTable tr.even {background-color: #fff;}
#ordersStatusTable tr.odd {background-color: #eee;}
#ordersStatusTable td.actions {text-align: center;}
#ordersStatusTable td.number, #fullCartTable th.number {text-align: right; padding-right: 0.6em;}
#ordersStatusTable th.totalLabel {text-align: right; padding-right: 1em;}
#ordersStatusTable td.image {background: #fff;}


ul.productImages {list-style: none; margin: .5em 0 0 0; padding: 0; text-align: center;}
ul.productImages li {list-style: none; display: inline; margin: 0;}
ul.productImages li a {display: inline-block; border: solid 1px #fff;}
ul.productImages li.active a {padding: .3em 0; border: solid 1px #ccc;}


#loginForm {width: 100%;}
#loginForm legend {margin: 0 0 0 -0.5em; color: #082e56; font-weight: normal;}
#loginForm fieldset {margin: 0 auto 0 auto; width: 80%; padding: 0;}
#loginForm input {width: 100%; border: 1px solid #aaa; margin: 1px 0 2px 0;  font-size: 85%;}
#loginForm a {font-size: 85%;}
#customerInfo {margin: 0 10% 0 10%;}
#loginForm .errors {font-size: smaller; color: #a00;}

#loginForm button {float: right;}

form legend {font-weight: bold; color: #082e56;}
form .field input, form .field textarea, form .field select {border: 1px solid #aaa;}

.dataForm {margin-left: 1em; padding: 1em; width: 45em;}
.dataForm label {float: left; width: 35%;}
.dataForm .field {margin: 0.5em;}
.dataForm .field input, .dataForm .field select {width: 63%; font-size: 110%;}

#loadDataForm {margin-bottom: 2em; padding: 0.5em 0 0 0.2em;}
#loadDataForm fieldset {width: 100%; padding-bottom: 1em;}
#loadDataForm fieldset legend { margin: 0; padding: 0;}
#loadDataForm .button a {margin-left: 36%;}
#loadDataForm button {float: right; margin-right: 3%;}
#loadDataForm .errors {font-size: smaller; color: #a00;}

#orderDetailsForm {margin-bottom: 3em; background-color: #ecf5fd;}
#orderDetailsForm #notes {width:98%;}
#orderDetailsForm #firstTimeNote {margin-top: 0;}
#orderDetailsForm fieldset { width: 45em;}
#orderDetailsForm input.timeField {width: 4em;}
#orderDetailsForm .field input.checkbox {width: 1em;}

#orgRegistrationForm fieldset {margin-bottom: 1em;}
#orgRegistrationForm label {width: 37%;}
#orgRegistrationForm input, #orgRegistrationForm select {width: 61%;}

.buttons .back {margin-left: 0.6em;}
.buttons .process {padding-left: 4em; padding-right: 4em; font-weight: bold; float: right; margin-right: 2%;}
#deliveryInfo .row {margin-top: 0.5em;}
#processOrderForm {margin-top: 1em;}
 
#timePicker {margin-top: 0.5em; width: 98%;}
#timePicker .periods {position: relative; height: 1.5em;}
#timePicker span {font-size: 80%;}
#timePicker .periodStart {position: absolute; left: 0;}
#timePicker .periodMiddleLeft {position: absolute; left: 26.5%;}
#timePicker .periodMiddle {position: absolute; left: 48%;}
#timePicker .periodMiddleRight {position: absolute; right: 26.2%;}
#timePicker .periodEnd {position: absolute; right: 0;}

.ui-slider .ui-slider-handle {z-index:0!important;}
.treeview ul {background-color: #ecf5fd;}
.treeview ul li.active {background-color: #fff; border-bottom: 1px solid #c3def7; border-top: 1px solid #c3def7; border-left: 1px solid #c3def7;}
.treeview ul li.active a {background-color: #fff;}

#askQuestionForm {width: 35em; margin-top: 2em;}
#askQuestionForm legend {margin-bottom: 0.5em;}
#askQuestionForm div {margin-bottom: 0.5em;}
#askQuestionForm label {width: 20%; display: inline-block;}
#askQuestionForm input {width: 75%;}
#askQuestionForm textarea {width: 75%; height: 7em;}
#askQuestionForm button {float: right; margin-right: 4%;}

.ui-draggable-dragging {z-index: 65000; border: 1px solid #ccc; padding: 0 10px 12px 0; background: #fff; overflow: visible;}
.ui-draggable-dragging img {width: 100px; margin: 1em auto auto 1em; display: block;}
#productDetails .ui-draggable-dragging {margin: 150px;}

#timePicker .ui-slider-handle {background-image: url(/Images/gui/clockIcon.gif); cursor: w-resize;}

.externalCommentsContainer {clear: both; padding-top: 1em;}

#orderByPanel {margin-top: 2em; margin-bottom: 2em; clear: both;}
#orderByPanel div {float: left; padding-top: 0.4em;}
#orderByPanel ul { list-style: none;}
#orderByPanel ul li { float: left; margin-left: 0.4em; padding: 0.3em 0.4em 0.4em 0.4em;}
#orderByPanel ul li.active {background-color: #eee;}

#randomProductsContainer {margin-top: 3em; visibility: hidden;}
#randomProductsCarousel li {border-color: #fff!important;}
#randomProductsCarousel li {padding: 0.4em 0.2em;}

.jMyCarousel {border: 3px solid #ecf5fd !important;;}

#bezoom {top: 13.5em!important;}