/* Start of CMSMS style sheet 'Main Layout' */
* {
margin:0;
padding:0;
}
body {
   text-align: left;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 75.01%;
   line-height: 1em;
   background: url(uploads/images/ ) #161616;
}
div {
   font-size: 1em;
}
img {
   border: 0;
}
a, a:link, a:active {
   text-decoration: underline;
   background-color: inherit; 
   color: #ca0000; 
}
a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #ca0000;
}
a:hover {
   text-decoration: none;
   color: #cc6666;
}

/*****************
basic layout 
*****************/
body {
   color: #333;
}
div#contentwrapper {
   background: #fff url(uploads/images/layout/content_back_horizontal.png) repeat-x;
}
div#pagewrapper {
   background: url(uploads/images/layout/content_back_vertical.png) repeat-y;
   margin: 0 auto;
   width: 968px;
   color: black;
}

/*** header ***
we will hide text and replace it with a image
we need to assign a height for it so that the image wont cut off
*/

div#headerwrapper {
   background: url(uploads/images/layout/header_back.png) repeat-x;
}

div#header {
   height: 70px;    /* adjust according your image size */
   background: transparent url(uploads/images/layout/header_logo.png) no-repeat 4px top;
   margin: 0 auto;
   width: 960px;      
}
div#header h1 {
   width: 250px;
}
div#header h1 a {
   display: block;
   width: 250px;
   height: 60px;             /* adjust according your image size */
   text-indent: -999em;  /* this hides the text */
   text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}
div#links ul {
   list-style: none;
}

div#links ul li {
   display: inline;
   padding: 0 10px 0 0;
}

div#links ul li a {
   color: #555;
   text-decoration: none;
}

/* position for the search box */
div#search {
   float: right;
   width: 23em;    /* enough width for the search input box */
   text-align: right;
   padding: 0.6em 0 0.2em 0;
   margin: 0 1em;
}

div#breadcrumbs {
   font-size: 90%;
   border-bottom: 1px dotted #ccc;
   padding-bottom: 8px;
   margin: 0 0 10px 0;
}

div#breadcrumbs .breadcrumbs_delimeter {
   display: inline;
}

div#blocks {
   width: 960px;
   margin: 0 auto;
   padding: 15px 0 10px 0;
}

div#block1, div#block2, div#block3 {
   display: inline;
   width: 300px;
   height: 160px;

}

div#block2 {
   margin: 0 25px;
}

div#main_text_block {

   padding: 0 20px 15px 10px;
}
div.breadcrumbs span.lastitem { 
   font-weight:bold; 
}

div#content-line {
   width: 960px;
   background: url(uploads/layout/contentback.png) repeat-y;
}
div#contentbottom {
   width: 960px;
   height: 13px;
   background: url(uploads/layout/contentbottom.png) no-repeat;
}

div#main {
   padding: 20px;
}
div#main_index {
   margin-left: 4px;
}
div#main_submenu {
   float: left;
   width: 680px;
   padding: 15px 20px 0 20px;
}
div#contentwrapper #submenu h4 {
   font-size: 1em;
   padding: 0 0 0px 20px;
}
div#submenu p {
   font-size: 0.8em;
   padding: 0 0 5px 20px;
}
div#main_main {
   width: 280px;
   padding: 20px;
   background: url(uploads/layout/indexcontentback.png) no-repeat;
   height: 343px;
}
div#main_main p {
   line-height: 2em;
}
div#sidebar {
   float: left;        /* set sidebar on the left side. Change to right to float it right instead. */
   width: 700px;     /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX IE double margin bug */
   margin-left: 0;
}

div#footerwrapper {
   background: url(uploads/images/layout/footer_horizontal.png) repeat-x #161616;
   height: 121px;
   clear: both;
}

