/* CSS document for the oliotalo.fi www-page */


/****************************************************************** MAIN DIV ELEMENTS */

body {
     background: #CCCCCC url(../Images/fill.jpg) repeat 8px 0px;
     margin: 0 0 0 8px;
     padding: 0;
     border: 0;
}

* html body {
	background: #CCCCCC url(../Images/fill.jpg) repeat 8px 0px;
	margin-top: 0px;
	margin-left: 8px;
	padding-top: 8px;
}

div.main {
	background-color: transparent;
	/*width: 800px;*/
        width: 900px;
	height: 100%;
	/*margin-top: -10px;*/
        margin: -10px 0 0 0;
}

div.changing {
	background-color: transparent;
	/*width: 800px;*/
	width: 900px;
	height: 100%;
	margin-bottom: 0px;
	padding: 0px;
}

div.left {
	/* background-image: url(../Images/leftfill.gif); */
	background-color: transparent;
	/*width: 200px;*/
	width: 225px;
	/*height: 1200px;*/
        height: 600px;
	margin: 0px;
	padding: 0px;
	border: none;
	float: left;
}

div.right {
	background-color: #CCCCCC;
        /*width: 600px;*/
        width: 675px;
        height: 100%;
	margin: 0px;
	padding: 0px;
	border: none;
	float: left;
}

div.picture {
	/*height: 300px;*/
	height: 337px;
	/*width: 800px;*/
	width: 900px;
}

div.end {
	background-color: #000000;
	color: #FFFFFF;
	text-align: center;
	height: 60px;
	/*width: 800px;*/
	width: 900px;
	float: left;
        padding-top: 30px;
	margin-top: 20px;
}

* html div.end {
	margin-bottom: 0px;
	background-color: #000000;
	color: #FFFFFF;
	text-align: center;
	height: 60px;
	width: 100%;
	float: none;
	margin: 0px;
} /* IE */

div.logo {
	height: 50px;
	width: auto;
	background-color: #FFFFFF;
	/*padding-bottom: 40px;
	padding-top: 10px;*/
        padding: 10px 0 40px 0;
        margin: 0;
        border: 0;
}

div.navi {
	height: 30px;
	/*width: 800px;*/
	width: 900px;
	background-color: transparent;
	border: none;
	white-space: nowrap;
	background-image: url(../Images/menu.jpg);
	background-repeat: repeat-x;
	background-position: 0px 0px;
}

/*******************************************************************/

/******************************************************************* LANGUAGE */

a.language, a.language:link, a.language:active, a.languages:visited, language:hover { 
	border: 0px solid #000000;
	background-color: #FFFFFF;
}

img.lang {
	border: 1px solid #000000;
	height: 11px;
	width: 19px;
}

/*******************************************************************/

/******************************************************************* MENU */

#menu {
	/*width: 800px;*/
	width: 900px;
	height: 30px;
	font-family: "ITC Garamond", arial, verdana, serif;
	font-size: 9pt;
	font-style: normal;
	font-weight: bold;
	text-align: center;
	background-color: #000000;
	line-height: 26px;
}

#menu ul {
	list-style: none;
	display: inline;
}

#menu li {	
	float: left;
	height: 100%;
	/* Opera max-width for some reason */
	width: 108px;
}

#menu li a {
	float: left;
	width: 100%;
	height: 30px;
	color: #FFFFFF;
	text-decoration: none;
}

#menu li a:hover{
	background-image: url(../Images/menu.jpg);
	background-repeat: repeat-x;
	background-position: 0px 0px;
	color:#FFFFFF;
	font-weight: bold;
	font-size: 10pt;
	text-decoration: none;
	height: 100%;
	margin: 0px;
	padding: 0px;
}

/*******************************************************************/

/******************************************************************* SUB-MENU IN THE LEFT DIV */

#subMenu {
	margin-left: 5px;
	padding: 0px;
}

#subMenu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	font-family: arial, verdana, sans-serif;
	font-size: 8pt;
}

#subMenu li {
	margin: 0px 0px 1px 0px;
	width: 190px;
}

* html #subMenu li {
	width: 190px;
	margin-top: -1px;
} /* IE */

#subMenu a {
	display: block;
	margin: 0px;
	padding: 5px 10px;
	color: #FFFFFF;
	background-color: #333333;
	text-decoration: none;
	width: auto;
}

* html #subMenu a {
	width: 170px;
} /* IE */

* html #subMenu ul ul a {
	width: 135px;
} /* IE */

#subMenu a:hover {
	color: #FFFFFF;
	background-color: #666666;
	text-decoration: none;
}

#subMenu ul ul li {
	margin: 0px 0px 1px 20px;
	width: 170px;
}

