body {
background-color: #fff;
font-family: arial;
margin: 0 auto;
font-size: 100%;
background-image: url(logo.png);
background-repeat: no-repeat;
background-position: 0% 0%;
}

#body2 {
background-color: #555555;
font-family: arial;
margin: 0 auto;
font-size: 100%;
padding: 0px;
}


#valikko {
position:absolute;
right:0%;
top:53px;
width:50%;
text-align: center;
font-family:"Trebuchet MS", Arial;
font-size: 110%;
color:#000;
text-transform:uppercase;
z-index:1000;
white-space: nowrap;
padding:0% 5%
background-color: #fff; 
}

.destiny {
position:absolute;
right: 0%;
bottom: 0%;
z-index: 5;
}



a.ylalinkki:link{color: #000; text-decoration:none; padding:0% 5%; z-index:1000 }
a.ylalinkki:visited{color: #000; text-decoration:none; padding:0% 5%; z-index:1000 }
a.ylalinkki:hover{color:white;background-color: #db1465; padding:0% 5%; z-index:1000 }


a.pinkki:link{color: #fff; text-decoration:underline;}
a.pinkki:visited{color: #fff; text-decoration:underline;}
a.pinkki:hover{color:#fff;text-decoration:underline;}


#topmenu {
position: absolute;
top: 0px;
left: 0px;
height: 110px;
width: 100%;
z-index: 1000;
background-color: #fff;
}

#topmenu2 {
position: absolute;
top: 0px;
left: 0px;
height: 110px;
width: 100%;
z-index: 1000;
}


.otsikko {
position:absolute;
top: 0%;
left: 0%;
z-index: 1;
}

#mainframe {
width: 100%;
position:absolute;
top: 0px;
left: 0px;
border: 1px solid #000;
}


#pinkbar {
position:absolute;
top:110px;
left:0px;
width: 100%;
height: 225px;
background-color: #db1465;
background-image: url(thomasmediabg.png);
}

#harmaa {
	position:absolute;
	top: 335px;
	left: 0px;
	width: 20%;
	background-color: #3b3a3a;
	height: 100%;
	}

.kulma {
	position: absolute;
	top: 228px;
	left: 0px;
	z-index: 2;
	}

.julie {
	position: absolute;
	bottom: 0px;
	left: 0px;
	z-index: 2;
	}
#pinkbar2 {
position:absolute;
top:110px;
left:0px;
width: 100%;
height: 225px;
background-color: #db1465;
background-image: url(hiiri.gif);
background-repeat: no-repeat;
background-position: 0% 0%;
}



#textfield {
width: 300px;
height: 205px;
font-family: arial;
text-transform: uppercase;

text-align: justify;
font-size: 0.7em;
color: #fff;
margin-left: 230px;
padding: 10px;

letter-spacing: 1px;
font-weight: none;
line-height: 250%;


}


.bottom {
position:absolute;
top: 335px;
left: 0px;
}

.kyna {
position:absolute;
bottom: 28%;
left: 1%;
z-index:1;
}


.kasi {
position:absolute;
bottom: 0%;
left: 4%;
z-index:1;
}


.theydidit {
position:absolute;
bottom: 12%;
left: 33%;
}



.auto {
position:absolute;
top: 405px;
left: -5%;
z-index:1;
}

.graf {
position:absolute;
top: 160px;
right: 6%;
z-index:1;
}

.iso {
font-family: arial;
font-weight: bold;
font-size: 1.4em;
}

.iso2 {
font-family: arial;
font-weight: bold;
font-size: 1.4em;
margin-left: 20px;
}

#whitebar {
position:absolute;
top:335px;
left:0px;
width: 100%;
height: 225px;
background-color: white;
background-image: url(avaruus.gif);
background-repeat: no-repeat;
background-position: 0% 0%;
}

#bottomline {
position: absolute;
top: 560px;
left: 0px;
width: 100%;
height: 225px;
background-color: #999999;
background-image: url(taitto.gif);
background-repeat: no-repeat;
background-position: 0% 0%;
}

.textfield2 {
font-family: arial;
text-align: justify;
font-size: 0.8em;
color: #fff;
margin-left: 340px;
margin-top: 2%;
margin-bottom: 2%;
margin-right: 6%;
letter-spacing: 1px;
font-weight: none;
line-height: 150%;
background-color: transparent;
}

.textfield3 {
font-family: arial;
text-align: justify;
font-size: 0.8em;
color: #000;
margin-left: 340px;
margin-top: 2%;
margin-bottom: 2%;
margin-right: 6%;
letter-spacing: 1px;
font-weight: none;
line-height: 150%;
background-color: transparent;
}

.textfield4 {
padding-top: 20px;
font-family: arial;
text-align: justify;
font-size: 0.8em;
color: #fff;
margin-left: 340px;
margin-top: 2%;
margin-bottom: 2%;
margin-right: 6%;
letter-spacing: 1px;
font-weight: none;
line-height: 150%;
background-color:  transparent;
}


#p1 {
position: absolute;
top: 110px;
left: 0px;
width: 33%;
background-color: #999999;
color: #fff;
padding-left: 30px;
padding-top: 30px; 
padding-bottom: 0px;
padding-right: 50px;
}

#w1 {
position: absolute;
top: 110px;
left: 33%; 
width: 34%;
background-color: #999999;
padding-left: 30px;
padding-top: 30px; 
padding-bottom: 0px;
padding-right: 50px;
}

#g1 {
position: absolute;
top: 110px;
right: 0px;
width: 33%;
background-color: #999999;
padding-left: 30px;
padding-top: 30px; 
padding-bottom: 0px;
padding-right: 50px;
}

#portfolio {
position: absolute; 
top: 110px;
left: 0px;
height: 100%;
font-size: 0.8em;
}

#pink {
text-align:top; 
padding: 25px;
color: #fff;
background-color: #db1465;
}

#white { 
text-align:top; 
padding: 25px;
color: #000;
background-color: #fff;
}

#gray { 
text-align:top; 
padding: 25px;
color: #fff;
background-color: #999999;
}

.thumb {
margin-top: -5px;
margin-bottom: 5px;
border: 2px solid #fff;
}

.thumb2 {
margin-left: 5px;
margin-right: 5px;
border: 2px solid #999999;
}


.margin {
margin-top: 30px;
}

#yhteys {
background-color: #db1465;
width: 100%;
position: absolute;
top: 110px;
left: 0px;
padding: 20px;
height: 400px;
background-image: url(tausta.gif);
background-repeat: no-repeat;
}	

span.bak {
font-family: "Courier New";
font-size: 1.8em;
font-weight: bold;
color: #db1465;
background-color: #fff;
padding: 0px 5px;
}

#yhtgray {
position:absolute;
top: 510px;
left: 0px;
background-color: #777777;
height: 350px;
}

#yhtgray2 {
position:absolute;
bottom: 0px;
left: 0px;
background-color: #999999;
height: 50px;
}

.bot {
font-family: arial;
font-size: 9em;
color: #db1465;
position:absolute;
bottom: 0px;
left: 10px;
}