div#footer {
   background: url(uploads/images/layout/footer_middle.png) no-repeat;
   width: 968px;
   margin: 0 auto;
   color: #fefefe;
   height: 60px;
   font-size: 1.1em;
}
div#footerleft {
   width: 200px;
   float: left;
   padding: 25px 15px;
}
div#footercenter {
   text-align: center;
   float: left;
   width: 470px;
   padding: 25px 15px;
}
div#footerright {
   float: left;
   width: 115px;
   padding: 25px 15px 25px 100px;
}
div#footer p a {
   color: #fff; /* needed becouse footer link would be same color as background otherwise */
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   padding: 1em;
   border-bottom: 1px dotted black;
   margin: 1em;
}

/********************
CONTENT STYLING
*********************/
div#content {
   background: url(uploads/images/layout/content_back_middle.png) no-repeat;
   width: 968px;
}
div#content_vaihto {
   background: url(uploads/images/layout/content_back_mid_vaihto.png) no-repeat;
   width: 968px;
}

/* HEADINGS */
div#content h1 {
   font-size: 2em; /* font size for h1 */
   line-height: 1em;
   margin: 0;
}
#contentwrapper h2, #content_main h2 {
	color:#ff0000; 
	font-size: 1.8em;
	line-height: 1.2em;
	text-align: left; 
        margin: 0 0 10px 0;
}
h3 {
   color: #cc3333; 
   font-size: 1.4em;
   line-height: 1.3em;
        margin: 0 0 10px 0;
}
div#contentwrapper h4 {
   color: #333; 
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 1.4em 0 0.25em 0;
}
div#contentwrapper h5 {
   color: #666; 
   font-size: 1.1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h6 {
   color: #294B5F; 
   font-size: 1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
/* END HEADINGS */

/* TEXT */
p {
   font-size: 1em;
   margin: 0 0 1.5em 0; /* some air around p elements */
   line-height: 1.4em;
   padding: 0;
}
blockquote {
   border-left: 10px solid #ddd;
   margin-left: 10px;
}
strong, b {
   font-weight: bold;
}
em, i {
/* explicit setting for these */
   font-style:italic;
}

/* Separating the divs on the template explanation page, with some bottom-border */
div.templatecode {
  margin: 0 0 2.5em;
}

/* END TEXT */

/* LISTS */
/* lists in content need some margins to look nice */
div#main ul, div#main_submenu ul,
div#main ol, div#main_submenu ol,
div#main dl {
   font-size: 1.0em;
   line-height: 1.4em;
   margin: 10px 0 15px 0;
}

div#main ul li, div#main_submenu ul li,
div#main ol li, div#main_submenu ol li {
   margin: 0 0 0.25em 3em;
}

/* END LISTS */
/* Additional stuff */
.footer_address {
   float: left;
   width: 170px;
   margin: 30px 10px;
}
.footer_address h3 {
   padding: 0 0 10px 0;
}

/* Form */
.inputwrap {
   width: 420px;
   float: left;
   clear: left;
   padding: 5px 0 3px 0;
}
.inputwrap label {
   width: 130px;
   float: left;
}
.inputwrap input {
   width: 250px;
   float: left;
}
.textareawrap {
   width: 420px;
   float: left;
   clear: left;
   padding: 5px 0 3px 0; 
}
.textareawrap label {
   width: 130px;
   float: left;
}
.textareawrap textarea {
   width: 250px;
   height: 200px;
   float: left;
}
.multiwrap label {
   width: 130px;
   float: left;
}
.multiwrap {
   width: 420px;
   float: left;
   clear: left;
   padding: 5px 0 3px 0; 
}
.multiwrap .multi {
   float: left;
}
div.multiwrap .multi label {
   width: 100px;
   height: 20px;
   float: none;
   margin: 0 10px 0 0;
}
div.multiwrap .multi input {
   float: none;
}
.submit {
   float: right;
   padding: 15px 50px 0 0;
}
.vaihtoautotarjous fieldset {
   border: none;
   width: 420px;
   margin: 0 0 0 20px;
   float: left;
}
.vaihtoautotarjous legend {
   font-weight: bold;
   margin: 0 0 10px 0;
   color: red;
}
.clear {
   clear: both;
}
/*
.vaihtoautotarjous label {
   width: 120px;
   float: left;
   clear: left;
}
.vaihtoautotarjous textarea {
   width: 300px;
   height: 150px;
}
.vaihtoautotarjous .submit {
   text-align: left;
   padding-left: 120px;
   padding-top: 20px;
}
.vaihtoautotarjous .multi {
   float: left;
   clear: right;
   margin-bottom: 15px;
}
.vaihtoautotarjous .multi label {
   width: 100px;
   clear: none;
   float: left;
   margin-left: 10px;
}
.vaihtoautotarjous .multi input {
   padding-right: 10px;
   clear: none;
   float: left;
} */
#map {
   width: 600px;
   height: 400px;
   margin: 0 20px;
}
div#main_submenu table {
   padding-bottom: 10px;
}
.summarytable #merkki {
   padding: 4px 0px;
   width: 250px;
}
.summarytable #kuva {
   width: 95px;
}
.summarytable .row td {
   background: #eee;
   padding: 10px 10px;
   vertical-align: top;
}
.summarytable .altrow td {
   padding: 10px 10px;
   vertical-align: top;
}

