/* DEFAULTS */

body {
  margin: 0;
  padding: 0;
  font-size: 12px;
  text-align: left;
  background-color: #721D05;
  background-image: url(/images/body_tausta.png);
  background-repeat: repeat-x;
  font-family: "trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}
a,a:link,a:hover,a:active,a:visited {color:#000000;text-size:12px;text-decoration:none;}
a:hover {color:#FFC32A;}
table, td, form , div, span { margin: 0; padding: 0; }
table { border-collapse: collapse; }
img {border:none; vertical-align:middle;}
h1, h2, h3, h4, h5, h6 {margin:0; padding:0;}
textarea, input[type="text"], input[type="checkbox"], input[type="password"] { 
  background-color:#FFFFFF; border: 1px solid #999999;
}
input[type="text"]:focus, input[type="password"]:focus { background-color: #FFFFC0; }
input[type="checkbox"], input[type="radio"] { vertical-align: middle; }
textarea, input, select { font-size: 11px; padding: 0; margin: 0; }
.rounded-border{overflow:hidden; border:2px solid #a58d28; border-radius:10px; -moz-border-radius:10px}
.rounded-content{border-radius:7px; -moz-border-radius:7px} /*piilottaa kulmat muissakin kuin Firefoxissa */
.rounded-content-top{border-radius:7px 7px 0 0; -moz-border-radius:7px 7px 0 0}
.rounded-content-bottom{border-radius:0 0 7px 7px; -moz-border-radius:0 0 7px 7px}

/* BASIC LAYOUT */

#header {
  position:relative;
  z-index:5;
  margin:0 0 20px 0;
  padding:15px 0 0 0;
  background-color:rgb(143,157,120);
  border-bottom:2px solid rgb(117,128,99);
}
#header-item-wrapper, #banner-wrapper, #wrapper { 
  width: 980px;
  margin: 0 auto;
  position: relative;
  z-index:1;
}

#footer {
  padding: 30px 10px 10px 10px;
  text-align: center;
  font-size: 12px;
}
#footer p {text-align:center; margin:0;}
#footer a {text-decoration:underline}

.header-item {
  float:left;
  height:80px;
  padding: 0 30px;
  font-size:11px;
  letter-spacing:1px;
  border-right:1px solid rgb(117,128,99);
}
.header-item h2 {
  font-size:12px;
  margin-bottom:5px;
  letter-spacing:3px;
  text-shadow: 1px 1px #555;
}
.header-item, .header-item h2, .header-item a {color:white}

#frontpage-link {border-left:1px solid rgb(117,128,99);}
#frontpage-link h2 {padding-bottom:50px;} /* tekee klikattavasta alueesta suuremman */

#search table td {
  text-align: left;
  padding: 0;
}
#search input.ProductSearchParameter {
  border: 2px solid rgb(55,60,47);
  margin-right:5px;
}

#cart {background: url(/images/cart_bg.png) repeat-x bottom;}
#cart-content {display:inline-block;}
#cart .cart-row {margin-bottom:5px; border-bottom:2px dotted rgb(143,157,120)}
#cart .cart-value{float:right; margin-left:20px;}
#cart-actions {display:inline-block; padding-left:20px; text-align:center;}
#cart-actions a {display:block; margin-bottom:5px;}

#header-links {float:right; text-align:right;}
#header-links div, #header-links form {
  display:inline-block; 
  padding-left:35px;
  vertical-align:top;
}
#header-links a {display:block; margin-bottom:10px}
#header-links a#login-link, #header-links input {margin-bottom:7px;}


#banner-wrapper { height:180px; }
img#logo {position:absolute; top:0; left:-80px}
#logo-link-tehtaanmyymala{
  background:url('/images/logo_tehtaanmyymala.png') no-repeat; display:block; width:250px; height:90px; margin-left:-80px
}
#logo-link-akuntehdas{
  background:url('/images/logo_akuntehdas_valkoinen.png') no-repeat; display:block; width:110px; height:70px; margin:-15px 0 0 35px
}
img#nuotti {position:absolute; bottom:-44px; right:-115px}
div#banner {position:absolute; top:0; right:0}
div#banner div.slides_container {height:166px; width:804px}
div#banner div.slides_container img {
  border-radius:7px; -moz-border-radius:7px; /*piilottaa kulmat muissakin kuin Firefoxissa */
}
div#banner div.slides_container a {display:block; margin-bottom:200px} /* piilota muut paitsi ensimmäinen */

