/* Puustelli CSS Document - A4Media Oy 2007 */
* { margin:0; padding:0; }
body { font-family: Verdana, Helvetica, Arial; color:#202020; background:#E6E6E6;} 

/* basic typo */ 
a { color:#E23022; text-decoration:none; font-size:11px;}
a:hover { text-decoration: underline; }
a img { border:0px;}
div { font-size:1px; }

/* headlines */
h1 { font-size:14px; margin-bottom:10px; }
h2 { font-size:14px; margin-bottom:10px; }
h3 { font-size:14px; margin-bottom:10px; }
h4 { font-size:12px; margin-bottom:10px; }
h5 { font-size:11px; margin-bottom:10px; }
h6 { font-size:10px; margin-bottom:10px; }

.red { color:#E33D30; }
.left { float:left; }

/* for clearing floats */
.clear {
  clear: both;
  height: 1px;
  overflow: hidden;
  font-size:1px;
}

/* paragraph styles */
p { margin:0 0 8px 0; font-size:12px; line-height:16px;}


/* basic layout structure */
#main { margin:auto; text-align:center; }
#main * { text-align:left;}
#top { background: url(pix/top.png) no-repeat center top; height:80px; }
#topWrap { margin:auto; width:953px; height:80px; text-align:left; }

/* subpage top navigation */
#topNavi { float:right; margin-top:44px; text-align:left;}
#topNavi a { text-align:left;}
#subnavi { float:right; margin-right:7px; _margin-right:3px; height:28px;}

/* lower submenu*/
#submenu2 { float:right; margin-top:-12px; margin-right:1px;}


#content { background: url(pix/content-bg.png) repeat-y center top; min-height:322px; height:auto !important; height:322px;}
#contentWrap { width: 953px; margin:auto; clear:both; }

/* dark subpage wrapper */
#darkWrap { background:#818181 url(pix/dark-bg.png) repeat-y; clear:both; border:1px solid #818181; padding:12px; 
width: 920px;
}

/* subpage right col pics */
.whiteWrap { background:#ffffff; min-height:371px; height:auto !important; height:371px; }

/* page id specific bg img */
#toteutus .whiteWrap { background:#ffffff url(pix/pic-asentaja.jpg) no-repeat top right; }
#tyytyvaisyys .whiteWrap { background:#ffffff url(pix/pic-tyytyvaisyys.jpg) no-repeat top right; }
#suunnittelu .whiteWrap { background:#ffffff url(pix/pic-suunnittelu.jpg) no-repeat top right; }
#rahoitus .whiteWrap { background:#ffffff url(pix/pic-rahoitus.jpg) no-repeat top right; }
#myymalat .whiteWrap { background:#ffffff url(pix/pic-myymalat.jpg) no-repeat top right; }



#bottom { background: url(pix/bottom.png) no-repeat center top; height:13px; margin:auto;}
#content-bottom { margin:auto; width: 944px; background: url(pix/bottom-viiva.png) repeat-x bottom;  }

#footer-navi { width:953px; margin:auto; text-align:center; }
#footer-navi #footer-navi-buttons { float:right; margin-right:5px;}
#footer-navi #copy { font-size:10px; color:#737373; padding-top:4px;}

#copy { margin:0 auto; text-align:left;}
#copy a { color:#737373; }

/* frontpage */
#nosto1 { float:left; width:590px; }
#nosto2 { float:left; width:360px; }



.nosto { width: 314px; float:left; margin-bottom: 10px; min-height:130px; height:auto !important; height:130px;
}
.nosto .wrap { margin-left:16px; margin-right:6px;}

.nosto h5 { text-transform: uppercase; font-weight:normal; font-size:11px;}
.nosto .viiva { background: url(pix/pystyviiva.png) no-repeat top center; height: 130px; width:3px; position:absolute; top:432px;
//margin-left:-16px;
}
.nosto .viiva-end { background: url(pix/pystyviiva.png) no-repeat top center; height: 130px; width:3px; position:absolute; top:432px;
margin-left:299px;
}

.nosto .left { margin-right:10px; border:2px solid #ffffff; }

ul { list-style:none; margin-top:12px;}
ul li { margin-bottom:12px; }
ul li a { color:#737373; font-size:11px; color:#E23022; }


ul.navi { list-style:none; margin-top:12px;}
ul.navi li { margin-bottom:12px; }
ul.navi li a { color:#737373; text-transform:uppercase; font-size:11px; }

/* end frontpage*/

/* subpage header red */
.header-red { background: #D84A35 url(pix/header-bg-red.png) repeat-x bottom; clear:both; border:1px solid #FDBAB0; border-bottom:0px; text-align:left; }

.subpageContent {  padding-left:28px; padding-top:20px; min-height:235px; height:auto !important; height:235px; margin-right:330px; text-align:left;}
.subpageContent3 {  padding-left:28px; padding-top:20px; min-height:235px; height:auto !important; height:235px; margin-right:10px; text-align:left;}
.subpageContent4 {  padding-left:28px; padding-top:20px; min-height:355px; height:auto !important; height:355px; margin-right:10px; text-align:left;}


/* wider column for shop details */
.subpageContent2 { padding-left:28px; padding-top:20px; min-height:235px; height:auto !important; height:235px; margin-right:240px; text-align:left;}


.grey-bottom  { background:#E6E6E6; min-height:115px; height:auto !important; height:115px; width:349px; float:left; border-right:1px solid #ffffff;}
.grey-bottom3 { background:#E6E6E6; min-height:115px; height:auto !important; height:115px; width:232px; float:left; border-right:1px solid #ffffff;}
.grey-bottom1 { background:#E6E6E6; min-height:115px; height:auto !important; height:115px; width:698px; float:left; border-right:1px solid #ffffff;}
.grey-bottom4 { background:#E6E6E6; min-height:115px; height:auto !important; height:115px; width:918px; float:left; border-right:1px solid #ffffff;}


.greyWrap { margin: 12px 12px 0px 12px; text-align:left;}
.greyWrap p { font-size:10px;}
.greyWrap h3 { color:#646464; }

/* big pics */
#picWrap { margin-left:12px; }
#picWrap div a { margin-right:6px;}

#footer-elements { margin:auto; text-align:center;}

.tyyleja {
  background: url('pix/tyyleja-bg.jpg') no-repeat top right;
  }
.ideoita {
  background: url('pix/ideoita-bg.jpg') no-repeat top right;
  }