* {
font-size: 11px;
font-weight: 300; 
color: #555555;
}

body {
background:#E9E9E9 url('images/background.jpg') repeat-y center;
margin: 0;
padding: 0;
font-family: "verdana", sans-serif
}


#container {
float: left
background: url("images/background.jpg");
margin-left: auto;
margin-right: auto;
width: 775px;
}

#main {
float: left
}

#top {
float: left;
width: 775px;
height: 75px;
background: url('images/top.jpg') no-repeat;
}



#left {
float: left;
width: 248px;
background: url('images/left.jpg') repeat-y;
}

.navigation {
float: left;
width: 123px;
padding: 20px;
padding-top: 10px;
background: #FFFDD8;
border: 1px #F3CDB8 dashed;
margin-top: 40px;
margin-left: 40px;
margin-right: 35px;
}

#body {
float: left;
width: 527px;
background: url('images/right.jpg') no-repeat right top;
}

#copyright {
float: left;
margin-left: 8px;
margin-right: 20px;
width: 761px;
border-bottom: 5px solid #9B99D4;
}

#bottom {
float: left;
background: #E9E9E9;
width: 100%;
height: 50px;
}


#linksout a{
	background-color: #FEFDED;
	border: 1px solid #CDCDCD;
-moz-border-radius: 0px 6px 6px 6px;
	color: #818181;
	display: block;
	font-size: 11px;
	font-family: Arial;
	text-align: center;
	margin: 2px;
	padding: 3px;
	line-height: 17px;
}

#linksout a:hover{
	background-color: #FBEDFE;
	color: #818181;
		border: 1px solid #CDCDCD;
-moz-border-radius: 0px 6px 6px 6px;
}	





#note {
margin-left: 25px;
float: left;
width: 187px;
background: #9D97D2 url('images/note.jpg') repeat-y left top;

}

#note_top {
background: url('images/note_top.jpg');
width: 187px;
height: 60px
}

#note_content {
color: #9D97D2;
padding-left: 27px;
padding-right: 27px;
padding-top: 10px;
line-height: 26px;
}

#content {
width: 486px;
padding-top: 126px;
float: left;
text-align: justify
}


#form {
background: #E7FCEA;
width: 90%;
padding: 20px;
}

.form {
border:#70B7A0 1px dashed;
vertical-align:middle;
}

.button {
background: #FF9900;
color: #FFFFFF;
border: 3px solid #FEBE5D
}



h1 {
color: #70B7A0;
font-size: 22px;
text-align: right;
text-transform: uppercase;
}

h2 {
color: #5451AC;
font-size: 16px;
padding-top: 0;
padding-bottom: 10px;
text-transform: capitalize
}

h3 {
color:#DB608E;
font-size: 14px;
}

h4 {
color: #D95D8F;
font-size: 13px;
font-weight: bold;
}

h5 {
font-size: 14px;
padding-left: 65px;
padding-top: 35px;
}

b, strong {
color: #A655A1;
font-weight: bold
}

hr {
border-left:0px none; border-right:0px none; border-top:0px none; border-bottom:1px dashed #E2E2E2; height: 0
}

em {
color: #BFBFBF;
font-style: normal
}


a {
color: #9D97D2;
text-decoration: none;
}

a:hover {
color: #ECC051;
cursor: default;
}


/* Grafiikkojen design */

.avatar {
	float:center;
	padding: 5px 5px 5px 5px;
	border: 1px solid #CDCDCD;
	background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
}

.avatar:hover {
background-color: #FFFFFF; 
}

.brushes {
font-family:verdana; 
font-weight:none;
font-size:11px;
letter-spacing:0px;
align: right;
color:#000000;
text-align:left;
float:left;
height:160px;
width:230px;
border: 1px solid #CDCDCD;
background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
margin: 2px;
}

.brushes:hover {
background-color: #FFFFFF; 
}

.fonts {
font-family:verdana; 
font-weight:none;
font-size:11px;
letter-spacing:0px;
align: right;
color:#000000;
text-align:left;
float:center;
height:260px;
width:300px;
border: 1px solid #CDCDCD;
background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
margin: 2px;
}

.fonts:hover {
background-color: #FFFFFF; 
}


.wallpaper {
font-family:verdana; 
font-weight:none;
font-size:11px;
letter-spacing:0px;
align: right;
color:#000000;
text-align:left;
float:left;
height:195px;
width:220px;
border: 1px solid #CDCDCD;
background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
margin: 2px;
}

.wallpaper:hover {
background-color: #FFFFFF; 
}


.texture {
font-family:verdana; 
font-weight:none;
font-size:11px;
letter-spacing:0px;
align: right;
color:#000000;
text-align:left;
float:left;
height:120px;
width:140px;
border: 1px solid #CDCDCD;
background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
margin: 2px;
}

.texture:hover {
background-color: #FFFFFF; 
}


.layouts {
font-family:verdana; 
font-weight:none;
font-size:11px;
letter-spacing:0px;
align: right;
color:#000000;
text-align:left;
float:center;
height:250px;
width:325px;
border: 1px solid #CDCDCD;
background: #F6F6F6;
-moz-border-radius: 0 10px 10px 10px;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
margin: 2px;
}

.layouts:hover {
background-color: #FFFFFF; 
}