ul, ol, li { margin: 0 0 0.5em 0; padding: 0; }
li { margin-left: 2em; }

#settings_nav { margin: 0 1em 0em 1em; padding: 0.5em 0em 0em 0em;}
#settings_nav h3 { font-size: 1em; margin:0; padding: 0 0 0.25em 0; }
#settings_nav li { font-size: 12px;}
#settings_nav ul { list-style: none; margin:0; text-align:left;}
#settings_nav li.settings_heading {  float: left; display: inline; }
#settings_nav li ul li { margin: 0 0 0.25em 0; padding: 0; clear: both; display: block }
#settings_nav li ul li span { float: left; }
#settings_nav li ul li a    { float: left; margin-left: 0.25em; }
#settings_nav li ul li em.current { float: left; margin-left: 0.25em; font-style: normal; /* font-weight: bold */ }



body {
   text-align:left;
	background-color: #FFFFFF;
}

span.style5 {
	font-size: 12px;
}

#doc {
   width:57.69em;
   *width:56.3em; /* IE */
   width:99%;
   margin:auto;
   text-align:left;
   
}





#hd {margin-bottom:1em;text-align:left;font-size:100%;font-family:arial;clear:both;}
#bd {margin-bottom:1em;text-align:left;font-size:77%;font-family:arial;clear:both;}
#ft {font-size:77%;font-family:arial;clear:both;text-align:right;}



#hd h2
{
border-bottom: dotted 1px #82C2CE;
position: relative;
}


/* rules for main templates */
.yui-t1 #yui-main .yui-b, .yui-t2 #yui-main .yui-b, .yui-t3 #yui-main .yui-b, .yui-t4 .yui-b, .yui-t5 .yui-b, .yui-t6 .yui-b {float:right;}
.yui-t1 .yui-b, .yui-t2 .yui-b, .yui-t3 .yui-b, .yui-t4 #yui-main .yui-b, .yui-t5 #yui-main .yui-b, .yui-t6 #yui-main .yui-b {float:left;}

/* t1: L160 */
.yui-t1 #yui-main .yui-b {width:76%;min-width:570px;}
.yui-t1 .yui-b {width:21.33%;min-width:160px;}

/* t2 & t4: L180 & R180 */
.yui-t2 #yui-main .yui-b, .yui-t4 #yui-main .yui-b {width:73.4%;min-width:550px;}
.yui-t2 .yui-b, .yui-t4 .yui-b {width:24%;min-width:180px;}

/* t3 & t6: L300 & R300 */
.yui-t3 #yui-main .yui-b, .yui-t6 #yui-main .yui-b {width:57.6%;min-width:430px;}
.yui-t3 .yui-b, .yui-t6 .yui-b {width:40%;min-width:300px;}

/* t5: R240 */
.yui-t5 #yui-main .yui-b {width:65.4%;min-width:490px;}
.yui-t5 .yui-b {width:32%;min-width:240px;}

/* t7: 750 */
.yui-t7  #main .yui-b {min-width:750px;}


/*	grid-generic rules for all templates */

/* all modules and grids nested in a grid get floated */
.yui-g .yui-u, .yui-g .yui-g, .yui-ge .yui-u, .yui-gf .yui-u {
   float:right; 
   display:inline;   /* IE */ 
}

/* float left and kill margin on first for added flex */
.yui-g .first, .yui-gd .first, .yui-ge .first, .yui-gf .first {float:left; }

/* 2 col */
.yui-g .yui-u, .yui-g .yui-g {width:49.1%;}
.yui-g .yui-g .yui-u {width:48.1%;} /* smaller for nested to preserve margins */

/* 3 col */
.yui-gb .yui-u, .yui-gc .yui-u, .yui-gd .yui-u {
   float:left; /* need to reverse the order for 3 */
   margin-left:2%; *margin-left:1.895%;   
   width:32%;
}

.yui-gb .first, .yui-gc .first, .yui-gd .first {margin-left:0;}

/* colspan 2 */
.yui-gc .first, .yui-gd .yui-u {width:66%;}
.yui-gd .first {width:32%;}

/* colspan 3 */
.yui-ge .yui-u {width:24%;}
.yui-ge .first, .yui-gf .yui-u {width:74.2%;}
.yui-gf .first {width:24%;}
.yui-ge .first {width:74.2%;}

/* self clear floated parent containers */
#bd:after, .yui-g:after, .yui-gb:after, .yui-gc:after, .yui-gd:after, .yui-ge:after, .yui-gf:after {content:".";display:block;height:0;clear:both;visibility:hidden;}	
#bd, .yui-g, .yui-gb, .yui-gc, .yui-gd, .yui-ge, .yui-gf {zoom:1;} /* IE */



/*
3. Top Navigation Items
-----------------------------------------------------------------------------------------------------
*/

#supernav {
	font: 10px, arial, Lucida Grande, arial, Arial, Helvetica, Sans-Serif;
/*	position: absolute;*/
	padding: 0px 0px 10px 0px;
	width:800;
/*	padding-left: 10px; */
	margin-left: 0px;
	display: block;
	}

