/* schooladmin Cascading Style Sheet 	  													*/

body, html
{
	font-family: Arial, Verdana;
	color: #666666;
	background-color: #F0F0F0;
	background-image: none;
	margin: 0;
	padding: 0;
}

form
{
	min-width: 960px;
}

A:LINK
{
	color: #3366CC;
}

A:ACTIVE
{
	color: #3366CC;
}

A:VISITED
{
	color: #3366CC;
}

SELECT, TEXTAREA, INPUT
{
	font-family: Arial, Verdana;
}

input[type="text"] 
{ 
	border: solid 1px #0071C6;
}

input[type="password"] 
{ 
	border: solid 1px #0071C6;
}
textarea 
{ 
	border: solid 1px #0071C6;
}

.buttonDefault
{
	background: #0071C6;
	border: solid 1px #0071C6;
	font-family: Arial, Verdana;
	font-size: 12px;
	color: #ffffff;
	height: 20px;
}

.buttonDefault:hover
{
	background: #CEE7F7;
	border: solid 1px #94C3E7;
	font-family: Arial, Verdana;
	font-size: 12px;
	color: #9CA2A5;
	height: 20px;
}


.button
{
	background: #FFFBFF;
	border: solid 1px #9CA2A5;
	font-family: Arial, Verdana;
	font-size: 12px;
	color: #9CA2A5;
	height: 20px;
}
.button:hover
{
	background: #CEE7F7;
	border: solid 1px #94C3E7;
	font-family: Arial, Verdana;
	font-size: 12px;
	color: #9CA2A5;
	height: 20px;
}

/* breedte van de pagina */
.Balk
{
	margin: 0 auto;
	padding: 0;
	
	
}

/****** gebruikersnaambalk ******/
.gebruikerbalk
{
	float: right;
	padding-right: 12px;
	padding: 6px 10px;
	color: #FFFFFF;
}

/****** titelbalk ******/

#navigation
{
	position: fixed;
	top: 0;
	width: 100%;
}

/* hoogte titelbalk */
#Top
{
	background-image: none;
	background-color: #0071C6;
	height: 110px;
	margin-left: auto;
	margin-right: auto;
	background-repeat: no-repeat;
	background-position: right bottom;
}

#Tijd
{
	float: right;
	padding-right: 250px;
	padding-top: 20px;
	width: 100px;
	overflow: hidden;
}

#InfoBalkRechts
{
	float: right;
	padding-left: 12px;
	overflow: hidden;
	width: 160px;
}

#InfoBalkLinks
{
	float: left;
	padding-right: 12px;
	overflow: hidden;
	width: 160px;
}


#TopBalkTitel
{
	float: left;
	padding-top: 14px;
	width: 70%;
	overflow: hidden;
}

.TopBalkTitelTekst
{
	font-family: Arial, Verdana;
	font-size: 240%;
	font-weight: bold;
	color: #ffffff;
	letter-spacing: -2px;
	line-height: 100%;
}

.versie
{
	font-size: 80%;
}

/****** knoppenbalk ******/

#KnopBalk
{
	clear: both;
	margin: 0;
	width: 100%;
	height: 28px;
	background-color: #0071C6;
	border-top: solid 3px #ffffff;
	border-bottom: solid 0px #ffffff;
	padding: 0;
	font-size: 100%;
}

#KnopBalk .Common
{
	border-left: solid 1px #4A9ED6;
}

#KnopBalk .Common .Inner
{
	border-left: solid 1px #4A9ED6;
	height: 1%;
	border-color: #4A9ED6;
}

#KnopBalkShadow
{
	clear: both;
	margin-bottom: 12px;
}

#KnopBalk ul
{
	list-style-type: none;
	padding: 0;
	display: block;
	margin: 0;
}

#KnopBalk ul li
{
	display: block;
	float: left;
	padding: 0;
}

#KnopBalk a:link, #KnopBalk a:active, #KnopBalk a:visited
{
	text-decoration: none;
	display: block;
	padding: 6px 10px;
	color: #FFFFFF;
}

#KnopBalk a:hover
{
	text-decoration: none;
	display: block;
	padding: 6px 10px;
	background-color: #4A9ED6;
}

#KnopBalk a.Selected:link, #KnopBalk a.Selected:active, #KnopBalk a.Selected:visited
{
	color: #0071C6;
}

#KnopBalk a.Selected:hover
{
	color: #0071C6;
}

/* donkere schaduw van knop */
#KnopBalk .Common, #KnopBalk a:link, #KnopBalk a:active, #KnopBalk a:visited, #KnopBalk a:link, #KnopBalk a:active, #KnopBalk a:hover
{
	border-color: #40606F;
}