#subMenu ul ul a {
	display: block;
	padding: 5px 5px 5px 30px;
	color: #FFFFFF;
	background-color: #CC3300;
	text-decoration: none;
	width: auto;
}

#subMenu ul ul a:hover {
	color: #FFFFFF;
	background-color: #FF3300;
	text-decoration: none;
}

/*******************************************************************/

/******************************************************************* USER LOCATION */

#location a:link {
	text-decoration: none;
	color: #CC3300;
}

#location a:visited {
	text-decoration: none;
	color: #CC3300;
}

#location a:active {
	text-decoration: none;
	color: #CC3300;
}

#location a:hover {
	text-decoration: underline;
	color: #CC3300;
	background-color: transparent;
}

* html #location {
	color: #333333;
	height: 20px;
	/*width: 800px;*/
	width: 900px;
	margin-top: -4px;
	background-image: url(../Images/leftfill.gif);
} /* IE */

#location {
	color: #333333;
	height: 20px;
	/*width: 800px;*/
	width: 900px;
	background-image: url(../Images/leftfill.gif);
	font-family: "ITC Garamond", arial, verdana, serif;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	white-space: nowrap;
	padding-top: 3px;
}

/*******************************************************************/

/******************************************************************* NEWSBOX AND FLAGBOX IN THE FRONTPAGE AND NEWS PAGE */

#newsBox, #flagBox {
	/*margin-left: 5px;*/
	margin-left: 10px;
	background-color: transparent;
	color: #000000;
	font-weight: bold;
	width: 180px;
	float: left;
}

* html #newsBox, #flagBox {
	background-color: transparent;
	color: #000000;
	font-weight: bold;
	width: 180px;
	float: left;
} /* IE */

#newsBox ul, #flagBox ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	height: auto;
}

.nbtop {
	height: 10px;
	width: 100%;
	background-image: url(../Images/nbtop.jpg);
	background-repeat:no-repeat;
	background-position: 0 0px;
}

.nbbot {
	height: 10px;
	width: 100%;
	background-image: url(../Images/nbbot.jpg);
	background-repeat:no-repeat;
	background-position: 0px 0px;
}

table.newstable {
	background: #FFFFFF;
	height: auto;
	width: 180px;
}

table.newstable h1 {
        color: #CCCCCC;
	font-family: arial, verdana, sans-serif;
	font-size: 11pt;
	font-style: normal;
	font-weight: bold;
        margin: 4px 7px;
}

#newsBox li, #flagBox li {
	background-image: url(../Images/arrow.gif);
	background-repeat: no-repeat;
	background-position: 0 10px;
	padding: 6px 0px 0px 30px;
	margin: 5px;
}

#newsBox li a, #flagBox li a {
	color: #000000;
	font-family: arial, verdana, sans-serif;
	font-size: 8pt;
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
}

#newsBox li a:hover, #flagBox li a:hover {
	text-decoration: underline;
	color: #CC3300;
}

/*******************************************************************/

/******************************************************************* RESOURCES BOX */

div.resources {
	color: #FFFFFF;
	background-color: #000000;
	width: 194px;
	height: auto;
	border: 1px #CCCCCC solid;
}

#resheader {
	color: #FFFFFF;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 12pt;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
	background-image: url(../Images/menu.jpg);
	background-repeat: repeat-x;
	background-position: 0px -3px;
	text-align: left;
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 10px;
	
}

/*******************************************************************/

/******************************************************************* HORIZONTAL NAVIGATION MENU IN PRODUCTS */

ul#navList {
	margin: 0px;
	list-style-type: none;
	float: left;
	width: 100%;
	color: #fff;
	background-color: transparent;
}

* html ul#navList {
	margin-left: 20px;
	list-style-type: none;
	float: left;
	width: 400px;
	color: #fff;
	background-color: transparent;
} /* IE */

ul#navList li { display: inline;}

ul#navList li a {
	float: left;
	color: #fff;
	background-color: #333333;
	padding: 5px 10px;
	text-decoration: none;
	border-right: 1px solid #FFFFFF;
}

ul#navList li a:hover {
	background-color: #666666;
	color: #FFFFFF;
}

/*******************************************************************/

/******************************************************************* OTHER USED DIVs AND PADDINGS */

div.topic {
	width: 400px;
        margin: 10px 0px 15px 30px;
}

div.logopad {
	margin-top: 5px;
	margin-left: 10px;
}

#rightup {
	background: url(../Images/corner.gif) no-repeat top left;
	background-color: #CCCCCC;
	/*width: 600px;*/
        margin: 0;
        padding: 0;
        border: 0;
}

div.leftdown {
	margin-top: 28px;
}

* html div.leftdown {
	margin-top: 28px;
	padding-left: 6px;
}

