
/* the overlayed element */ 
#overlay {
	width : 970px;
	margin : 0px auto 0px auto;
	padding : 0px;	
}



/* close button positioned on upper right corner */ 
#overlay .cross { 
    background-image:url("images/overlay/close.png"); 
    position:absolute; 
    right:-17px; 
    top:-10px; 
    cursor:pointer; 
    height:35px; 
    width:35px;
	z-index:10001;
}

#overlay .button {
	bottom: -40px;
	right: 0;
}

#overlay-logo {
	height: 86px;
	width: 112px;
	position: absolute;
	left: -25px;
	top: -50px;
	background: transparent url("images/logos/leerrijk-logo_overlay.png") no-repeat top left;
	z-index: 1001;
}


/*
 * login & register box
 */


#overlay-register {
    clear : both;
	float : left;
	width: 380px;
	height: 145px;
	background-color: #FFF;
	padding: 28px 38px 0 40px;
	border : 1px solid #444;
	margin : 0px 0px 20px 0px;
}

#overlay-login {
	clear : both;
	float : left;
	width: 380px;
	height: 145px;
	background-color: #FFF;
	padding: 28px 38px 0 40px;
	border : 1px solid #444;
	margin : 0px 0px 20px 0px;
}

#overlay-subscription {
	width: 380px;
	height: 145px;
	background: transparent url("images/overlay_preview/background_subscription.png") no-repeat top left;
    float   : right;
	margin : 0px 0px 0px 20px;
	padding: 30px 40px 0 40px;
}

#overlay-login h1, #overlay-register h1 {
	font-size: 22px;
}

#overlay-login form {
	padding: 10px 0;
}

#overlay-login div, #overlay-register div {
	clear: both;
	height: 36px;
}

#overlay-login input, #overlay-register input {
	width: 280px;
	background-color: #E6E6E6;
	float: right;
	border: none;
	line-height: 15px;
	padding: 4px;
}

#overlay-login.error h1, #overlay-login.error input, #overlay-register.error h2, #overlay-register.error input {
	color: #db007a;
	color: #FF0000;
}

#overlay-login label, #overlay-register label {
	float:right;
	margin-right:8px;
	padding:4px;
}

/*
 * register box only
 */

#overlay-register form {
	padding: 5px 0 10px 0;
}

/*
 * Subscription box
 */



#overlay-subscription h1 {
	font-size: 22px;
	color: #FFBD27;
}

#overlay-subscription .title {
	font-size: 22px;
	color: #FFBD27;
}

#overlay-subscription p {
	margin: 10px 0;
	color: #888;
}		

.topLink
{
    float : right;
    padding-right: 40px;
}

#overlay-subscription a {
	float: none;
	margin: 0 auto;
	position: relative;
	width: 165px;
	margin-top: 15	px;
}

#overlay.preview #overlay-content {
	width: 846px;
	margin-top: 7px;
	background: #FFF;
	padding: 30px 40px 60px 40px;
}

/*
 * no subscription box
 */

#overlay-nosubscription {
	width: 846px;
	height: 145px;
	background: transparent url("images/overlay_preview/background_nosubscription.png") repeat-y top left;
	padding: 30px 40px 0 40px;
}

#overlay-nosubscription h1 {
	font-size: 22px;
	color: #FFBD27;
}

#overlay-nosubscription .title {
	font-size: 22px;
	color: #FFBD27;
}

#overlay-nosubscription p {
	margin: 10px 0;
	color: #888;
}		

#overlay-nosubscription a {
	float: none;
	margin: 0 auto;
	position: relative;
	width: 260px;
	margin-top: 30px;
}

#overlay.preview #overlay-content {
	width: 846px;
	margin-top: 27px;
	background: #FFF;
	padding: 30px 40px 60px 40px;	
}

#overlay.preview #overlay-content table 
{
	table-layout: auto;
	border-collapse: collapse;
	border-spacing: inherit;
	empty-cells: show;
}

#overlay.preview #overlay-content table td
{
	border: thin solid #C0C0C0;
}

#overlay.preview #overlay-content table th
{
	border: thin solid #C0C0C0;
}


/*
 * full article style
 */
 
 #overlay.full
 {        
    overflow : auto;    
 }


#overlay.full .left {
	position : fixed;
	top : 430px;
	clear : both;
	float : left;
}

#overlay.full .right {
	float : right;
}

#overlay.full .button {
	position: relative;
	float: right;
	margin-top: 7px;
	bottom: 0;
}
/*
 * TOC
 */
#overlay-toc 
{
    clear : both;
    float : left;
	width: 170px;
	background: #FFF;
	padding: 45px 10px 20px 10px;		
}

#overlay-print {
	clear : both;
	width: 190px;
	height: 64px;
	background: #FFF;
	margin-top: 7px;
}

#overlay-print a {
	display: block;
	width: 140px;
	height: 24px;
	padding: 20px;
	line-height: 24px;
	color: #333;
	font-size: 16px;
	background: transparent url("images/icons/icon_print.png") no-repeat center right;
	cursor: pointer;
}

