@charset "UTF-8";

body  {
	font: 80% "Calibri", "Lucida Grande", Verdana, Helvetica, sans-serif;
	font-size-adjust: 0.46;
	background: #eeece4 url('../images/body.png') repeat-x;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	padding-bottom: 40px;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}

/* HEADER LAYOUT*/
 
#header {position: z-index: 10; width:100%;padding:0px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */}
#topbar {background-color:#d4ecf1; width:100%; height:23px; border-bottom:solid 5px #a72645;}
#logobar {background-color:#e2dcbc; width:100%; height:109px; border-bottom:solid 4px #eeece4;}
#logo { width:195px; height:109px; background:url("../logo.jpg") no-repeat; margin: 0 auto; padding: 0px; border-left: 3px solid #eeece4; border-right: 3px solid #eeece4}
#navi {z-index: 20; width: 64em; display: block; margin: 0 auto;}
#navibar {background-color:#e2dcbc;height: 29px;width:100%;margin:0;}

/* BREADCRUMB */

#header #breadcrumb .bread a, #header #breadcrumb .bread a:visited, #header #breadcrumb .bread a:active{color:#c2bfa9; text-decoration:none;}
#header #breadcrumb .bread a:hover {color:#303123; text-decoration:none;}
#header #breadcrumb{width: 980px; text-align:left; margin:0 auto; color:#c2bfa9; font-size: 0.8em; text-transform:uppercase; padding: 4px; padding-left: 35px}

/* BANNERS */
#banners {background: #fff; border-top: 2px solid #fff; width: 808px; height: 100px; margin:0; padding: 0; border-left: 2px solid #fff; text-align:left}
#banneri1 {float:left; display: block; margin:0 2px 0 0; padding: 0; text-align: left; width: 200px; height: 100px; background: #fff}
#banneri2 {float:left; display: block; margin:0 2px 0 0; padding: 0; text-align: left; width: 200px; height: 100px; background: #fff}
#banneri3 {float:left; display: block; margin:0 2px 0 0; padding: 0; text-align: left; width: 200px; height: 100px; #fff}
#banneri4 {float:left; display: block; margin:0 2px 0 0; padding: 0; text-align: left; width: 200px; height: 100px; background: #fff}

#banners img {width: 200px; border:0;margin:0; padding:0;}


/* SIDEBAR RIGHT */

#sidebarRight {	float: right; border-top:2px solid #fff; border-bottom:2px solid #fff; width: 170px; background: #f5f4ef; text-align:center}
#sidebarRight ul {text-align: left; list-style: none; margin:15px 0 40px 0; padding:0}
#sidebarRight ul li { margin: 14px 20px 10px 16px; font-size: 0.9em}
#sidebarRight ul li:hover { list-style: url("../images/pikkunuoli.png"); list-style-position:outside; padding-left:0px;}
#sidebarRight h3 {font-weight: normal}
#sidebarRight ul li.noBullet{list-style: none;}
#sidebarRight ul li a {color: #5a5c41; text-decoration:none}
#sidebarRight ul li a:hover {color: #5a5c41; text-decoration:none}
#sidebarRight ul li a.hilite {color: #a41e53; text-decoration:none}
#sidebarRight ul li a:hover.hilite {color: #a41e53; text-decoration:none}
#sidebarRight ul hr {border:none; border-top: 1px solid #eeece4; margin: 0 -10px}

#sidebarRight hr {border:none; border-top: 2px solid #fff; margin: 0 -10px}


#bannersRightBar{float:right; clear:right; width: 150px}

/* SIDEBAR LEFT */

#sidebarLeft {float: left; width: 170px; padding:0px; text-align:left; height: 100%}
#sidebarLeft h3 {font-size: 1em; background-color:#cfcbb5; font-weight: normal; margin: 0 2px 1px 0; padding: 5px 0 5px 14px; text-transform:uppercase}
#sidebarLeft a h3 {color: #000}
#sidebarLeft a:hover h3 {color: #a70042}
#sidebarLeft ul {list-style:none; margin:10px 0 0 0; padding:0; }
#sidebarLeft ul li { margin: 4px 20px 10px 20px}
#sidebarLeft ul li a {color: #333; text-decoration:none; font-size:0.9em}
#sidebarLeft ul li:hover { list-style: url("../images/pikkunuoli.png"); list-style-position:outside;}
#sidebarLeft ul li:hover.nohover { list-style: none;}

/* MAIN CONTENT */

#container {z-index: -1; width: 980px; background: #ebe7d2; padding: 0; margin: 0px auto; text-align: left; border-right:2px #fff solid;}

#container #ajassaBanneri { background:url("../images/header_ajassa.jpg"); margin: 0;width:980px; height: 186px; padding: 0; }
#container #ajassaBanneriKapea {background:url("../images/header_ajassa_kapea.jpg"); margin: 0;width:980px; height: 116px; padding: 0 }
#container #perinteinenBanneri { background:url("../images/header_perinteinen.jpg"); margin: 0;width:980px; height: 186px; padding: 0; }
#container #perinteinenBanneriKapea {background:url("../images/header_perinteinen_kapea.jpg"); margin: 0;width:980px; height: 116px; padding: 0 }
#container #optimiBanneri {background:url("../images/header_optimi.jpg"); margin: 0;width:980px; height: 220px; padding: 0 }
#container #optimiBanneriKapea {background:url("../images/header_optimi_kapea.jpg"); margin: 0;width:980px; height: 115px; padding: 0 }
#container #banneriKapea {background:url("../images/header_kapea.png"); margin: 0;width:980px; height: 59px; padding: 0 }

#container #banneriKapea h1 {margin-left: 20px}

#container #flashHolder { margin: 0 170px 0 0;width:808px;	height: 320px ;padding: 0; border-right:2px solid #fff;}
#container #flashHolder img{ width: 808px; height: 320px; border:none; margin:0; padding:0; }


/*etusivulla*/
#mainContent {background: url("../images/siluettimaisema.png") no-repeat bottom left #fcfaf3; border-bottom: 1px solid #e2e3ce; border-left:2px solid #fff; border-top:2px solid #fff;border-right:2px solid #fff;margin: 0 170px 0 0; padding:0 }

#mainContentRight{background: url("../images/leftbar_bg.png") repeat-y #fcfaf3; border-left:2px solid #fff;border-top:2px solid #fff;margin: 0; padding:0}

#contentwrapper {margin:0; padding-top:30px; padding-right: 100px; padding-bottom: 20px; padding-left: 300px; background:url("../images/98latka.png") no-repeat 5px 5px;}

#contentwrapperAsiakas {margin:0; padding-top:30px; padding-right: 40px; padding-bottom: 200px; padding-left: 0px; background:url("../images/raita1.png") repeat-x top;}

#contentwrapperYritys {padding: 30px 80px 120px 250px;  background:url("../images/raita1.png") repeat-x top;}

#naamat{width: 500px; float:left}

#tarinalista {float:left; clear:left; width: 200px; margin-left: 40px}
#tarinalista ul li{margin-bottom: 5px}
#tarinalista ul a, #tarinalista ul a:active, #tarinalista ul a:visited {color: #333; font-weight: normal;}
#tarinalista ul a:hover {color: #a70042}
#contentwrapper h1 {color: #575c42; text-transform: none; font-weight: normal; font-family: "Trebuchet MS"; font-size: 2.1em}


/*mallistosivu*/
#mallistosivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 0px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat; text-align:center}
#mallistosivu_main #palsta_vasen {background:url("../images/raita1.png") repeat-x top; float:right; float:left; margin:0 0 0 0; padding:8px 0 0 0;width:403px; text-align:left;}
#mallistosivu_main #palsta_oikea {background:url("../images/raita1.png") repeat-x top; float:right; margin:0; padding:8px 0 0 0;width:403px; text-align: left;}
#mallistosivu_main #palsta_oikea_talot { background:url("../images/raita1.png") repeat-x top; float:right; margin:0; padding:0;width:402px;text-align:center}
#mallistosivu_main #palsta_vasen_talot { background:url("../images/raita1.png") repeat-x top;  float:left; margin:0; padding:20px 15px 10px 55px;width:336px; text-align: left}
#mallistosivu_main h2 {color: #fff; text-transform:uppercase; font-size:1em; margin-top: 20px;}
#mallistosivu_main .palsta_header {margin:0 0 24px 0; padding:0; text-align:center; float:left; width: 100%; background:#a1a37c; border-bottom: 2px solid #fff}
.talolista { float:left; clear:both ;width:400px; height: 102px; margin:4px 0; padding-right: 0 }
.talolista h3 { font-weight:normal; color: #181818; padding: 0; margin: 10px 0 4px 40px}
.talolista p {color: #181818; padding: 0; margin: 0 0 0 40px}
.talolista a img {float:right; clear:right; border:none; padding: 0; margin-right: 6px}

.alavalikko-mallisto {float: left; clear:both; width: 98%; margin-top: 60px; margin-bottom: 0px}
#optimi-alavalikko a {color: #93821D}
#optimi-alavalikko a:hover {color: #fecd00}
.optimi-form {margin-left: 50px; width: 680px}
.optimi-form-message {margin-top: 30px; margin-left: 70px; font-size: 1.2em; font-weight: bold; text-align: left};

#valintalomake {text-align: left; width: 100%; padding-left: 30px;}
div#valintalomake-submit img {cursor: pointer}


#perinteinen-alavalikko a {color: #444833}
#perinteinen-alavalikko a:hover {color: #777c4f}

/*muut sivut*/

#yhteyshenkilosivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 0px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}
#yhteyshenkilo_etusivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0; padding: 20px 20px}
#takaisinetusivulle {float:left; margin:0; padding: 20px 0 0 40px}
a.takaisinetusivullelinkki, a:visited.takaisinetusivullelinkki, a:active.takaisinetusivullelinkki {background:url("../images/nuolivasen.png") no-repeat; background-position: 2px -2px; color: #444; font-size: 0.8em; text-transform:uppercase; line-height: 20px; padding-left: 26px}
a:hover.takaisinetusivullelinkki {background-position: 0px -2px;}
#sivuotsake {margin:0 0 0 172px; padding: 4px 0}
#sivuotsake h1 {color: #444; margin-top: 18px}
#yhteyshenkilosivu_main #palsta_vasen_edustajat {background:url("../images/raita1.png") repeat-x top; float:left; margin:0; padding:20px 0 0 20px;width:383px}
#yhteyshenkilosivu_main #palsta_oikea_edustajat {background:url("../images/raita1.png") repeat-x top; float:right; text-align:center; margin:0; padding:0;width:405px }
#yhteyshenkilosivu_main #palsta_oikea_edustajat img {margin-top: -40px}
#yhteyshenkilosivu_main #palsta_vasen_edustajat h2 {font-size: 1.8em}
#yhteyshenkilosivu_main #palsta_vasen_edustajat p {font-size: 1.1em; margin: 3px 0}
/*
table#projektipaallikot td {vertical-align:top;}
table#projektipaallikot td p {margin: 2px 0}
*/

/*lomakesivu*/

#lomakesivu_main {margin:0; padding-top:20px; padding-right: 80px; padding-bottom: 30px; padding-left: 260px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}

#lomakesivu_main h3 { font-weight: normal}

input[type=text]{margin: 10px; font-size: 0.8em; border: none; padding:3px; background: #eeeade;}

#esitekuva {width: 264px; height: 267px; margin: 10px 0 15px 70px;}

/*talosivu */
#mallistosivu_main h1 {font-weight: normal; font-size: 1.7em; margin-bottom: 0.3em;}
#talonkuva {margin:20px 20px; padding:0; border:none;}
#palsta_vasen_talot p { margin: 3px 0;}
#palsta_vasen_talot p.tilat {text-transform: uppercase; margin: 5px 0 5px 0; font-size: 1.3em}
#palsta_vasen_talot p.kuvaus {margin-top: 15px}

.takaisinmallistoon_kuvake {border: none; margin: 35px 0 0 40px;}
.toimitussisaltolinkki {}
#edellinenmalli {float:left;}
#seuraavamalli {float:right;}
a.sivunvaihtolinkki, a:visited.sivunvaihtolinkki, a:active.sivunvaihtolinkki {text-transform:uppercase; font-size: 0.7em; color: #e2dcbc}
a:hover.sivunvaihtolinkki {text-transform:uppercase; font-size: 0.7em; color: #7dbfcd}


/*asiakastarinat*/
#asiakastarina{margin-top: 30px; line-height: 20px; margin-left: 300px}
#asiakastarinat{float:right; width: 600px; margin-top: 30px;line-height: 20px;}
#asiakastarina h2 {margin-top: 30px}
/*rakentamistapasivu*/

#rakentamissivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 200px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}

#rakentamissivu_main #rakentamissivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0;  padding: 20px 50px}
#rakentamissivu_main h1 {margin: 15px 0 15px 10px; font-size: 3em; width: 100%; text-align:center}
#rakentamissivu_main h2 {font-size: 1.2em; width: 100%; text-align:center; margin: 10px 0}
#rakentamissivu_main ol {margin: 60px 20px 0 360px; list-style-type: decimal; font-size: 1.2em;}
#rakentamissivu_main li {margin-top: 30px}
#rakentamissivu_main li h3{font-size: 4em}
#rakentamissivu_main li p {font-size: 0.78em; line-height: 1.4em; color: #333}
#rakentamissivu_main #jana img {margin: 40px 0 15px 30px}

/*ainatalossa sivu*/

#ainatalossasivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 200px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}
#ainatalossasivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0; padding: 20px 20px}

#ainatalossasivu_main h2 {visibility: hidden; color: #fff; text-transform: uppercase; font-size: 3em; width: 400px; float:left; padding-left: 20px; padding-top: 20px}
#ainatalossasivu_main #nostopalkki {width: 100%; margin-bottom: 4px}
#ainatalossasivu_main #nostopalkki ul {margin:10px 80px 10px 40px; list-style-type: square}
#ainatalossasivu_main #nostopalkki li {padding-bottom: 2px}
#ainatalossasivu_main ol {list-style-type: decimal; width: 180px;float:left; margin-top: 40px; margin-left: 50px}
#ainatalossasivu_main ol li {margin-bottom: 20px;}
#ainatalossasivu_main img {float:right; margin-top: 20px; margin-right:20px;}

/*sisustus*/

#sisustussivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 200px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}
#sisustussivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0; padding: 20px 20px}

#sisustussivu_main h2 {text-transform: uppercase; color: #333; margin-top: 10px}

#kalustesivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 200px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}
#kalustesivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0; padding: 20px 0px}
#kalustesivu_content h3{padding: 10px 0 10px 20px; background: #CFCBB5}
#kalustesivu_content table {margin: 0 30px}
#kalustesivu_content ul {margin: 14px 30px}
#kalustesivu_content h4 {margin: 0 20px}
#kalustesivu_main h2 {font-size: 1.8em; text-transform: uppercase; color: #333; margin: 10px 0 30px 20px}
#kalustesivu_content img {border: 1px solid #aaa; margin: 5px;}
div.sisustus-menu {width: 150px; float:left;}

div.sisustus-menu h4{font-weight: normal; text-transform: uppercase;}
div.sisustus-menu ul {list-style:none; margin:0 0 0 0; padding:0; }
div.sisustus-menu ul li { margin: 0 0 0 5px; font-size: 1.2em;}
div.sisustus-menu ul li a {color: #333; text-decoration:none; font-size:0.9em}
div.sisustus-menu ul li:hover { list-style: url("../images/pikkunuoli.png"); list-style-position:outside;}
div.sisustus-menu ul li ul li {font-size: 0.8em;}
div.sisustus-menu ul li ul li:hover {list-style:none;}
div.sisustus-menu ul li ul li a:hover {color: #a70042}
div.sisustus-menu ul li:hover.nohover { list-style: none;}

#kodinkone_content {width: 100%; margin: 0; padding: 0;}

.kodinkone{width: 100%; margin: 30px 0; padding: 30px 0; border-top: 1px solid #a70042}
.tulisija{width: 100%; margin: 0 0; padding: 15px 0;}


.kodinkone-kuva{float:left; width: 140px;}
.kodinkone-palsta{width: 340px; float: left; margin-left: 140px}
.kodinkone-palsta ul li {font-size: 1.05em;}
.kodinkone-palsta ul li ul li, .kodinkone-palsta ul li p {padding-left: 20px; font-size: 0.85em; font-weight: normal}
.kodinkone-palsta h3 {margin-top: 0px}
.kodinkone-palsta h4 {width: 100%; background: #a41e53; color: #fff; font-size: 0.8em; text-transform: uppercase; padding-left: 4px; margin: 12px 0}

.tulisija-laatat {float:left; margin-right: 30px}
.tulisija-laatat table td { width: 50px; padding-right: 20px}
.tulisija-laatat table q{quotes: '"' '"' "'" "'"; font-size: 1em; margin:0; padding:0}

.lauteet{width: 100%; margin: 0 0; padding: 0 0;}
.lauteet-kuva{float:left; width: 420px;}
.lauteet-palsta{width: 300px; float: left;}

table.ovet th {width: 130px; font-weight: bold}
table.ovet th, table.ovet td {text-align:center; padding: 5px 0}

.laatat a img {border-right: 1px solid #aaa; border-bottom: 1px solid #888; margin: 0 10px 10px 0;}
.laatat q{quotes: '"' '"' "'" "'"; font-size: 1em; margin:0; padding:0}
.tapetit a img {border: 1px solid #888; margin: 0 12px 12px 0;}


#albumisivu_main {margin:0; padding-top:0px; padding-right: 0px; padding-bottom: 20px; padding-left: 170px; background:url("../images/siluettimaisema.png") bottom right no-repeat;}
#albumisivu_content{background:url("../images/raita1.png") repeat-x top; margin: 0; padding: 20px 20px}

/* FOOTER */

#footer { text-align: left; height: 69px;width: 980px; margin: 0 auto;border-left: 2px solid #fff; padding: 0; background: url("../images/alakulma.jpg") no-repeat right;background-position: bottom right;}
#footer2 { height: 69px;width: 982px; margin: 0 auto; padding: 0; background: url("../images/footer2.png") no-repeat #f6f5ee; background-position: top left;}
#footer_l { width: 786px;border-right: 2px solid #fff;	margin:0px;	padding:0 0 0 20px;	height: 69px;	background: url("../images/footer_bg.jpg") repeat-x bottom;	text-align:left;}
#footer2_l {padding: 46px 0 0 20px; text-align:left; font-size: 80%;	color: #fff;} 
#footer p { font-size: 80%;	color: #fff;margin: 0; padding: 46px 0 0 0;}
.fltrt { float: right;margin-left: 8px;}
.fltlft { float: left;	margin-right: 8px;}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
	padding:0;
	margin:0;
}

/* STYLES */

a, a:visited, a:active{	outline: 0;	color: #a70042;	text-decoration: none;}
.bulleted {	background: url("../images/pikkunuoli2.png") no-repeat;	background-position:left center;	padding-left: 16px;}
a:hover{	color: #7dbfcd;	text-decoration:none;	border: none;}
a:hover.bulleted{	background: url("../images/pikkunuoli3.png") no-repeat;	background-position:left center;}

h1{	font-size: 1.6em; font-weight: normal; text-transform:uppercase; margin-bottom: 10px; margin-top: 13px}
h2{	font-weight:normal; font-size: 1.4em; color: #a41e53; margin: 30px 0 20px 0}
h3{	text-transform: uppercase; font-weight:normal; font-size: 1.3em; margin: 15px 0 10px 0}
h4{ font-weight:bold; font-size: 1.1em; color: #a41e53; margin: 15px 0 5px 0 }
p{ margin-bottom: 5px;}

hr{border: none; border-top: 1px solid #a70042}
hr.optimi{border: none; border-top: 1px solid #93821D}

.wine{ color: #a70042}
.green_backup {color: #444833}
.green{color: #575c42}
.yellow{color: #fecd00}
.darkyellow{color: #93821D}
.white {color: #fff}
.uppercase { text-transform:uppercase}