body {margin: 0px; padding: 0px; font-family: Verdana, 'Geneva CE', lucida, sans-serif; font-size: 0.7em; color: black; text-align: center;}

form {margin: 0px; padding: 0px;}
input, option, select, textarea {font-family: Verdana, 'Geneva CE', lucida, sans-serif;	font-size: 100%;}

img {border: none;}
img[align|="left"] {margin: 5px 10px 0px 0px;} 
img[align|="right"] {margin: 5px 0px 0px 10px;} 

a {color: rgb(106,106,106);	font-weight: normal;}
a:hover {color: rgb(181,0,12); text-decoration: underline;}

table {font-size: 100%;}
td {font-size: 100%;}

label {cursor: pointer; _cursor: hand;}

h1 {font-size: 140%; margin: 0px; padding: 5px 0px 5px 0px;}
h2 {font-size: 130%; margin: 0px; padding: 5px 0px 5px 0px;}
h3 {font-size: 110%; margin: 0px; padding: 5px 0px 5px 0px;}
h4 {font-size: 100%; margin: 0px; padding: 5px 0px 5px 0px;}
h5 {font-size: 100%; margin: 0px; padding: 5px 0px 5px 0px;}

hr {height: 1px; border: solid 1px black;}

.layout {border-collapse: collapse; vertical-align: top;}

.clear {clear: both; font-size: 1px; line-height: 1px; height: 1px;}
.clearLeft {clear: left; font-size: 1px; line-height: 1px; height: 1px;}
.clearRight {clear: right; font-size: 1px; line-height: 1px; height: 1px;}

.alignRight {text-align: right;}
.displayNone {display: none;}

#page {width: 990px; margin: auto; text-align: left;}


/********************* menu ************************/

.subLevelMenu {display: block;}
.displaySubMenu ul {display: block;}
.subLevelMenuHidden {display: none;}

/***************** mainContent ******************************/

#mainContent {}
#mainContent .inside {margin: 0px; padding: 0px 0px 0px 0px; text-align: left;}

#mainContent .articleTrademark {color: Gray;}
#mainContent .articleTrademark a {text-decoration: none;}
#mainContent .articleTrademark a:hover {text-decoration: underline;}

#mainContent .sectionItem {clear: both; border-bottom: solid silver 1px; margin-bottom: 10px; padding-bottom: 5px;}
#mainContent .sectionItem .articleDate {display: block;}
#mainContent .sectionItem .articlePerex {font-style: normal; padding-bottom: 0px;}
#mainContent .sectionItem .articlePerex p {margin: 0px;}

#mainContent h3 {clear: both; color: rgb(19,105,156); margin-bottom: 5px;}
#mainContent h4 {clear: both; margin-bottom: 5px;}
#mainContent p {margin-top: 0px;}

#footer {text-align: left; padding: 0px 0px 25px 0px; margin: 0px auto 0px auto;}
#footer a {text-decoration: none; font-weight: normal;}
#footer .debug {display: block;}

#copyright {float: right; margin: 5px 10px 0px 0px; font-size: 90%;}
#copyright .developer {text-decoration: none;}
#copyright .developer:hover {text-decoration: underline;}


/********* form **********/

.label {display: block; padding-top: 5px; font-size: 85%; color: Gray;}
.numericTextBox {text-align: right;}


/********* homepage **********/

#divAdvertPopUp {display: none;}
#divAdvertPopUp .buttons {text-align: center;}
#divAdvertPopUp .buttons a {display: block; width: 150px; margin: auto; padding: 2px 10px 2px 10px; text-decoration: none; background-color: rgb(204,204,204); border-top: solid 2px rgb(227,227,227); border-left: solid 2px rgb(224,224,224); border-right: solid 2px rgb(185,185,185); border-bottom: solid 2px rgb(182,182,182); padding: 3px;}

/********** section **********/

#section .sectionPerex {}
#section .sectionPerex .perexImage {float: right; margin-left: 10px;}

#section .filter {clear: both; margin: 0px 0px 0px 0px; padding: 5px 10px 10px 10px;}
#section .filter a {}
#section .filter a.active {font-weight: bold;}
#section .filter .label {}
#section .filter .button {display: inline;}