div.block-top-brown, div.block-top-green,
div.block-bottom-brown, div.block-bottom-green, div.block-bottom-light {height:8px; width:168px}
div.block-top-brown {background-image: url(/images/block_top_brown.gif)}
div.block-top-green {background-image: url(/images/block_top_green.gif)}
div.block-bottom-brown {background-image: url(/images/block_bottom_brown.gif)}
div.block-bottom-green {background-image: url(/images/block_bottom_green.gif)}
div.block-bottom-light {background-image: url(/images/block_bottom_light.gif)}


div#wrapper div#left-sidebar {float:left; width:168px}
div#wrapper div#right-sidebar {float:right; width:168px}

div#main-wrapper { margin: 0 174px; }
table#main-borders { width: 100%; }

div#wrapper table#main-borders td#main-top-left { 
  background-image:url(/images/main_corner_top_left.gif);
  height:8px;
  width:8px;
}
div#wrapper table#main-borders td#main-top { 
  background-image:url(/images/main_border_top.gif); 
  background-repeat:repeat-x;
}
div#wrapper table#main-borders td#main-top-right { background-image: url(/images/main_corner_top_right.gif);
}
div#wrapper table#main-borders td#main-left { 
  background-image: url(/images/main_border_left.gif); 
  background-repeat: repeat-y; 
  width: 8px;
}
div#wrapper table#main-borders td#main { background-color: rgb(255,255,230); }
div#wrapper table#main-borders td#main:hover { color: black; }
div#wrapper table#main-borders td#main-right { 
  background-image: url(/images/main_border_right.gif); 
  background-repeat: repeat-y; 
  width: 8px;
}
div#wrapper table#main-borders td#main-bottom-left { background-image: url(/images/main_corner_bottom_left.gif);
}
div#wrapper table#main-borders td#main-bottom { 
  background-image: url(/images/main_border_bottom.gif); 
  background-repeat: repeat-x; 
}
div#wrapper table#main-borders td#main-bottom-right { 
  background-image: url(/images/main_corner_bottom_right.gif);
  height: 8px;
  width: 8px;
}




#registration-form { padding: 10px; }
#registration-form td td { 
  padding: 10px 10px 3px 0;
  border-bottom: 1px solid #EFEFEF;
}
#registration-form table { margin-bottom: 10px; } 

#password-recovery span { margin-right: 10px; }
#password-recovery input { vertical-align: middle; }


.price {
  font-size: 13px;
  font-weight: bold;
  color: rgb(153,66,28);
}
.required, .red { color: red; }
.success, .failure {
  background-color: #FFFFC0;
  border: 1px solid green;
  padding: 2px 5px;
  margin: 0 5px;  
}
.failure { border-color: red; }
.left {text-align:left}
.right {text-align:right}



/** SIDEBAR STUFF **/

div#product-categories ul {
  background-color: rgb(255,250,208);
  list-style-type: none;
  padding: 0;
  margin: 0;
}
div#product-categories li {
  margin-top: 5px;
  background-color: rgb(153,66,28);
}
div#product-categories li:first-child{margin-top:0}
div#product-categories li ul {border: none}
div#product-categories li li {
  margin-bottom: 0;
  background-color: rgb(255,250,208);
}
div#product-categories a, 
div#product-categories a:link, 
div#product-categories a:visited { 
  display: block;
  font-size: 12px;
  padding: 3px 15px;
  text-decoration: none;
  color: rgb(255,195,42);
}
div#product-categories a:hover { color: #000000; }

div#product-categories li ul a,
div#product-categories li ul a:link,
div#product-categories li ul a:visited { color: #000000; }
div#product-categories li ul a:hover { color: rgb(255,195,42); }