#rupad {
	margin: 0px 0px 0px 20px;
	padding: 20px 0px 20px 20px;
}

* html #rupad {
	margin: 0px 0px 20px 0px;
	padding: 20px 0px 10px 40px;
} /* IE */

#productpad { margin: 30px 0px 0px 0px; }

* html #productpad {
	margin: -7px 0px 0px 0px;
} /* IE */

#rightdown {
	margin-top: 0px;
	background-color: transparent;
	width: 100%;
        /*height: 600px;*/
}

* html #rightdown {
	margin-top: -20px;
	background-color: transparent;
	width: 100%;
	/*height: 600px;*/
} /* IE */

/* moved to .rbcontent
#rightdown h1 {
	color: #CCCCCC;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 12pt;
	font-style: normal;
	font-weight: bold;
}
*/

/*******************************************************************/

/******************************************************************* GENERAL ROUND BOX */

.rbroundbox { background: url(../Images/nt.gif) repeat; }

.rbtop div { background: url(../Images/tl.gif) no-repeat top left; }

.rbtop { background: url(../Images/tr.gif) no-repeat top right; }

.rbbot div { background: url(../Images/bl.gif) no-repeat bottom left; }

.rbbot { background: url(../Images/br.gif) no-repeat bottom right; }

.rbtop div, .rbtop, .rbbot div, .rbbot {
	width: 100%;
	height: 7px;
}

.rbcontent { margin: 0px 5px; }

.rbroundbox { 
	/*width: 540px;*/
	width: 607px;
	margin: 7px;
}

.rbcontent table {
        border-collapse: collapse;
}

.rbcontent td {
	background-color: transparent;
	color: #000000;
	font-family: arial, verdana, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	border: none;
        padding-right: 40px;
}

.rbcontent h1 {
	color: #CCCCCC;
	font-family: arial, verdana, sans-serif;
	font-size: 11pt;
	font-style: normal;
	font-weight: bold;
}

.rbcontent p {
	background-color: transparent;
	color: #000000;
	font-family: arial, verdana, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	border: none;
}

.rbcontent ul {
	list-style-image: url(../Images/arrows.gif);
	margin-left: 0px;
        padding-left: 20px;
}

.rbcontent li {
	background-color: transparent;
	color: #000000;
	font-family: arial, verdana, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	border: none;
	margin-bottom: 10px;
}

.rbcontent a, .rbcontent a:visited {
	background-color: transparent;
	color: #000000;
	font-family: arial, verdana, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	white-space: nowrap;
	border: none;
}

.rbcontent a:hover {
	background-color: transparent;
	color: #CC3300;
	text-decoration: underline;
}

.rbimage div {
        float: right;
        /*width: 200px;*/
        width: 225px;
}

/*******************************************************************/

/******************************************************************* REFERENCES */

div.reference {
        text-align: center;
}

a.reference, a.reference:link, a.reference:active, a.reference:visited, reference:hover { 
	border: 0px solid #000000;
	background-color: #FFFFFF;
}

img.reference {
	border: 0px;
}

/*******************************************************************/

/******************************************************************* CONTACT */


#contact ul, #contactcontinued ul { list-style-type: none; }

#contact ul li, #contact a:link, #contact a:visited, #contact a:active,
#contactcontinued ul li, #contactcontinued a:link, #contactcontinued a:visited, #contactcontinued a:active {
	color: #000000;
        font-family: arial, verdana, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	text-decoration: none;
}

#contact ul li a:hover, #contact ul li a,
#contactcontinued ul li a:hover, #contactcontinued ul li a{
	text-decoration: underline;
	color: #CC3300;
}

div.pageheader {
	color: #FFFFFF;
	font-family: arial, verdana, sans-serif;
	font-size: 12pt;
	font-style: normal;
	font-weight: normal;
}

div.maxwidth { width: 400px; }

contact.img {
	width: 190px;
	height: 167px;
	border: solid 1px #CCCCCC;
	padding-left: 5px;
}

#cl img, #cl a, #cli a:link, #cl a:visited, #cl a:active, #cl a:hover {
	border: 0px solid #000000;
	background-color: transparent;
}

#contact ul a:link, #contact ul a:active,
#contactcontinued ul a:link, #contactcontinued ul a:active {
	background-color: transparent;
	color: #000000;
	font-family: arial, verdana;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	white-space: nowrap;
	border: none;
}

#contact a:hover, #contactcontinued a:hover {
	background-color: transparent;
	color: #CC3300;
	text-decoration: underline;
}

/*******************************************************************/

/******************************************************************* CSS tree1 STYLING */

#tree1 a:link, #tree1 a:visited, #tree1 a:active {
	color: #FFFFFF;
	font-family: "ITC Garamond", arial, verdana;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
}