#section .grdMultimedia .pictureItem .perexImage {float: none;}
 
#section .grdSections {border-bottom: solid 1px silver; margin-bottom: 20px;}
#section .grdSections .sectionItem {border: none;}
#section .grdSections td, .grdArticlesTiles td, .grdMultimedia td {vertical-align: top;	width: 160px; padding-right: 32px;}
#section .grdSections .sectionItem, #section .grdArticlesTiles .articleItem, #section .grdMultimedia .pictureItem {text-align: center; border: none;}
#section .grdSections .sectionItem .perexImage {float: none; display: block; width: 160px; height: 120px; padding: 0px; margin: auto; text-align: center; border: solid 1px silver;}
#section .grdSections .sectionItem .title, #section .grdArticlesTiles .articleItem .title, #section .grdMultimedia .pictureItem .title {display: block;	font-weight: bold; margin-top: 5px;}
#section .grdSections .sectionItem a {text-decoration: none; color: Black;}
#section .grdSections .sectionItem a:hover {color: rgb(183,0,12);}

#section .grdArticles .articleItem {padding: 10px 0px 10px 0px; border-bottom: silver 1px solid; width: 266px; float: left; }
#section .grdArticles .articleItem .articleBlock.shop {margin: 0px 160px 0px 180px;}
#section .grdArticles .articleItem .articleBlock {margin: 0px 0px 0px 180px;}
#section .grdArticles .articleItem .articleTitle {margin: 0px; padding: 0px;}
#section .grdArticles .articleItem .articleTitle a {font-weight: bold;}
#section .grdArticles .articleItem .articleTitle a:hover {}
#section .grdArticles .articleItem .articleDate {color: gray; font-size: 90%;}
#section .grdArticles .articleItem .articleTrademark {color: Black;}
#section .grdArticles .articleItem .articleTrademark a {color: Black;}
#section .grdArticles .articleItem .articlePerex {text-align: justify;}
#section .grdArticles .articleItem .articlePerex p {margin: 0px; padding: 0px;}
#section .grdArticles .articleItem .articlePerex .more {display: block;}
#section .grdArticles .articleItem .perexImage {float: left; margin-left: 5px; margin-bottom: 10px;}
#section .grdArticles .articleItem .shopBlock {float: right; margin-top: 5px; min-width: 150px;}
#section .grdArticles .articleItem .shopBlock .articleBasket {margin-top: 10px;}
#section .grdArticles .articleItem .shopBlock .articleBasket .basketAmount {display: none; float: left; text-align: right; margin-top: 3px;}
#section .grdArticles .articleItem .shopBlock .articleBasket .button {float: left;}
#section .grdArticles .articleItem .shopBlock .priceShop {font-weight: normal; font-size: 110%; color: rgb(181,0,12);}
#section .grdArticles .articleItem .shopBlock .priceShop .value {font-size: 120%; font-weight: bold;}
#section .grdArticles .articleItem .shopBlock .priceShop .priceUsual {display: block; font-weight: normal;	color: black; font-size: 90%;}
#section .grdArticles .articleItem .shopBlock .priceShop .priceUsual .value {font-size: 100%; font-weight: normal;}

#section .grdArticles.tiles {border-collapse: collapse;}
#section .grdArticles.tiles tr.top td {}
#section .grdArticles.tiles tr.bottom td {}
#section .grdArticles.tiles td {padding: 0px 32px 5px 0px; vertical-align: top; position: relative; border: none; width: 160px;}
#section .grdArticles.tiles td.left {}
#section .grdArticles.tiles td.right {}
#section .grdArticles.tiles .articleItem.title {border-bottom: none; padding-bottom: 0px; font-size: 90%;}
#section .grdArticles.tiles .articleItem.image {vertical-align: middle; padding-top: 10px;}
#section .grdArticles.tiles .articleItem .perexImage {float: none; width: 160px; height: 120px; padding: 0px; margin: 0px; text-align: center; border: solid 1px silver;}
#section .grdArticles.tiles .articleItem .perexImage.noBorder {border: none;}
#section .grdArticles.tiles .articleItem.price {border-top: none; padding-top: 0px;}
#section .grdArticles.tiles .articleItem .shopBlock {float: none; margin-top: 5px; min-width: auto;}
#section .grdArticles.tiles .articleItem .articlePerex {font-size: 90%;}