#product-categories, #viikkotarjous, #fb-like, #lipputoimisto, #right-sidebar .campaign { margin-bottom: 10px; }
div#payment-methods { margin: 10px 0; }
div#left-sidebar h2,
div#right-sidebar h2 {
  background-color: rgb(143,157,120);
  letter-spacing: 1.5pt;
  padding-bottom: 5px;
  text-align: center;
  margin: 0 0 5px 0;
  font-size: 12px;
  color: #FFFFFF;
}

div#left-sidebar .content,
div#right-sidebar .content {
  margin: 0;
  padding-bottom: 1px;
  background-color: rgb(255,250,208);
  border-left: 2px solid rgb(165,141,40);
  border-right: 2px solid rgb(165,141,40);
}

div#viikkotarjous h2 {
  background-color: rgb(153,66,28);
  color: rgb(255,195,42);
}
div#viikkotarjous .content { text-align:center }
div#viikkotarjous .price-wrap { margin:5px 0}

div#left-sidebar div#payment-methods img {
  display: block;
  margin: 10px auto 1px auto;
  vertical-align: top;
}
div#left-sidebar div#payment-methods p { 
  font-size: 11px; 
  text-align: center;
  margin: 5px 10px; 
}

div#right-sidebar a.campaign,
div#left-sidebar a.campaign { display: block; }
.kampanjat a {display:block; margin-bottom:10px}
.kampanjat a img {border:2px solid #a58d28; border-radius:10px; -moz-border-radius:10px}

#fb-like{background-color:rgb(255,250,208)}

#lipputoimisto .rssFeed {margin:10px}
.rssHeader, .rssMedia {display:none}
.rssBody ul { list-style: none; }
.rssBody, .rssBody ul, .rssRow, .rssRow h4, .rssRow p {margin:0; padding:0;}
.rssRow {margin-bottom:10px; width:144px}
.rssRow h4 {margin-bottom:5px}

div#right-sidebar div#top10 form { padding: 0 15px; }
div#top10 ol {
  margin: 0;
  padding: 0 0 0 15px;
  list-style-type: decimal;
  list-style-position: outside;
}



/** MAIN SHOPPING CART **/

#shopping-cart, table#shopping-list, table#order-history {margin: 10px 0}
#shopping-cart table, table#shopping-list, table#order-history {width: 100%}
#shopping-cart tr {}
#shopping-cart th, table#shopping-list th, table#order-history th {
  padding: 2px 5px;
  background-color: rgb(143,157,120);
}
#shopping-cart td, table#shopping-list td, table#order-history td {
  padding: 2px 5px;
  border-bottom: 1px solid rgb(143,157,120);
}
table#shopping-list .total, table#order-history .total {
  text-align: right;
  padding-right: 20px;
}
#shopping-cart .order-cart-action {
  padding-top: 10px;
  text-align: center;
}



/** INFO, OHJE, IN ENGLISH, KIRJAUTUMINEN **/

#info-page th, #info-page td, #in-english td, #in-english th {
  padding: 3px 10px 3px 3px;
  border: 1px solid #CCCCCC;
}
#in-english th { border:none; text-align:center }
#contact-info td {border:none; vertical-align:top; padding-right:10px}

#faq dt { font-weight: bold; }
#faq dd { margin: 2px 0 5px 20px; }

#info-page h3, #faq h3, #in-english h3 {margin-top:25px;}

#login-page table {margin:20px 0;}
#login-page a {color:blue;}
#login-page td {
  padding-right:10px;
  padding-bottom:10px;
}


/** FRONTPAGE **/

#frontpage { margin:5px; width:100%; }
#frontpage td { vertical-align: top; }

#popular-and-upcoming {
  width: 200px;
  overflow: hidden;
  padding: 0 10px;
}
#popular-and-upcoming h3.title {
  margin: 0 0 5px 0;
  line-height: 2;
  font-weight: bold;
  text-align: center;
  color: rgb(146,160,124);
  border-top: 1px solid rgb(146,160,124);
  border-bottom: 1px solid rgb(146,160,124);
}

