/* WIDTH CALCULATION


Screen         1024
IE & margins    -34 Scrollbar, left padding, borders etc.
-------------------
Reunus          990 If more, then doesn't fit IE7 page & horinzontal scroll bar added
Navigation     -180
Extra           -28 Max width of sisalto in IE6 is 782 meaning min extra is -28
Sisalto actual  782

sisaltoNonNavi = sisalto + navi = 782 + 180 = 962

Screen          800
IE              -34 Scrollbar, left padding, borders etc. with below seetings in body
-------------------
Reunus          766
Navigation     -180
Extra           -28  
Sisalto actual  558

*/

/* General styles applied on all pages */

body {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	background: #fff;
	margin-top: 3px;
	margin-left: 7px;
}

input[type="text"] { 
    font: 11px Arial, sans-serif;
    color: #000;
}

input[type="button"] { 
    font: 10px Arial, sans-serif;
    color: #000;
}

input[type="submit"] { 
    font: 10px Arial, sans-serif;
    color: #000;
}

textarea {
    font: 11px Courier New, sans-serif;   
}

select {
    font: 11px Arial, sans-serif;
    color: #000 ;
}

a {
	font: 11px Verdana;
	text-decoration: underline;
	color: #00f;
}
a:link {
	font: 11px Verdana;
	text-decoration: underline;
	color: #00f;
}
a:hover {
	font: 11px Verdana;
	text-decoration: underline;
	color: #f00;
}

/* Master pages main elements */

#screen-front {
	width: 766px;
	background: #fff;
	border: 1px solid #e0e0e0;
	margin-right: auto;
	margin-left: auto;
}

#content-front {
	width: 558px;
	min-height: 440px;
	height: auto !important;
	height: 440px;
	float: left;
	padding-top: 15px;
	padding-left: 15px;
}

#upperBlock-front {
	height: 125px;
    background: #e2e2e2 no-repeat left top;
	position: relative;
	top: 0px
}

#login_info-front {
	background: #fff;
	position: absolute;
	right: 4px;
	bottom: 18px;
	border: 2px solid #7f7f7f;
}

#siteTypeInfo-front {
    height: 35px;
    position: absolute;
    left: 175px;
    top: 25px;
    border-top: 1px solid #888;
    border-left: 1px solid #888;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

#navigation-front {
	width: 170px;
	background: #fff;
	float: left;
	padding-top: 5px;
	padding-bottom: 3px;
	border-right: 1px solid #e0e0e0;
	border-bottom: 1px solid #e0e0e0;
}

#screen {
	width: 990px;
	background: #fff;
	border: 1px solid #e0e0e0;
	margin-right: auto;
	margin-left: auto;
}

#content {
	width: 792px;
	min-height: 440px;
	height: auto !important;
	height: 440px;
	float: left;
	padding-top: 15px;
	padding-left: 15px;
	padding-bottom: 5px;
}

#upperBlock {
	height: 125px;
    background: #e2e2e2 no-repeat left top;
	/* border-bottom: 1px solid #000; */
	position: relative;
	top: 0px
}

#login_info {
	background: #fff;
	position: absolute;
	right: 12px;
	bottom: 20px;
	border: 2px solid #7f7f7f;
}

#siteTypeInfo {
    height:35px;
    position: absolute;
    left: 215px;
    top: 25px;
    border-bottom: 0px solid #fff;
    border-top: 1px solid #888;
    border-left: 1px solid #888;
    border-right: 1px solid #fff;
}

#navigation {
	width: 170px;
	background: #fff;
	float: left;
	padding-top: 0px;
	padding-bottom: 0px;
}

#content-nonavi {
	width: 962px;
	float: left;
	padding: 5px;
}

#help_button {
    position: absolute;
	right: 265px;
	bottom: 20px;
}

/* FrontMaster navigation */

.frontnavilink {
    font: 11px Verdana;
    padding-top: 2px;
	padding-bottom: 3px;
}
a.frontnavilink {
    text-decoration: none;
    color: #00f;
}
a.frontnavilink:hover {
    color: #f00;
}

/* MasterPage navigation */

#naviBottom {
    width: 160px;
    padding-top: 3px;
    padding-left: 5px;
    border-top: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