#overlay-spacer {
	height: 32px;
	width: 729px;
	background: #FFF;
	position: absolute;
	top: 0;
	right: 0;
}

#overlay.full #overlay-spacer {
	height: 32px;
	width: 729px;
	background: #FFF;
	position: relative;
}


#overlay.full #overlay-content {
	width : 649px;
	background: #FFF;
	padding: 30px 40px 60px 40px;
}

/*
 * PDF popup
 */

#overlay.PDF {
	height: auto;
}

#overlay.PDF #overlay-spacer {
	height: 32px;
	width: 100%;
	background: #FFF;
	position: absolute;
	top: 0;
	right: 0;
}

#overlay.PDF #overlay-content {
	width: auto;
	height: 700px;
	margin-top: 7px;
	background: #FFF;
	padding: 30px 0 10px 0;
}

/*
 * content metadata
 */ 

#overlay-content h1 {
	font-size: 35px;
}

#overlay-content h2 {
	font-size: 23px;
}

#overlay-content h2.header {
	background-color: #F5F1E5;
	height: 47px;
	line-height: 47px;
	padding: 0 10px;
}

#overlay-content div.meta {
	margin: 20px 0;
	padding: 20px 0;
	border-top: 1px solid #D9D9D9;
	border-bottom: 1px solid #D9D9D9;
}

#overlay-content h3 {
	font-size: 16px;
}

#overlay-content p {
	font-size: 13px;
	margin: 20px 0;
}

#overlay-content p.author {
	color: #888;
}

#overlay-content p.keywords {
	color: #888;
	margin-bottom: 0;
}
	
#overlay-content p.keywords strong {
	color: #000;	
}

/*
 * overlay content
 */

#overlay-content .Leerrijkkop1 {
	background-color: #F5F1E5;
	height: 47px;
	line-height: 47px;
	padding: 0 10px 0 20px;
	font-size: 23px;
	/* clear: both; */
	margin: 20px 0;
}

#overlay-content .Leerrijkkop2 {
	font-size: 18px;
	margin: 20px 0;
	/* clear: both; */
}

#overlay-content .Leerrijkkop3 {
	font-size: 16px;
	margin: 20px 0;
	/* clear: both; */
}


#overlay-content .basis {
	font-size: 13px;
	margin: 10px 0;
	/*float: left;*/
}

#overlay-content .bold {
	font-weight: bold;
}

#overlay-content .italic {
	font-style: italic;
}

#overlay-content .underline {
	text-decoration: underline;
}

#overlay-content .subscript {
	vertical-align: sub;
}

#overlay-content .superscript {
	vertical-align: super;
}

#overlay-content a {
	color: #c09411;
	border-bottom: dashed 1px;
}

#overlay-content a:hover {
	text-decoration: none;
	border-bottom: solid 1px;
}

#overlay-content img {
	
}

#overlay-content a.error {
	color: #F00;
	font-weight: bold;
	display: block;
	margin: 10px;
}

/*
 * content lists
 */

#overlay-content ol.decimal {
	margin: 20px 0;
	margin-left: 20px;
}

#overlay-content ol.bullet {
	margin: 20px 0;
	margin-left: 15px;
}


/*
 * numbered lists
 */

#overlay-content ol.decimal li.level_0 {
	list-style: decimal;
}

#overlay-content ol.decimal li.level_1 {
	list-style: lower-latin;
	margin-left: 20px;	
}

#overlay-content ol.decimal li.level_2 {
	list-style: disc;
	margin-left: 40px;	
}

/*
 * bulleted lists
 */

#overlay-content ol.bullet li.level_0 {
	list-style-type: disc;	
}

#overlay-content ol.bullet li.level_1 {
	list-style: circle;
	margin-left: 20px;	
}

#overlay-content ol.bullet li.level_2 {
	list-style: square;
	margin-left: 40px;
}
	
	
/* flv player */

/* styling of the container. */ 
a.flv { 
    display:block; 
    width:320px; 
	height:240px;    
    text-align:center; 
	vertical-align: middle;
    margin:20px 15px 20px 0;
	border:1px solid #999; 
	background: #fff url("images/buttons/play_large.png") no-repeat center 80%;
	
	font-size: 16px;
	color: #000; 
} 
 
/* when container is hovered we alter the border color */ 
a.flv:hover { 
    border:1px solid #000; 
}

.menuItem
{
    clear : both;
    border-bottom: 1px solid #D9D9D9;
	padding: 10px 10px;
	
}

.menuLink
{
    display : block;
}

.menuLink:hover {
	background-color: #F5F1E5;
}	

.menuItem .number {
	float: left;
	color: #4E4E4E;	
}	

.menuItem .description {
	color: #888;
	width: 125px;
	float: right;
}	

.menuItems
{
    padding-top : 20px;
}

.closeOnMenu
{
    margin-top : 20px;
    clear : both;
    padding: 10px 10px;
}












	