#KnopBalk a.Selected:link, #KnopBalk a.Selected:active, #KnopBalk a.Selected:visited
{
	color: #FFFFFF;
}

/****** menu ******/
.menuLink
{
	font-size: 9pt;
	font-family: Arial, Verdana;
	color: #40606F;
	text-decoration: none;
	background-color: transparent;
	padding: 2px;
}

/****** subMenuLink ******/
a.submenuLink
{
	font-size: 13pt;
	font-family: Arial, Verdana;
	color: #636563;
	text-decoration: none;
	background-color: transparent;
	padding: 0px 5px 0px 5px;
}

a.submenuLink:link, a.submenuLink:visited
{
	color: #636563;

}

a.submenuLink:hover, a.submenuLink:active
{
	color: #0071C6;
}


/****** breadcrumb ******/

.BreadCrumbArea
{
	margin: 0;
	padding: 4px 0;
	font-size: 85%;
	border-bottom: solid 1px #bbb;
	background-color: #F7F7F7;
	color: #000000;
	height: 12px;
}

/****** titel ******/
.Paginatitel
{
	color: #0071C6;
	font-size: 150%;
	font-family: Arial, Verdana;
	letter-spacing: -1px;
	font-weight: bold;
	padding: 0;
	margin: 5px;
}

/****** pagina ******/
.InfoBalk
{
	background-color: #FFFFFF;
	border-top-color: #0071C6;
	border-top: solid 3px #0071C6;
	padding: 6px;
	margin: 0 0 12px 0;
	height: 1%;
	color: #333333;
	border-bottom-color: #0071C6;
	font-family: Arial, Verdana;
	
}

.InfoBalkHeader
{
	padding: 0 0 5px 0;
	border-bottom: solid 1px #ccc;
	margin: 0 0 5px 0;
	color: #333333;
	font-size:x-large;
}

.InfoBalkFooter
{
	font-weight: bold;
	font-size: 80%;
	padding: 0 3px;
}

.InfoBalkContent
{
	padding: 0 3px 15px 3px;
	font-size: 90%;
	
}


#InfoBalkMidden
{
	margin: 0;
	padding: 0;
	height: 1%;
	
}



.datagridHeader
{
	background-color: #0071C6;
	color: #FFFFFF;
	text-align:left;
	padding: 10px;
	font-family: Arial, Verdana;
	font-size: 100%;
	height:40px;
}

.datagridItem
{
	text-align: left;
	padding: 10px;
	font-family: Arial, Verdana;
	font-size: 95%;
	background-color: #ffffff;
	height:25px;
	vertical-align: 2px;
}

.datagridItemAlternate
{
	text-align: left;
	padding: 10px;
	font-family: Arial, Verdana;
	font-size: 95%;
	background-color: #EFF0F1;
	height:25px;
	vertical-align: 2px;
	
}

.GrootUurrooster {
  border: 1px solid #0071C6;
  border-collapse: collapse; 
  }

.GrootUurrooster th {
  width: 55px; 
  border: 1px solid #0071C6;
  background-color: #0071C6; 
  color: #FFFFFF;
  height:40px;
  }
  
.GrootUurrooster td {
  width: 55px; 
  border: 1px solid #0071C6;
  border-spacing: 0px;
  
  }
  


.uitschuifmenuTitel
{
	text-align: left;
	padding: 5px;
	font-weight: bold;
	background-color: #95B2BF;
}

#Footer
{
	background-image: none;
	background-color: #F7F7F7;
	font-size: 80%;
	text-align: center;
	font-weight: bold;
	color: #0071C6;
}



/****** invulformulier ******/

.invulformuliertekst
{
	color: #666666;
	text-align: left;
	padding: 4px;
	font-family: Arial, Verdana;
	font-size: 100%;
	vertical-align: top;
}

/****** popup ******/
.popup
{
	background-color: #fff;
	padding: 1em 6px;
	border-top-color: #0071C6;
	border-top: solid 3px #0071C6;
}

.modalPopupBackground
{
	background-color: #000;
	filter: alpha(opacity=70);
	opacity: 0.7;
}


/*--- DROPDOWN ---*/

#nav{
	position:relative;
	z-index:5;
}


#nav ul{
	background:#fff;			/* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	top: 22px;
	left:-9999px;				/* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li
{
	padding-top:0px;			/* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
#nav ul a{
	white-space:nowrap;			/* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{				/* Display the dropdown on hover */
	left:0;	
							
}
#nav li:hover a{				/* kleur subknop */
	background:#FFFFFF;
	color:#636563;
	width:300px;
		

}
#nav li:hover ul a{				/* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
}
#nav li:hover ul li a:hover{	/* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#EFF3F7;
}