#section .highlight {font-weight: bold; background-color: Yellow;}


/********* article **********/

#articleDetail .navigationPrevNext {float: right;}
#articleDetail .navigationPrevNext a {padding-left: 5px; margin-left: 5px;}

#articleDetail .articleTitle {margin: 0px 0px 2px 0px; font-size: 150%; font-weight: normal;}
#articleDetail .articleSubtitle {display: block; margin: 0px 0px 5px 0px; font-size: 100%;}
#articleDetail .articlePerex {}
#articleDetail .articlePerex .perexImage {float: right; padding-left: 10px;}
#articleDetail .articleText {line-height: 1.5em; text-align: justify;}
#articleDetail .articleDate {color: Gray; padding-bottom: 10px;}

#articleDetail .grdPrices {width: 100%; margin-bottom: 5px; margin-top: 10px; border-collapse: collapse;}
#articleDetail .grdPrices td {padding: 4px 5px 4px 5px; border-bottom: solid 1px black; vertical-align: top;}
#articleDetail .grdPrices .header th {background-color: gray; color: white; font-weight: normal; font-size: 90%; padding: 2px 5px 2px 5px;}
#articleDetail .grdPrices .addToBasket {width: 80px; padding: 4px 0px 4px 5px;}
#articleDetail .grdPrices .addToBasket .button {float: right; margin-left: 5px;}
#articleDetail .grdPrices .addToBasket .amount {float: right; width: 10px; height: 10px; margin-top: 2px; padding: 4px; color: Black; font-size: 80%; border: solid 1px gray; font-weight: bold; text-align: center;}
#articleDetail .grdPrices .addToBasket .stockInfo {}

#articleDetail .multimedia {}
#articleDetail .multimedia .multimediaList {width: 100%;}
#articleDetail .multimedia .multimediaList .item {text-align: center;}
#articleDetail .multimedia .multimediaList .item .title {display: block; font-size: 90%;}

#articleDetail .download {}
#articleDetail .download .downloadList {width: 100%;}
#articleDetail .download .downloadList td {vertical-align: top; text-align: left; padding: 5px 5px 5px 0px; border-bottom: solid 1px white;}
#articleDetail .download .downloadList .firstRow td {}
#articleDetail .download .downloadList .lastRow td {border-bottom: none;}
#articleDetail .download .downloadList td.fileType {width: 20px; padding-top: 7px;}
#articleDetail .download .downloadList td .downloadFile {display: block;}
#articleDetail .download .downloadList td .downloadFile .fileTitle {font-weight: bold;}
#articleDetail .download .downloadList td .downloadFile .fileSize {}
#articleDetail .download .downloadList td .fileDescription {}

#articleDetail .buttons .buttonLarge {float: left; margin: 20px 0px 20px 0px;}

.buttons .button {margin: 10px auto 10px auto;}

#section.buyWith h1 {font-size: 120%; color: Green;}

