/* 
    Document   : formattings
    Created on : 2012-04-18, 17:34:38
    Author     : tech-prog
    Description:
        Formatting functions
*/

/* Required by javascript to hide & show something */
a { text-decoration: none }
.hidden { display: none }
.jsVisible { display: none }

/* Tables */
table.list { width: 100% }

table.value.list.registration {width: 490px;}
table.value.list thead td { border: 0; height: 25px; background: #777; color: #fff; padding: 4px 0 4px 0; text-align: center; }
table.value.list thead td.first { border-right: 1px solid #777; border-top-left-radius: 8px;  }
table.value.list thead td.last { border-left: 1px solid #777; border-top-right-radius: 8px;  }
table.value.list { border-spacing: 0; border-collapse: separate; font: 13px tahoma; color: #282828; width: 515px; padding: 0; margin: 10px 0 0 6px; }
table.value.list tbody td { border-bottom: 1px solid #777;; border-top:0; border-left: 1px solid #777; border-right: 1px solid #777; }
table.value.list.next { background: #ececec; }
table.value.list td.name { border-right: 1px solid #777; width: 143px; padding: 8px 6px 0 6px }
table.value.list td.value { border-left: 0; width: 348px; padding: 0px 6px 0 6px }
table.value.list td.noBLeft { border-left: 0; }
table.value.list label { width: auto }
table.value.list input, table.value.list select { min-width:140px; width: 98%; border: 0; background: none; }
table.value.list input[type=checkbox] { min-width: 40px; width: 40px; }
table.value.list .short { min-width: 100px; width: 100px; margin: 0 0 0 8px; background: #eee;  }

/* Sizes */
input.long { width: 90% }
div.long { width: 100% }

td.imgWidth { width: 60px }
td.imgWidth img.box { position: absolute; margin: 21px 0 0 -20px; width: 25px; height: 25px; border: 0 }
td.shortWidth { width: 40px }
td.quantWidth { width: 120px }
td.priceWidth { width: 75px }

td.quant { width: 70px }
td.cod { width: 110px; background: #eee; padding: 4px 4px 4px 8px }
td.cod input { width: 70px }
td.tabPrice { width: 70px }
td.package { width: 120px }

td.quant { text-align: center; }
td.quant div.const { float: right; width: 34px; }

p.small { font-size: 9px; color: #aaa; }

.iRow { clear: left; padding-top: 16px; width: 100%; min-height: 24px; height: 100%; overflow: auto; margin: 0 0 0 0  }
.iRowButtons { vertical-align: bottom; clear: both; overflow: auto; margin: 14px 0 0 0; border-radius: 4px; -moz-border-radius: 4px;	-webkit-border-radius: 4px;  }
.iRowButtons div { float: left; }
.iRowOne { clear: left; padding-top: 16px; width: 100%; min-height: 1px; height: 100%; overflow: auto; margin: 0 0 0 0  }
.iRowInputs { clear: left; width: 100%; min-height: 24px; height: 100%; overflow: auto; margin: 0 0 0 0  }

/* Grouping elements */
.iItem { height: auto; width: 194px; clear: left }
.iItem input { width: 190px; }
.halfPlace .iItem { padding-top: 16px; height: auto; width: 230px; clear: left }
.halfPlace .iItem input[type=text] { width: 220px; }
.halfPlace p { padding-left: 8px; }
.halfPlace h3 { margin-left: 8px !important; }

.iItemLeft { width: 194px; float: left;  }
.iItemLeft input[type=text], .iItemLeft input[type=password] { width: 182px; }
.iItemShort { width: 42px; float: left; }
.iItemShort input { width: 40px; }
.iItemMid { width: 300px; float: left; }
.iItemMid input { width: 280px; }
.iItemMidShort { width: 72px; float: left; }
.iItemMidShort input { width: 64px; }
.iItemMid1 { width: 122px; float: left; }
.iItemMid1 input { width: 114px; }


.halfPlace { width: 50%; float: left; overflow: auto; }
.halfPlace h2 { background: url('images/separator.gif') repeat-x bottom center; }
.halfPlace.border { background: url('images/footer_sep.gif') repeat-y right top;  }
.halfPlace label { width: 100%; clear: both;  }

ul { list-style-type: none }

/* Separated */
.separate { padding-bottom: 12px; background: url('images/separator.gif') repeat-x bottom center; }
.borderTop { padding-top: 8px; background: url('images/separator.gif') repeat-x left 8px; }
.borderBottom { padding-bottom: 8px; background: url('images/separator.gif') repeat-x left bottom; }

/* HTML Input elements */
.art-content form { width:100% }
form { margin: 0 0 0 0; overflow: hidden; }
input { width: 140px; }
input[type="checkbox"] { margin: 3px 3px 3px 0; width: 24px; }
input[type=text], input[type=password] { height: 21px; padding: 0; line-height: 21px; background: #f8f8f8; border: 1px #aaa solid; }
input[type=radio] { width: 30px; }
input[type=button], input[type=submit] { cursor: pointer; font: bold 12px arial; color: #fff; border: 0; width: 82px; height: 27px; background: url('objects/cms/button_small.png') left top no-repeat; }
input[type=button]:hover, input[type=submit]:hover { background-position: left bottom; }
input[type=button]:active, input[type=submit]:active { background-position: left bottom;}

/* Big shop button */
.addToCart { color: transparent }
.addToCarton { color: transparent }

input[type=submit].addToCartMini { margin-top: 5px; text-align: right; background: url('images/add-to-cart-mini.gif') no-repeat top left; padding: 1px 43px 0 0; width: 103px; height: 28px; font-size: 13px; font-weight: normal; color: #fff; }
input[type=submit].addToCartMini:hover { background-position: right bottom; }
input[type=submit].addToCartIcon { background: url('objects/cms/cart/icon-add-cart.png') no-repeat left top; padding: 0; width: 42px; height: 36px;}
input[type=submit].addToCartIcon:hover { background-position: left center; }
input[type=submit].addToCartIcon:active { background-position: left bottom; }
.news input[type=submit].addToCartIcon { margin-top: 5px; background: url('objects/cms/cart/icon-add-cart.png') no-repeat right top; padding: 1px 43px 0 0; text-align: right; width: 120px; height: 35px; font-size: 13px; font-weight: bold; color: #eb5908; }
input[type=submit].bigShop { background: transparent url('objects/cms/button-rollover-big.png') top left; font-size: 16px; width: 178px; height: 48px; border: 0px }
input[type=submit].bigShop:hover { background: transparent url('objects/cms/button-rollover-big.png') bottom left; font-size: 16px; width: 178px; height: 48px; border: 0px }

input[type=submit].addProdIcon { font-size: 12px; padding: 2px 0 0 26px; width: 93px; height: 34px; background: url('objects/cms/button-table-add-cart-rolover.png') left top no-repeat; }
div.addProdIcon { font-size: 12px; color: #af9; padding: 10px 0 0 26px !important; width: 67px; height: 24px; background: url('objects/cms/button-table-add-cart-rolover.png') left top no-repeat; cursor: default; text-decoration: line-through;  }
input[type=submit].addProdIcon:hover { background-position: left bottom; }
input[type=submit].addProdIcon:active { background-position: left bottom; }

input[type=button].previewProdIcon { font-size: 12px; padding: 2px 0 0 26px; width: 93px; height: 34px; background: url('objects/cms/button-table-preview-rolover.png') left top no-repeat; }
input[type=button].previewProdIcon:hover, .prodLongBox input[type=button].previewProdIcon:hover, .prodLongBox input[type=submit].addProdIcon:hover { background-position: left bottom; }


.prodLongBox div.addProdIcon { margin-left: 3px; background: url('objects/cms/button-list-add-cart-rolover.png') no-repeat left top;  }
.prodLongBox input[type=submit].addProdIcon { margin-left: 3px; font-size: 12px; padding: 2px 0 0 26px; width: 93px; height: 34px; background: url('objects/cms/button-list-add-cart-rolover.png') no-repeat left top; }
.prodLongBox input[type=button].previewProdIcon { margin-left: 6px; font-size: 12px; padding: 2px 0 0 26px; width: 93px; height: 34px; background: url('objects/cms/button-list-preview-rolover.png') no-repeat left top; }

textarea { width: 90%; height: 80px; background: #f8f8f8; border-left: 1px #dbdedf solid; border-top: 1px #dbdedf solid; border-bottom: 1px #ececec solid; border-right: 1px #ececec solid; border-radius: 3px; -moz-border-radius: 3px;	-webkit-border-radius: 3px; }

/* Buttons */
div.button { float: left; margin-right : 4px; margin-left: 4px; }
div.button { float: left; text-align: center; cursor: pointer; border: 0; width: 82px; height: 26px; background: url('objects/cms/button_small.png') left top no-repeat; }
div.button a { text-decoration: none; line-height: 23px; font: bold 12px arial; color: #fff; position: relative; top: 3px; }
div.button:hover a { top: 5px; left: 2px; }
div.button:hover { background: url('objects/cms/button_small.png') left bottom no-repeat; }

div.midButton, input.midButton { float: left; text-align: center; cursor: pointer; border: 0; width: 122px; height: 26px; background: transparent url('objects/cms/button-bg-rollover-wide.png') left top no-repeat; }
div.midButton.bottom, input.midButton.bottom, div.button.bottom { margin-top: 26px; }
div.midButton a { text-decoration: none; line-height: 22px; color: #fff;  }
div.midButton:hover, input.midButton:hover { width: 122px; background: url('objects/cms/button-bg-rollover-wide.png') left bottom no-repeat; }

input.small { width: 73px; background-image: url('objects/cms/button_small.png'); }
input.medium { width: 120px; background-image: url('objects/cms/button_medium.gif'); }

/* Margins */
.nopadd { padding: 0 0 0 0!important; }
.sepBigTop { margin-top: 64px; }
.sepTop { margin: 16px 0 16px 0; }
.sepTopLog { margin: 20px 0 16px 0; }
div.padd { padding: 0 0 0 48px;  }

/* Hints */
.hint { float: left; display: block; position: relative; padding: 2px 2px 2px 2px; width: 16px; height: 16px; }
.hint img { }
.hint span { width: 270px; display: none; position: absolute; z-index: 1;  }
.hint:hover {  }
.hint:hover span{ position: absolute; color: #444; display: block; background: #ffffaa; padding: 6px 6px 6px 6px; border: 1px solid #777; height: auto; }


/* Images */
.image { padding: 0; margin: 0; }
img { border: none; }
img.mini { border: 1px solid #ddd; }
img.noResize { width: auto !important; height: auto!important; }

/* Align */
.clear { clear: both }
.clearLeft { clear: left; }
.left { float: left }
.center { vertical-align: middle; text-align: center; margin: 0 auto; }
div.right, input.right, img.right { float: right }
td.right { padding-right: 12px; vertical-align: middle; text-align: right; }
td.right input {text-align: right;}

td.category_img { width: 25%; background: transparent url('images/icon-folder-orange.png') left center no-repeat;  }
td.category_img a {display: inline-block; padding: 10px 0 10px 50px; line-height: 17px;}
td.category_img a:hover {text-decoration: none;}