<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";

/* CSS-tyylitiedosto harjoitusty�lle */

body {
	font-family: "Arial", sans-serif;
	background-image: url("drock028.jpg");
	margin: 0px;
        padding: 0px;
}

/* Paamolkky */
#main{    
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    height: 1000px;
    background-color: #0f0f0f;
    position: relative;
    margin-top: 20px;
	margin-bottom: 20px;
	border: solid 2px;
	border-color: #bdbdbd;
	color: #bdbdbd;
}


/* Otsikot */
h1 {
	font-family: "Times", sans-serif;
	color: #bdbdbd;
	margin-left: 15px;
	display: inline-block;
}

h2 {
    font-family: "Arial", sans-serif;
	color: #bdbdbd;
	margin-left: 15px;
}

.links {

    text-decoration: none;
    color: #bdbdbd;
    
}

#categories {

    position: relative;
    border: 1px solid;
    border-color: #bdbdbd;
    width: 800px;
    height: 450px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -15px;
    font-family: "Times";
    color: #9f9fa6;
    font-size: 16;
    font-weight: bold;
    display: inline-block;
}

#categoriesmini {

    position: absolute;
    border: 1px solid;
    border-color: #bdbdbd;
    width: 700px;
    height: 120px;
   /* margin-left: auto;
    margin-right: auto; */
    top: 10px;
    right: 10px;
    font-family: "Arial";
    color: #9f9fa6;
    font-size: 8;
}

.catlink {
    
    position: relative;
    width: 175px;
    height: 175px;
    text-align: center;
    background-color: #1d1d1c;
    display: inline-block;
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 30px;
}

.catlinkmini {
    
    width: 87.5px;
    height: 87.5px;
    text-align: center;
    background-color: #1d1d1c;
    display: inline-block;
    margin-right: 2.5px;
    margin-left: 2.5px;
    margin-top: 15px;
}


.catpic { 
    height: 110px;
    width: 110px;
    padding-left: 32.5px;
    padding-right: 32.5px;
    padding-top: 32.5px;
    padding-bottom: 32.5px;
    display: block;
}

.catpicmini { 
    height: 55px;
    width: 55px;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 16px;
    padding-bottom: 16px;
    /*display: block;*/ 
}

#left_main {

	float: left;
    width: 280px;
	margin-left: 10px;
	padding-bottom:16px;
    border: 1px solid; 
}

#show_tn{

    /*width: 875px;*/
	border: 1px solid;
	margin-left: 308px;
	margin-right: 10px;

}

#indlabel {

    color: #bdbdbd;   
    font-size: 18;
    font-family: "Arial";
    font-weight: bold;
    margin-left: 50px;
    margin-top: 60px;

}

/*#browser {

    margin-top: 10px;
    margin-left: 0px;
    height: 430px;
    width: 140px;
    display: inline-block;
    border: 1px solid;
    border-color: #bdbdbd;
    
}*/

/*
#browser_panorama {

	margin-top: 10px;
	margin-right: 10px;
	margin-left: 10px;
	height: 90px;
	border: 1px solid;
	border-color: #bdbdbd;

}*/

/*
#arrows {
	display: inline-block;
	margin-left: 20px;
	margin-bottom: 100px;
}

#arrows_horiz {

	position: relative;
	width: 230px;
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;

}

.arrowbutton {
	width: 30px;
	display: block;
}

.arrowbutton_horiz {
	height: 30px;
	display: inline-block;
}
*/

/*
.browserpic {

    height: 66.4px; POISTA
    width: 100px;
    display: block;
    margin-top: 15px;
    border: 1px solid;
    border-color: #bdbdbd;

}
*/


/*.panbrowserpic {

	position: relative;
	height: 50px;
	display: inline-block;
	border: 1px solid;
	border-color: #bdbdbd;
	margin-top: 20px;
	margin-left: 10px;

}
*/

.thumbnail {

    height: 66px;
    width: 100px;
    /*display: block;*/
    margin-top: 6px;
    margin-bottom: 6px;
    margin-left: 5.4px;
    border: 2px solid;
    border-color: #ffffff;
}

.casethumbnail {

	height: 66px;
	width: 100px;
	margin-top: 11px;
	margin-left: 16px;
}


/*
.panbrowserpic:hover {

	position: relative;
	height: 50px;
	display: inline-block;
	border: 3px solid;
	border-color: #ffffff;
	margin-top: 20px;
	margin-left: 10px;

}

.selectedbrowserpic {

    width: 100px;
    display: block;
    margin-top: 15px;
    border: 2px solid; 
    border-color: #bdbdbd;

}

.selectedpanbrowserpic {
	
	position: relative;
	height: 50px;
	display: inline-block;
	border: 2px solid;
	border-color: #bdbdbd;
	margin-top: 20px;
	margin-left: 10px;

}

.selectedbrowserpic:hover {

    width: 100px;
    display: block;
    margin-top: 15px;
    border: 2px solid; 
    border-color: #a8c3cd;

}

.selectedpanbrowserpic:hover {

	position: relative;
	height: 50px;
	display: inline-block;
	border: 2px solid;
	border-color: #a8c3cd;
	margin-top: 20px;
	margin-left: 10px;

}
*/



#view {

    position: absolute;
    width: 972px;
    /*height: 598px;*/
    right: 10px;
    top: 150px;
    display: inline-block;
	/*color: #bdbdbd;*/
	border: 1px solid;

}

#view_panorama {

	width: 1802 px;
	margin-left: -300px;
	margin-top: 30px;
	
}

#viewpic {

    border: 1px solid; 
    border-color: #bdbdbd;
    width: 970px;
    /*height: 598px;*/    
}

#viewpic_panorama {

	border: 1px solid;
	border-color: #bdbdbd;
	width: 1800px;

}


/*
#infobox {
	width: 850px;
	text-align: center;

}
*/




</pre></body></html>