.divBuyWith {display: block; margin: 20px 0px 20px 0px;}
.divBuyWith .BuyWithTitle {background-color: gray; padding: 5px; font-weight: bold; color: White;}
.divBuyWith .buyWithList {border-collapse: collapse; margin: 10px;}
.divBuyWith .buyWithList .articleItem {width: 33%; padding: 0px; text-align: left; vertical-align: bottom;}
.divBuyWith .buyWithList .articleTitle {color: #000000; font-size: 110%; text-decoration: none; font-weight: normal; text-align: left; font-weight: bold; padding: 0px; margin: 0px;}
.divBuyWith .buyWithList .perexImage {padding: 5px 0px 20px 0px; text-align: left; vertical-align: top; float: none;}
.divBuyWith .buyWithList .priceUsual {display: block; color: Gray;}
.divBuyWith .buyWithList .price {color: Red;}
.divBuyWith .buyWithList .columnAddToBasket {display: none;}


#mainContent .grdGallery .sectionItem {border: none;}
#mainContent .grdGallery td {text-align: center; width: 25%; vertical-align: top;}
#mainContent .grdGallery .sectionItem .title {display: block;}


/********* shop basket bar **********/

.basketBar {width: 100%;}
.basketBar td {width: 20%;}
.basketBar .box {font-weight: normal; background-color: silver;	color: black;}
.basketBar .number {background-color: gray;	color: White; padding: 5px;	margin-right: 5px; font-weight: normal;}
.basketBar .selected {background-color: #AA1515; color: White; padding: 5px; font-weight: bold;}

.showBasket {width: 100%; border-collapse: collapse; border-bottom: black 1px solid;}
.showBasket td {border-bottom: silver 1px solid; padding: 3px 3px 3px 3px;}
.showBasket .tableheader {background-color: gray; color: White; font-weight: bold;}
.showBasket .articleTitle {font-weight: bold;}
.showBasket .articlePriceDescription {text-decoration: none; color: Black;}
.showBasket .txbAmount {text-align: right;}

.sumBasket {text-align: right;}

.hrefGoBack {display: block; text-align: left; margin-top: 30px; margin-bottom: 30px;}
.hrefGoBack a {}

#frmCustomer .label {display: block;}
#frmCustomer .text, #frmCustomer .textArea {width: 545px;}

.orderFormSectionTitle {
	display: block;
	width: 545px;
	font-weight: bold;
	background-color: silver;
	color: black;
	padding: 2px 0px 2px 5px;
	margin-top: 20px;
}

.requeredField {
	font-size: 90%;
	color: #AA0000;
}


/********* discussion **********/

.divArticleDiscussion {margin-top: 20px;}

.articleDiscussionIntro {
	margin-top: 5px;
}

.grdArticleDiscussion, #forumNewMessageBox {
	background-color: #DDDDDD;
	width: 100%;
}

.grdDiscussion td {
	border-bottom: solid 1px silver;
}

.grdArticleDiscussion .articlesListAlternating {
	background-color: #EEEEEE;
}

.grdArticleDiscussion .forumDate, .grdDiscussion .forumDate {
	white-space: nowrap;
	width: 100px;
}

.grdArticleDiscussion .forumSubject, .grdDiscussion .forumSubject {
	font-weight: bold;
}

.articleDiscussionTitle {
	background-color: gray;
	padding: 2px 0px 4px 4px;
	font-weight: bold;
	color: White;
}

.divArticleDiscussion .divButtons .buttonLarge {
	float: right; margin-right: 7px;
}

.hrefWholeArticle {
	padding: 4px;
	display: block;
	font-weight: bold;
	float: right;
	margin-left: 2px;
	margin-top: 2px;
	color: black;
	background-color: silver;
	text-decoration: none;
	width: 150px;
	text-align: center;
	border-bottom: 1px solid #888888;
	border-right: 1px solid #888888;
	border-top: 1px solid #DDDDDD;
	border-left: 1px solid #DDDDDD;
}

.hrefWholeArticle:hover {
  color: white;
}

#divArticleDiscussionBox {
    height: 150px;
    width: 99%;
    overflow: hidden;
}

#divButtonWholeArticle
{
	margin-top: 10px;
	border-bottom: dotted 2px silver;
}

.hrefWholeArticle {
	margin-top: 0px;
	font-weight: normal;
}

#forumNewMessageBox {
	margin-top: 25px;
	clear: both;
}

#forumNewMessageBox .newMessageForm {
	padding: 10px;
}

#forumNewMessageBox .newMessageForm .inputItem {
	width: 100%;
}

#forumNewMessageBox .newMessageForm table .inputItem {
	width: auto;
}

#archivSurveys .survey {
	width: 160px;
}

#archivSurveys table td {
	width: 33%;
	border: silver 1px solid;
	vertical-align: top;
	padding: 3px;
	background-color: rgb(225,225,225);
}

#archivSurveys .survey td{
	border: none;
	width: auto;
}

.navigation {margin: 10px; text-align: right; font-weight: bold;}
.navigation a {text-decoration: none; color: Black; text-transform: lowercase;}
.navigation .first {border-left:  solid 3px black; padding-left: 5px; margin-left: 5px;}
.navigation .last {border-left:  solid 3px black; padding-left: 5px; margin-left: 5px;}
.navigation .next {border-left:  solid 3px black; padding-left: 5px; margin-left: 5px;}
.navigation .prev {border-left:  solid 3px black; padding-left: 5px; margin-left: 5px;}
.navigation .navigationDisabled {color: Gray;}
.navigation .navigationEnabled {color: black;}
.navigation .navigationPageNumber {padding-left: 3px; padding-right: 3px; }
.navigation .navigationSelectedPage { border: solid 1px black; padding-left: 2px; padding-right: 2px; }