#supernav li {
	display: inline;
	margin: 0;
	padding: 0;
	text-transform: lowercase;
	}

#supernav a {
	font-weight: normal;
	height: 19px;	
	text-decoration: none;
	color: #660000;
/*	background: #660000;*/
	border-bottom: 0px;
	border: 1px solid #660000;
	padding: 5px 5px;
	}

#supernav a:hover {
	color: #660000;
	background: #CCCCCC;
	text-decoration: none;
	border: 1px solid #660000;
	}

#supernav #selected a {
	border: 1px solid #660000;
	background: #660000;
	color: #FFF;
	}
	
	
	
#tietoruutu {
	FONT-SIZE: 12px;
	COLOR: #000000;
	FONT-FAMILY: arial, tahoma, helvetica, arial, sans-serif;
	border: 1px dotted #760000;
	padding: 10px 10px;

}

#paivitysruutu {
	FONT-SIZE: 10px;
	COLOR: #000000;
	FONT-FAMILY: arial, tahoma, helvetica, arial, sans-serif;
	background: #DADCC0;
	border: 1px dotted #760000;
	padding: 10px;
}


/*
FORMIA VARTEN TEHTY
-----------------------------------------------------------------------------------------------------
*/


div.row {
  clear: both;
  padding: 5px;
  }

div.row span.label {
  float: left;
  width: 280px;
  text-align: right;
  }
div.row span.label_required {
  font-weight: bold;
  float: left;
  width: 280px;
  text-align: right;
  }

div.row span.formw {
  float: left;
  width: 500px;
  text-align: left;
  
  } 
div.row span.formilmo {
  float: left;
  width: 500px;
  text-align: left;
  } 
  
form fieldset legend {
  font-weight: bold;
  font-size: 120%;
}



caption#kisa {font-size: 1.7em; color: #F06; text-align: left;}
table#kisa {margin: 0; padding: 0; border-collapse: collapse; width: 100%;}
td#kisa, th#kisa { font-size: 0.9em; padding: 5px 2px; border: 1px solid #D8D8D8;}
td#kisaerror, th#kisaerror { font-size: 0.8em; color: #FF0000; padding: 5px 2px; border: 1px solid #D8D8D8;}
td#kisaok, th#kisaok { font-size: 12px; color: #007300; padding: 5px 2px; border: 1px solid #D8D8D8;}
td#kisapoista, th#kisapoista { font-size: 12px; color: #eddb15; padding: 5px 2px; border: 1px solid #D8D8D8;}
tfoot#kisa th {text-align: right;}
tr#kisa {font: 12px sans-serif; color: #000;}
tr#kisaerror {font: 12px sans-serif; color: #000;}
/*tr:hover {background: #FFF;}*/

/* testi */


.panel {
	clear: both;
	display: none;
	border: 3px solid #CCC;
	padding: 1em;
}
.panel.active-tab-body {
	display: block;
}

input.disabled {
	border: 1px solid #F2F2F2;
	background-color: #F2F2F2;
}
input:hover {
background-color:#F2F2F2;
}
textarea:hover {
background-color:#F2F2F2;
}
input.required, textarea.required {
	border: 1px solid #cccccc;
}
input.optional, textarea.optional {
	border: 1px solid #cccccc;
}
textarea.optional:focus {
background: #fff;
border: 1px solid #595959;
}
textarea.required:focus {
background: #fff;
border: 1px solid #595959;
}

input.optional:focus {
background: #fff;
border: 1px solid #595959;
}
input.required:focus {
background: #fff;
border: 1px solid #595959;
}

input.validation-failed, textarea.validation-failed {
	border: 1px solid #FF3300;
	color : #FF3300;
}
input.validation-passed, textarea.validation-passed {
	border: 1px solid #00CC00;
	color : #000;
}

.validation-advice {
	margin: 5px 0;
	padding: 5px;
	background-color: #FF3300;
	color : #FFF;
	font-weight: bold;
}

.custom-advice {
	margin: 5px 0;
	padding: 5px;
	background-color: #C8AA00;
	color : #FFF;
	font-weight: bold;
}

fieldset {
	padding: 1em;
	margin-bottom: 0.5em;
}

label {
	font-weight: bold;
}
.form-row {
	clear: both;
	padding: 0.5em;
}

.field-label {

}

.field-widget {

}


.hint {
  display:none;
  position: absolute;
  right: 30px;
  width: 200px;
  margin-top: -4px;
  border: 1px solid #c93;
  padding: 5px 6px;
  background-color: #ffc;
}


/* uusi versio intraan */
div.otsake {
/*	background: #A7B9C9 url('/intra/images/sagi_ylatausta.gif');*/
	background: #A7B9C9;
	padding: 18px 15px;
	color: #FFFFFF;
	margin: 0px 0px 15px 0px;
	font-size: 12px;
}

.otsake A:link {
	font-weight: bold;
	color: #FFFFFF;
}
.otsake A:visited {
	font-weight: bold;
	color: #FFFFFF;
}



