html,body { /* Sivuston tausta */
	height: 100%;
	text-align: center;
	position: relative;
}

div#site_bg { /* Taustakuva */
	background: url(../images/test_background4.jpg) repeat-x left top;
	height: 100%;
	position: relative;	
}	

div#container { /* Sisältöalue */
	position: relative; /* needed for footer positioning*/
	margin: 0 auto; /* center, not in IE5 */
	float: center;
	width: 980px;
	height: auto !important; /* real browsers */
	height: 100%; /* IE6: treaded as min-height*/
	min-height: 100%; /* real browsers */
	
}

#header {
	width: 974px;
	height: 86px;
	float: center;
	padding: 0;
	margin: 0;
	border-style: solid;
	border-color: white;
	border-left-width: 3px;
	border-right-width: 3px;
	background-color: #801818;

}	

#silhuetti {
	position: absolute;
	width: 288px;
	height: 390px;
	float: left;
	padding: 0;
	left: 670px;
	top: 340px;
	background-image:url(../images/silhuetti.png) ;
}

#silhuetti2 {
	position: absolute;
	width: 446px;
	height: 293px;
	float: left;
	padding: 0;
	right: 3px;
	top: 355px;
	background-image:url(../images/silhuetti_2.png) ;
}

#silhuetti3 {
	position: absolute;
	width: 430px;
	height: 365px;
	float: left;
	padding: 0;
	left: 510px;
	top: 467px;
	background-image:url(../images/silhuetti_2.png) ;
}


#varjo_vasen {
	position: absolute;
	width: 4px;
	height: 619px;
	float: left;
	left: -4px;
	background-image:url(../images/varjo_vasen.png) ;
}

#varjo_bottom {
	position: absolute;
	width: 980px;
	height: 4px;
	float: left;
	top: 651px;
	background-image:url(../images/varjo_bottom.png) ;
}


#varjo_oikea {
	position: absolute;
	width: 4px;
	height: 619px;
	float: right;
	right: -4px;
	background-image:url(../images/varjo_oikea.png) ;
}



#logo {
	width: 76px;
	height: 79px;
	float: left;
	margin-left: 41px;
	margin-top: 7px;
	padding: 0;
	background-image:url(../images/hevoostalli_logo.jpg) ;

}

#logo_teksti {
	width: 329px;
	height: 50px;
	float: left;
	padding: 0;
	margin-left: 10px;
	margin-top: 15px;
	background-image:url(../images/hevoostalli_teksti.jpg) ;

}


#address {
	width: 200px;
	height: 40px;
	margin-left: 11px;
	margin-top: 17px;
	float: left;

}

#sub_menu {
	width: 105px;
	height: 68px;
	margin-top: 10px;
	margin-left: 10px;
	float: left;
}

#extra_links {
	width: 180px;
	height: 68px;
	margin-top: 10px;
	margin-left: 8px;
	float: left;
}

.logo_links {
	width: 50px;
	height: 52px;
	margin-right: 5px;
	float: left;
	
}


#menu {
	width: 974px;
	height: 47px;
	float: left;
	border-style: solid;
	border-color: white;
	border-left-width: 3px;
	border-right-width: 3px;
	padding: 0;
	margin: 0;
	background: url(../images/menu_bg.png) no-repeat left top;
}

#content_container {
	width: 980px;
	height: 565px;
	float: center;
	padding: 0;
	margin: 0;

}

#leftcolumn {
	width: 490px;
	height: 542px;
	float: left;

}

#title {
	width: 390px;
	height: 32px;
	margin-left: 50px;
	margin-top: 45px;
	padding-top: 8px;
	float: left;
	background: url(../images/title_bg.png) no-repeat
}

#border {
	width: 390px;
	height: 20px;
	overflow: auto;
	margin-left: 50px;
	float: left;
	background: white;
	z-index: 10;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;

}

#border_2 {
	width: 390px;
	height: 10px;
	overflow: auto;
	margin-left: 50px;
	float: left;
	background: white;
	z-index: 10;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;

}


#content {
	width: 350px;
	height: 275px;
	overflow: auto;
	margin-left: 50px;
	padding-left: 20px;
	padding-right: 20px;
	float: left;
	background: white;
	z-index: 10;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

#content_2 {
	width: 330px;
	height: 345px;
	margin-left: 60px;
	margin-top: 10px;
	float: left;
	background: url(../images/polaroid_bg.png) no-repeat}
	
#content_3 {
	width: 290px;
	height: 68px;
	overflow: auto;
	margin-left: 90px;
	padding-left: 20px;
	padding-right: 20px;
	float: left;
	background: white;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

#bottom {
	width: 390px;
	height: 32px;
	margin-left: 50px;
	margin-top: 10px;
	float: left;
	background: url(../images/bottom_bg.png) no-repeat
}

#rightcolumn {
	width: 490px;
	height: 542px;
	float: right;
}

#footer {
	width: 980px;
	height: 114px;
	float: left;
	background: url(../images/footer.jpg)

}

.menutext {
	float: left;
	text-align: left;
	vertical-align: middle;

}