/******************* diskusni forum ******************/

.topicTitle {
	font-size: 100%;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

#discussionNavigationTop {
	background-color: Silver;
	padding: 10px;
}

.grdForumArticles 
{
	clear: both;
}

.panelUser 
{
	font-size: 100%;
	float: left;
}

.panelMessage
{
	float: left;
	width: 100%;
}

.editSubject 
{
	width: 98%;
}

.editText 
{
	width: 98%;
	height: 200px;
}

.editUserName
{
	width: 45%;
}

.editUserEmail
{
	width: 45%;
}

.messageDate 
{
	font-size: 80%;
}

.messageReply .buttonLarge
{
	float: right;
}

.messageItem
{
	border-style: solid;
	border-width: 0px;
	border-color: Black;
	margin-top: 5px;
	margin-bottom: 5px;
}

.messageItemNew
{
	border-style: solid;
	border-width: 2px;
	border-color: #AA0000;
	margin-top: 5px;
	margin-bottom: 5px;
}

.messageSubject 
{
	font-size: 120%;
	font-weight: bold;
}

.messageItemUserBox 
{
	background-color: #DDDDDD;
	padding: 5px;
}

.messageItemMessageBox 
{
	border-style: solid;
	border-width: 1px;
	border-color: #DDDDDD;
	padding: 5px;
}

#newRecord {
	margin-top: 15px;
	background-color: #AAAAAA;
	height: 280px;
}

#newRecordMessageBox
{
	padding: 5px;
	border-style: solid;
	border-width: 1px;
	border-color: #DDDDDD;
	background-color: #DDDDDD;
	height: 280px;
}

#newRecordMessageBox div
{
	padding-top: 5px;
}

#newRecordUserBox 
{
	width: 90px;
	float: left;
	padding: 5px;
}

.outOfStock {
  color: #AA0000;
}

.alert 
{
	display: block;
	text-align: center;
	margin: 20px;
	font-weight: bold;	
}


/**************** drobeckova napoveda ****************/

#mainContent .breadcrumbNavigation {
    display: block;
    list-style-type: none;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px; 
}

#mainContent .breadcrumbNavigation li {
    float: left;
    padding: 0px 0px 10px 0px;
}



/*****************************************************/
/*********************  basket   *********************/
/*****************************************************/

#basketLink {position: absolute; top: 6px; left: 837px;}
#basketLink a {color: Black;}
#basketLink a:hover {color: rgb(199,16,6);}

#orderForm {width: 100%;}
#orderForm .articleTitle {font-size: 100%;}
#orderForm .basketList {width: 99%; border-collapse: collapse;}
#orderForm .basketList td {padding: 2px 4px 2px 4px;}
#orderForm .basketList .header {background-color: #EEEEEE; color: #666666;}
#orderForm .basketList .header th {padding: 2px 4px 2px 4px; text-align: center;}
#orderForm .basketTotalSum {width: 99%; border-collapse: collapse; background-color: transparent;}
#orderForm .basketTotalSum td {text-align: right; font-weight: bold; padding: 2px 4px 2px 4px;}
#orderForm .basketBonus {width: 99%; border-collapse: collapse; background-color: transparent;}
#orderForm .basketBonus td {text-align: left; padding: 2px 4px 2px 4px;}
#orderForm .bonusRed {background-color: rgb(184, 0, 12); color: White;}
#orderForm .bonusRed a {color: #0000FF;}
#orderForm .basketButtons {padding: 20px 0px 20px 0px; text-align: center;}
#orderForm .basketButtons .back {background-color: rgb(0,100,0); color: White; width: 150px;}
#orderForm .basketButtons .pay {font-weight: bold; background-color: rgb(184, 0, 12); color: White; width: 150px;}
#orderForm .paying .basketList .selected, #orderForm .shipping .basketList .selected  {font-weight: bold;}
#orderForm .paying .basketList .header, #orderForm .shipping .basketList .header  {background-color: #EEEEEE; color: black;}
#orderForm .paying .basketList .header td, #orderForm .shipping .basketList .header td {border-bottom: solid 1px gray;}
#orderForm .paying .basketList .sum td, #orderForm .shipping .basketList .sum td {border-top: solid 1px silver;}
#orderForm .paying .basketList .description, #orderForm .shipping .basketList .description {margin-left: 20px; padding-top: 2px; font-size: 80%; display: block;}