.alert {
	background: #fff6bf url(/intra/images/exclamation.png) center no-repeat;
	background-position: 15px 50%; /* x-pos y-pos */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #ffd324;
	border-bottom: 2px solid #ffd324;
	}
	
.info {
	background: #7799DD url(/intra/images/exclamation.png) center no-repeat;
	background-position: 15px 50%; /* x-pos y-pos */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #004080;
	border-bottom: 2px solid #004080;
	}
	
.success {
	background: #A5D579 url(/intra/images/accept.png) center no-repeat;
	background-position: 15px 50%; /* x-pos y-pos */
	text-align: left;
	padding: 5px 20px 5px 45px;
	border-top: 2px solid #008000;
	border-bottom: 2px solid #008000;
	}
	
	
.SiteContainer {
	border: 1px solid #C7D3EA;
	background: #A7B9C9;
	padding: 20px 10px;
}


.SiteContainer,
.Foot {
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}

h1 {
	background: #fff url("/intra/images/SAGI-logo.jpg")  no-repeat;
	margin:0 auto;
	width: 280px;
	height: 80px;
	font-style: italic;
}
h1 a {
	position: relative;
	display: block;
	top: 10px;
	left: 0;
}
h1 a span {
	display: none;
}

/* Various page widths */
.SignIn { width: 280px; }
.PasswordRequest { width: 500px; }
.PasswordRequest .PageTitle{ width: 492px; }
.SignOut { width: 400px; }
.Apply { width: 580px; }
.PasswordReset { width: 550px; }

/* Sign-In Page */

#Form.SignInForm fieldset {
	padding: 0px 6px 0px 6px;
	}
#Form.SignInForm .Submit {
	padding: 6px 0px 0px 0px;
	clear: left;
	text-align: center;
	}

#Form.SignInForm form {
	margin: 0px;
	padding: 6px 1px 6px 6px;
	}
#Form.SignInForm ul,
#Form.SignInForm ul li {
	list-style: none;
	margin: 0px;
	padding: 0px;
	}
#Form.SignInForm ul li {
	padding-bottom:6px;
	}
#Form.SignInForm label {
	text-align: right;
	display: block;
	width: 35%;
	float: left;
	margin-right: 8px;
	color: #fff;
	}
#Form.SignInForm input {
	width: 50%;
	}
#Form.SignInForm .Submit {
	clear: left;
	padding: 6px 0px 0px 10px;
	}
#Form.SignInForm .Button {
	font-family: Trebuchet MS, Verdana, Tahoma, Arial;
	background: #E6B100;
	border: 1px solid #fff;
	color: #fff;
	font-weight: bold;
	text-align: center;
	font-size: 13px;
	cursor: pointer;
	padding: 0 5px;
	width: auto;
	}

#Form.SignInForm fieldset {
	border: 0px;
	margin: 0px;
	padding: 0px 6px 6px 6px;
	}

.ForgotPasswordLink {
	position: absolute;
	z-index:100;
	}


a.tooltip{
    position:relative; /*this is the key*/
    z-index:24;
    color:#AE0000;
    text-decoration:none}

a.tooltip:hover{z-index:25; }

a.tooltip span{display: none}

a.tooltip:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #000;
    background-color:#A7B9C9; color:#000;
    text-align: center}
    
    
body{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;}





/* ---------------------- */
/* NAV BAR 				  */

#navbar{
	background:url(/intra/images/SAGI-logo.jpg) no-repeat;
	height:80px;
	line-height:80px;
}
	#navbar ul, #navbar li, 
	#navbar form,
	#navbar button {
		border:0; margin:0; padding:0; list-style:none;
	}
	#navbar li a{
		margin:0 6px;
		text-decoration:none;
		color:#000000;
		font-weight:bold;
		border-bottom:dotted 1px #000000;
	}
	#login_menu{
		background:#aaaaaa;
		border:solid 1px #666666;
		width:400px;
		padding:10px;
		color:#FFFFFF;
		position:absolute;
		font-weight:bold;
		font-size:12px;
		line-height:18px;
	}
	#login_menu li{
		padding-bottom:6px;
		text-align:right;
	}
	#new-user-col{
		padding-right:10px;
		border-right:1px #DEDEDE solid;
		height:120px;
		width:100px;
		float:left;
		line-height:12px;
	}
	#signup-user-col{
		padding-left:20px;
/*		height:120px; */
		width:240px;
		float:left;
		line-height:12px;
		text-align:right;
	}
	#login_menu label{font-size:11px; font-weight:normal;}
	#login_menu input{font-size:11px; color:#333333; margin-left:10px;}
	
	#login_menu button{
		line-height:24px;
		float:right;
		color:#FFFFFF;
		font-size:11px;
		font-weight:bold;
		text-align:center; 
		cursor:pointer;
	}

	.green-button{
		background:url(/intra/images/button.gif);
		display:block;
		color:#FFFFFF;
		font-size:11px;
		text-decoration:none;
		width:100px;
		height:26px;
		line-height:24px;
		text-align:center;
	}
	
	.spacer{clear:both; height:1px;}