#tree1 a:hover, #contact a {
	text-decoration: underline;
	color: #CC3300;
}

#treeNews li, #treefaq li {
	margin: 15px;
	color: #FFFFFF;
	background-color: #CCCCCC;
	border-bottom: #333333 1px solid;
	border-right: #333333 1px solid;
}

#treeNews ul li, #treefaq ul li {
	color: #000000;
	font-weight: normal;
	padding: 10px;
	border: 2px #666666 solid;
	background-color: #FFFFFF;
}

a.nl:link, a.nl:visited, a.nl:active {
	color: #000000;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	text-decoration: underline;
}

a.nl:hover {
	text-decoration: underline;
	color: #CC3300;
}

/*******************************************************************/

/******************************************************************* DOWNLOAD SECTION TABLE */

table.dlfile {
	height: 100%;
	width: 100%;
}

td.dlfiletitle {
	height: auto;
	width: 50%;
}

td.dlfilever {
	height: auto;
	width: auto;
}

td.dlfiledescr {
	height: auto;
	width: 100%;
}

td.dlfilesize {
	height: auto;
	width: auto;
}

td.dlfiledate {
	height: auto;
	width: auto;
}

td.dlfileheader {
	height: auto;
	width: auto;
	border-bottom: #333333 1px solid;
	border-right: #333333 1px solid;
	background-color: #CCCCCC;
	color: #FFFFFF;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
}

td.dlfilelink {
	height: auto;
	width: auto;
	background: url(../Images/down.jpg) no-repeat 15px 5px;
}

a.filelink {
	height: 32px;
	width: 100%;
	display: block;
}

/*******************************************************************/

/******************************************************************* GENERAL ANCHORS */

div.anchor {
           height: 35px;
           clear: both;
}

.anchor a, .anchor img {
	height: 35px;
	width: 32px;
	border: none;
	background: url(../Images/up.jpg) no-repeat bottom right;
	float: right;
}

.anchor_trt a, .anchor_trt img {
	height: 1px;
	width: 1px;
	border: none;
	background: url(../Images/pixelgif) no-repeat bottom right;
	float: right;
}

div.down { }

.down a, .down ul li {
	text-decoration: none;
	list-style: none;
}

/*******************************************************************/

/******************************************************************* PRODUCT OVERVIEW */

#overview img {
	float: right;
	/* width: 200px; */
	height: auto;
	/* border: #CCCCCC 2px solid; */
	padding: 0px;
	background-color: transparent;
	margin-top: 0px;
}

* html #overview img {
	float: right;
	/* width: 200px; */
	height: auto;
	/* border: #CCCCCC 2px solid; */
	padding: 2px;
	background-color: #FFFFFF;
	margin-top: 4px;
} /* IE */

#overview ul li {
	list-style-image: url(../Images/arrows.gif);
	margin-left: 5px;
	width: 250px;
}

/*******************************************************************/

/******************************************************************* PRODUCT FEATURES */

#features ul li ul li { }

#features ul li ul li { }

#features ul li ul li ul li { }

/*******************************************************************/

/******************************************************************* PRODUCT SPECS */

tr.odd { background-color: #FFFFFF; }

tr.even { background: #CCCCCC; }

tr.empty {
	height: 20px;
	background-color: transparent;
}

table.specs {
	height: 100%;
	width: 100%;	
}

td.specheader {
	height: 100%;
	width: 100%;
	color: #FFFFFF;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	border-right: #333333 1px solid;	
	border-bottom: #333333 1px solid;
	background-color: #CCCCCC;
	margin-top: 45px;
}

td.specname {
	height: 100%;
	width: 10%;
	text-align: left;
	float: left;
}

td.specvalue {
	height: 100%;
	width: 90%;
	text-align: left;
}

/*******************************************************************/

/******************************************************************* PRODUCT SUMMARY */

div.cuteanimal {
	height: 100%;
	width: 100%;
	color: #000000;
	font-family: "ITC Garamond", arial, verdana;
	font-size: 20pt;
	font-style: normal;
	font-weight: bold;
	text-align: left;
}

img .cuteanimal {
	height: 100px;
	width: 100px;
}

/*******************************************************************/

/******************************************************************* MISC */

#footer a, #footer span {
	color: #FFFFFF;
	font-family: arial, verdana, sans-serif;
	font-size: 8pt;
	font-style: normal;
	font-weight: normal;
	text-align: center;
	text-decoration: none;
}

b.date { color: #CC3300; }

b.date2 {
	color: #CC3300;
	font-family: arial, verdana, sans-serif;
	font-size: 11pt;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
}

div.clear {
        clear: both;
        width: 0;
        height: 0;
        border: 0;
}

/*******************************************************************/