#basketNavigation {padding: 20px 0px 40px 0px;}
#basketNavigation .step {float: left; width: 32%; background-color: Silver; margin-right: 12px;}
#basketNavigation .step .number {float: left; background-color: gray; padding: 5px 7px 5px 7px; color: white; border-right: solid 2px white;}
#basketNavigation .step .text {float: left; padding: 5px;}
#basketNavigation .step.selected {background-color: #AA0000; color: White;}
#basketNavigation .step.last { width: 33%; margin-right: 0px;}

#orderForm .termsOfTrade {margin: 20px 0px 20px 0px;}
#orderForm .buttons {margin: 30px 0px 0px 0px; padding: 5px; border-top: silver 1px solid; border-bottom: silver 1px solid; text-align: center; background-color: #DDDEDA;}
#orderForm .buttons .basketButton {width: 180px; text-align: center;}
#orderForm .buttons .back {background-color:  rgb(128,128,128); color: White; font-weight: normal;}
#orderForm .buttons .continue {background-color: rgb(184, 0, 12); color: White; font-weight: bold;}
#orderForm .rbAccount {cursor: pointer;}
#orderForm .rbAccountSelected {font-weight: bold;}
#orderForm .description {margin-left: 20px; padding-top: 2px; font-size: 80%; display: block;}
#orderForm .loginBox .inputItem {width: 125px;}
#orderForm .loginBox .button {font-size: 90%; margin-right: 10px;}
#orderForm fieldset {width: 525px; padding-top: 10px; margin: auto;}
#orderForm fieldset .inside {padding: 0px 10px 10px 10px;}
#orderForm .formContent {margin-left: 20px;}
#orderForm .formLogin {margin-left: 20px;}
#orderForm .formLogin fieldset {width: 300px;}

#customerAccountLogin, #customerAccountNew {margin: 10px 0px 20px 0px;}
#customerAccountLogin .lostPassword {float: right;}
#customerAccountLogin .basketButton {width: 130px; cursor: pointer; text-align: center; background-color: rgb(184, 0, 12); color: White; padding: 2px 10px 2px 10px; margin: 3px 7px;}

.orderHeaderError {color: Red;}

.loginBox {}
.loginBox a {}
.loginBox table {border-collapse: collapse;}
.loginBox .title {font-weight: bold;}
.loginBox .inside {padding: 0px;}
.loginBox .lostPassword {display: block; padding-top: 5px; font-size: 90%;}
.loginBox .errorMessage {font-size: 80%;}
.loginBox .validator {display: none;}


/* ************** customDropDownList *************** */

/* Drop down styles*/
div.selectbox-wrapper {position: absolute; width: 400px; background-color: white; border: 1px solid silver; margin: 0px; margin-top: -2px; padding: 2px; text-align: left; max-height: 200px; overflow: auto;}

/*Drop down list styles*/
div.selectbox-wrapper ul {list-style-type: none; margin: 0px; padding: 0px;}
 
/* Selected item in dropdown list*/
div.selectbox-wrapper ul li.selected {background-color: silver;}

/* Hover state for dropdown list */
div.selectbox-wrapper ul li.current {background-color: black; color: White;}

/* Drop down list items style*/
div.selectbox-wrapper ul li {display: block; list-style-type: none; margin: 0; padding: 2px; cursor: pointer;}

/* Look and feel of select box */
.selectbox {display: block; width: 190px; margin: 0px; padding: 2px; text-align: left; background-image: url('/images/selectbox-up.png'); background-repeat: no-repeat; background-position: 100% 0%; cursor: pointer; border: 1px solid silver; color: black;}
.selectbox.dropDown {background-image: url('/images/selectbox-down.png');}