#frontpage-products {text-align:center; border-right:2px dotted #CCC;}
#frontpage-products table { width: 100%; }
#frontpage-products td { vertical-align: bottom; padding: 0 10px 15px 0; }
#frontpage-products .product-image img, #top-sellers .product-image img { border: 1px solid #CCCCCC; }
#frontpage-products input, #top-sellers input { vertical-align:middle; margin-left:5px; }

#top-sellers {text-align:center; margin-bottom:15px}
#top-sellers ol {margin:0; font-size:16px; font-weight:bold; padding:0 0 10px 30px}
#top-sellers ol a {font-size:12px; font-weight:normal}
#top-sellers li {padding:10px 0; border-bottom:1px dotted #CCCCCC}

#upcoming-products { text-align:center; line-height:2; }



/** PRODUCT LIST **/

table#product-list {
  border-collapse: separate;
  border-spacing: 10px 10px;
}

table#product-list td {
  border: 1px solid #F5F5F5;
  border-right-color: #CCCCCC;
  border-bottom-color: #CCCCCC;
  vertical-align: top;
  padding: 10px;
  width: 50%;
}

table#product-list table.product td {
  vertical-align: top;
  border: none;
  padding: 0 0 0 10px;
}
table#product-list table.product td.product-info {
  width: 80%;
}
table#product-list table.product td.product-image {
  padding: 0;
  width: 100px;
}
table#product-list table.product td.product-image img {
  border: 1px solid #CCCCCC;
}

table#product-list h3 {
  margin: 0 0 5px 0;
  font-size: 14px;
}
table#product-list p {
  margin: 0 0 5px 0;
  font-size: 12px;
}
table#product-list table.product td.product-group { 
  font-size: 11px;
  padding: 5px 0 0 0;
}
table#product-list td.product-group span { /*font-style: italic;*/ }
table#product-list table.product td.price-and-buy {
  vertical-align: bottom;
}
table#product-list span.price { float: left; }
table#product-list span.buy { float: right; }

div.pagination { 
  margin: 10px 0;
  text-align: center;
}
div.pagination span { 
  font-size: 14px;
  padding: 0 20px;
  font-weight: bold;
}

table#product-card {
  width: 100%;
  margin-top: 10px;
}
#product-card td {
  vertical-align: top;
}
#product-card td.product-image {
  width: 115px;
}
#product-card td.product-image img {
  border: 1px solid #CCCCCC;
}

#product-card td.product-title h2 {
  padding-bottom: 2px;
  margin-bottom: 2px;
  border-bottom: 2px dotted #CCCCCC;
}
#product-card #release-date { margin-bottom: 15px; }
#product-card #release-date span {
  padding: 10px;
  font-size: 13px;
  background-color: #FFFF88;
  border: 1px solid rgb(143,157,120);
}
#product-card td.price,
#product-card td.options,
#product-card td.buy { vertical-align: bottom; }
#product-card td.price {
  height: 20px;
  font-size: 13px;
  color: rgb(153,66,28);
}
#product-card td.buy { text-align: right; width:180px;}
#product-card td.buy input {
  margin-left: 10px;
  vertical-align: middle;
}
#product-card td.options select { margin-left: 5px; }
#product-card td.artist-logo { text-align:right; padding: 10px 0 0 10px; }

table#product-details th, 
table#product-details td { vertical-align: top; }
table#product-details td { padding: 0 0 5px 10px; }

#order-delivery { margin-top: 10px; }
#order-delivery td {
  text-align: left;
  padding: 2px 10px 2px 0;
}

span.old-price { text-decoration:line-through; font-size:95%; color:#aaa; }
#product-list span.old-price { display:block;}

.artist-banner { text-align:center; overflow:hidden; margin:5px 0;}


/** general image gallery **/

table.gallery {width:50%; margin:5px auto;}
table.gallery td {padding:10px; text-align:center; vertical-align:top;}
table.gallery img {display:block; margin:5px auto;}
table.gallery em {font-style:normal; font-weight:bold; font-size:110%; display:block;}
table.gallery a {display:block; text-decoration:none; color: black;}
table.gallery a img {border:none;}


/** LIGHTBOX 2.0.4, http://www.lokeshdhakar.com/projects/lightbox2/ **/

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox_prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox_nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