.naviheaderlink {
    font: 11px Verdana;
    font-weight: bold;
    padding-top: 2px;
	padding-left: 3px;
	padding-bottom: 2px;
	min-width: 162px;
	width: 162px !important;
	/* border-left: 1px solid #e0e0e0; */
	border-top: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	/* border-bottom: 1px solid #e0e0e0; */
}

a.naviheaderlink {
    font: 11px Verdana;
    font-weight: bold;
    text-decoration: none;
    color: #00f;
}
a.naviheaderlink:hover {
    font: 11px Verdana;
    font-weight: bold;
    color: #f00;
}
    
.navilink {
    font: 11px Verdana;
    padding-left: 5px;
    padding-bottom: 2px;
    min-width: 160px;
    width: 160px !important;
    border-right: 1px solid #e0e0e0;
}

a.navilink {
	text-decoration: none;
	color: #00f;
}

a.navilink:hover {
	text-decoration: underline;
	color: #f00;
}

/* Master pages bottom block */

#alatunniste {
    clear: both;
    height: 35px;
    background: #e2e2e2 no-repeat left top;
	border-top: 1px solid #e0e0e0;
	padding-right: 0px;
	padding-left: 0px;
	padding-top: 0px;
}
/* this is likely to be unnecessary in #copyright and cause problems in Chrome/IE8
float: right;
 */
    
#copyright {
	position: relative;
    bottom: 26px;
	padding-right: 20px;
	text-align: right;
	font-size: 10px;
	color: #666;
}

#copyright a, #copyright a:link, #copyright a:hover {
	color: #666;
}

/* Login page */

.etulaatikko {
	background: #e2e2e2;
	width: 520px;
	border: 4px solid #7f7f7f;
	margin: 10px;
	min-height: 130px;
	height: auto !important;
	height: 130px;
	position: relative;
}
.laatikko_vasen {
	float:left;
	vertical-align: top;
	padding: 5px 10px;
	width: 310px;
	position: relative;
}
.etulaatikko p {
	display: inline;
}
.etulaatikko a {
	font-size: 14px;
	font-weight: bold;
	color: #3c3c3c;
}
.etu_oikea {
	vertical-align: top;
	float: right;
}
.etulaatikko h2 {
	font-size: 20px;
	color: #368707;
	margin: 0px;
}
.etu_loppu {
	clear: both;
}

/* used in Themes or directly in controls */

.labelpad {
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px
}
.commLabel {
    padding-left: 25px;
    padding-bottom: 30px;
}
.titleLabel {
    padding-left: 15px;
}
.middleAlign {
    vertical-align: middle;
}

.watermark
{
    color: Gray;
}

.modalPopUp {
    padding: 5px;
    }

.borderPanel {
    padding: 4px;
    }

.textBoxPanel {
    padding: 4xp;
    border: 1px solid #E0E0E0;
    background: #fff;
    min-height: 40px;

}

.emulationWarning {
    padding: 5px;
}
    
/* the following works even though error message here */

.modalBackground {
    background-color: #F0F0F0;
    filter: alpha(opacity=70);
    opacity: 0.7;   
    }
    
.collapsePanel {
    overflow: hidden;
    }

/* Used in PublicArea pages and Help pages */

.frontTable{
width: 554px;
}

td.frontHeaderCell
{
width: 554px;
background: #e2e2e2; 
border: 1px solid #7f7f7f;
}

td.frontWideCell{
width: 552px; 
vertical-align: top; 
border: 1px solid #7f7f7f;
padding-top: 5px;
padding-left: 5px;
}

td.frontCell{
width: 277px; 
vertical-align: top; 
border: 1px solid #7f7f7f;
padding-top: 5px;
padding-left: 5px;
}

.boxTitle {
font: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #347C17;
font-size: 16px;
background: #e2e2e2;
border: solid 1px #3c3c3c;
padding: 5px;
}

.boxHeader {
font: Verdana, Arial, Helvetica, sans-serif;
color: #347C17;
font-size: 16px;
background: #e2e2e2;
border: solid 1px #3c3c3c;
padding: 5px;
}

.frontText {
color: #3c3c3c;
}

.fronttextbox {
background: #e2e2e2;
border: solid 1px #3c3c3c;
padding: 5px;
margin-top: 10px;
margin-left: 10px;
}