/* FORMS/LOMAKKEET */

form {
	padding: 0;
	width: 340px;
	display: block;
	float: left;
	clear: right;
	text-align: left;
	margin-bottom: 15px;
}

label {
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	text-align: left;
	color: #484848;
	width: 70px;
	display: block;
	float: left;
	clear: both;
	padding: 0;
}

.box { /*Lomakkeiden syöttö-tekstikenttä*/
	border: 1px solid #550E0A;
	background: #FFF;
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	display: block;
	float: right;
	width: 210px;
	margin-bottom: 5px;
	height: 15px;
}
.message {
	border: 1px solid #550E0A;
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	background: #FFF;
	display: block;
	float: right;
	width: 210px;
	margin-bottom: 5px;
	height: 130px;
}
.button {
	border: 1px solid #666;
	background: #801818;
	color: #FFF;
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	text-align: center;
	display: block;
	width: 100px;
	margin-top: 5px;
	margin-left: 80px;
	float: left;
	clear:  both;
}
.button:hover {
	border: 1px solid #550E0A;
	background: #888;
	color: #550E0A;
}
.button2 {
	border: 1px solid #666;
	background: #666;
	color: #FFF;
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	text-align: center;
	display: block;
	width: 100px;
	margin-top: 5px;
	margin-left: 80px;
	float: left;
	clear:  both;
}
.button2:hover {
	border: 1px solid #550E0A;
	background: #888;
	color: #FFF;
}
/* FORMS/LOMAKKEET - loppuu */




/* KUVAGALLERIA - alkaa */

#kuvagalleria {
    width: 400px;
    height: 475px;
    position: absolute;
    top: 129px;
    left: 0px;
    float: left;
 	vertical-align: top;   

}


#kuva1 {
    width: 210px;
    height: 210px;
    position: absolute;
    top: 18px;
    left: 60px;
    z-index: 12;

}

#kuva2 {
    width: 210px;
    height: 210px;
    position: absolute;
    top: 48px;
    left: 165px;
    z-index: 13;
    
}

#content_4 {
    width: 350px;
    height: 95px;
    overflow: auto;
	font: 12px/normal "trebuchet MS", Lucida, Verdana, sans-serif;
	text-align: left;
	color: #484848;
    padding-left: 20px;
    padding-right: 20px;
    position: absolute;
    top: 325px;
    left: 50px;
    float: left;
    z-index: 33;
    background: white;
    filter:alpha(opacity=80);
    -moz-opacity:0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;

}

#border2 {
	width: 390px;
	height: 8px;
	overflow: auto;
	float: left;
	position: absolute;
	top: 317px;
    left: 50px;
	background: white;
	z-index: 33;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;

}

#border3 {
	width: 390px;
	height: 8px;
	overflow: auto;
	float: left;
    position: absolute;
	top: 420px;
    left: 50px;
	background: white;
	z-index: 33;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;

}


#bottom_kuulumisia {
    width: 390px;
    height: 32px;
    position: absolute;
    top: 435px;
    left: 50px;
    z-index: 18;
    float: left;
    background: url(../images/bottom_kuulumisia_bg.png) no-repeat;

}


#bottom_kuvia {
    width: 390px;
    height: 32px;
    position: absolute;
    top: 435px;
    left: 50px;
    z-index: 18;
    float: left;
    background: url(../images/bottom_kuvia_bg.png) no-repeat;

}

#bottom_henkilot {
    width: 390px;
    height: 32px;
    position: absolute;
    top: 435px;
    left: 50px;
    z-index: 18;
    float: left;
    background: url(../images/bottom_henkilot_bg.png) no-repeat;

}

#bottom_hevoset {
    width: 390px;
    height: 32px;
    position: absolute;
    top: 435px;
    left: 50px;
    z-index: 18;
    float: left;
    background: url(../images/bottom_hevosia_bg.png) no-repeat;

}

#bottom_tilat {
    width: 390px;
    height: 32px;
    position: absolute;
    top: 435px;
    left: 50px;
    z-index: 18;
    float: left;
    background: url(../images/bottom_tilat_bg.png) no-repeat;

}


#button_right {
     width: 17px;
     height: 20px;
     position: absolute;
     left: 416px;
     top: 441px;
     z-index: 34;

}

#button_left {
     width: 17px;
     height: 20px;
     position: absolute;
     left: 56px;
     top: 441px;
     z-index: 34;

} 

#gallery_bg {
	position: absolute;
	top: 128px;
	left: 38px;
	width: 345px;
	height: 317px;
	float: center;
	z-index: 17;
	padding: 0;


}

#gallery_menu {
	width: 1020px;
	height: 27px;
	float: left;
	position: absolute;
	top: 98px;
	z-index: 30;
	padding: 0;
	background: url(../images/menu_bg.jpg) no-repeat left top;
}

#GALLERY_Magnifier {
	position: absolute;
	top: 385px;
	left: 197px;
	width: 172px;
	height: 50px;
	float: left;
	z-index: 100;
	padding: 0;
	display: block;

}

/* KUVAGALLERIA - loppuu */