/* Page Blocks */
#tuotteet_left, #tuotteet_right {
   float: left;
   width: 320px;
   margin: 0 20px 0 0;
}
#tuotteet_left img {
   margin: 0 auto;
}
/* 3 in a row */
.summarydiv_item {
   margin: 10px 0px 15px 0;
   height: 50px;
   width: 320px;
   float: left;
}
.summarydiv_name {
   margin: 0 0 10px 0;

   line-height: 1em;
   text-decoration: none;
}
.summarydiv_name a {
   text-decoration: none;
   font-weight: bold;
}
.summarydiv_image {
   margin: 0 10px 0 0;
   float: left;
}
.summarydiv_price {
   margin: 10px 0px;
}
div.index_ajankohtaista {
   width: 250px;
   padding: 10px 10px;
   float: left;
}
div.index_product_left {
   width: 300px;
   padding: 10px 10px;
   float: left;
}
div.index_product_right {
   width: 300px;
   padding: 10px 10px;
   float: left;
}
div.index_product_name a {
   font-size: 1.2em;
   font-weight: bold;
   text-decoration: none;
   line-height: 1.0em;
}
.index_product_price {
   font-size: 1.2em;
   font-weight: bold;
   padding: 15px 0 0 0;
}
.index_product_image {
   padding: 0 10px;
   float: left;
}
.arrows {
   background: url(uploads/images/layout/index_heading.gif) no-repeat left center;
   margin: 0 0 10px 10px;
   padding: 0 0 0 15px;
   color: #cc0000;
}
#index_categories {
   height: 45px;
   background: url(uploads/images/layout/index_kategoriat.gif) repeat-x;
   width: 960px;
   margin: 0 0 10px 0;
}
#index_categories h2 {
   float: left;
   font-size: 1.2em;
   background: url(uploads/images/layout/index_heading.gif) no-repeat left center;
   width: 152px;
   line-height: 45px;
   padding: 0 0 0 15px;
   margin: 0 0 0 10px;
}
#index_categories h2#atv {
   width: 130px;
   margin-left: 35px;
}
#index_categories a {
   text-decoration: none;
}
#vaihtoautoback {
   background: #fff;
   width: 890px;
   padding: 20px;
   border: dotted 1px #ccc;
   float: left;
}
#vaihtoautotarjous {
   margin: 10px 0;
}
#kysylisaa {
   margin: 10px 0;
}
.floatright {
   float: right;
   margin: 0 0 0 10px;
}
#indexwrap {
   height: 239px;
   width: 960px;
}
#indexwrap p {
   padding: 20px 10px 10px 20px;
   font-size: 1.2em;
}
#indexwrap strong {
   font-weight: bold;
   color: red;
}
#vaihtoehto {
   padding: 0px 10px 10px 20px;
}
#vaihtoautot {

}
table td, table th {
   padding: 2px 5px;
   text-align: left;
}
/* End of 'Main Layout' */