html, body, div, span,
h1, h2, h3, h4, h5, h6, p,
a, img, strong, ul, li {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ol, ul {
	list-style: none;
}

/* Define the focus ! */
:focus {
	outline: 0;
}



/* JONMAABEL Website Main Css */

body {
position:absolute;
width: 100%;
height: 100%;
min-width:760px;
min-height:600px;
color: #FFF;
background-color: #333;
background-image: url(jonmaabel_web_background_classic.png);
text-align: center;
font-family: "Trebuchet MS", Verdana, Arial;
}

/* TEST
-moz-box-shadow: inset 0px 0px 200px 50px rgba(100,100,100,0.7);
-webkit-box-shadow: inset 0px 0px 200px 50px rgba(80,80,80,0.7);
*/

a { text-decoration:none; }
a:link { color: #777; }
a:visited { color: #333; } 
a:hover { color: #AAA; }
a:active { color: #BBB; }
a:focus { color: #BBB; }


/* Website Root Module */

#site {
position:relative;
padding: 0 0 30px 0;
text-align: center;
color: #111;
background-color: transparent;
border-top:4px solid #111;
}


/* Main Media Module */

#display {
z-index:300;
width: 100%;
margin : 0 auto;
border-top: 1px #555 solid;
}


/* Main Media Module - Presentation */

#display_layer {
position: relative;
width: 700px;
padding: 0;
margin: 7% auto 0 auto;
}

/* Main Media Module - END */

/* Transition Module */

#transition_display_info { 
z-index:300;
position:relative;
width: 700px;
margin : 0 auto;
padding: 0;
height: 35px;
background-color: transparent;
background-image: url(../exprinit/exprinit_web_transition.png);
background-repeat: no-repeat;
background-position: top center;
}

/* Transition Module - END */

/* Information Module */

#information {
z-index:200;
position:relative;
top: 0px;
background-image: url(jonmaabel_web_background_bonus.png);
background-repeat: no-repeat;
background-position: center;
}


/* Information Module - Presentation */

#information_layer { 
z-index:300;
width: 700px;
font-size: 70%;
margin: 0 auto 5px auto;
background-color:#2B2B2B;
border: 2px solid #141414;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-moz-box-shadow: 0px 2px 30px #000;
-webkit-box-shadow: 0px 2px 30px #000;
}
html>body #information_layer {
background-color: rgba( 50, 50, 50, 0.7); 
border: 2px solid rgba( 22, 22, 22, 0.5);
}


/* Information Module - Titles  */

#information h5 {
font-size: 130%;
color:#111;
padding: 2em;
}
#information h2 { 
padding: 5px 0;
color:#555;
font-size: 160%; 
}

#information h3 {
display:inline;
padding: 3px 0;
font-size: 250%;
line-height:100%;
color: #EEE;
text-shadow: 2px 2px 1px #000;
}
html>body #information h3 {
position:relative;
top:2px;
}
#information_layer div:hover h3 { 
text-shadow: 0px 0px 10px #CCC;
}

#information_layer a { 
margin-top:3px;
padding: 0px 5px 0px 5px;
font-size: 190%;
font-weight:bold; 
border-bottom-style: solid; border-bottom-width: 3px;
color: #FFF;
background-color: transparent;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}	
#information_layer a:link { color: #888; }
#information_layer a:visited { color: #777; }
#information_layer a:hover { color: #CCC; }
#information_layer a:active { color: #999; }
#information_layer a:focus { color: #CCC;
background-color: #000;
}

#information .content_text_project-title:after { content:" :"; }
#information .content_text_project-type:after { content:" :"; }

/* Information Module - Structure */

#information_layer div { 
line-height:200%;
}
#information p { margin: 0; display:inline; }

html>body #information img { position: relative; top: 2px; }


.rub_debut , .rub_normal , .rub_end { 
margin: 0 5px 5px 5px;
padding : 17px 0 22px 20px;
border-top: 1px #111 solid;
border-left: 1px #111 solid;
border-right: 1px #111 solid;
border-bottom: 5px #111 solid;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.rub_debut { margin:10px 5px 5px 5px; }
.rub_end { margin: 0 5px 10px 5px; }

.rub_debut , .rub_normal , .rub_end {
color: #CCC;
background-color: #1D1D1D;
background-image: url(jonmaabel_web_background_div_dark.gif);
}
.rub_debut:hover , .rub_normal:hover , .rub_end:hover {
color: #EEE;
background-color: #1A1A1A;
background-image: url(jonmaabel_web_background_div_dark-hover.gif);
-moz-box-shadow: 0px 1px 3px #111;
-webkit-box-shadow: 0px 1px 3px #111;
}

.highlight {
margin: -3px -3px -3px -3px;
padding : 3px 20px 0 20px;
color: #111;
background-color: #888;
border-top: 1px #BBB solid;
border-left: 1px #BBB solid;
border-right: 1px #BBB solid;
border-bottom: 5px #BBB solid;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-moz-box-shadow: inset 0px -8px 20px #BBB;
-webkit-box-shadow: inset 0px -8px 20px #BBB;
}
/* TEST 
.highlight:hover {
color: #111;
background-color: #BBB;
border-top: 1px #DDD solid;
border-left: 1px #DDD solid;
border-right: 1px #DDD solid;
border-bottom: 5px #DDD solid;
-moz-box-shadow:  inset 0px -10px 20px #DDD , 0px 1px 3px #AAA;
-webkit-box-shadow:  inset 0px -10px 20px #DDD , 0px 1px 3px #AAA;
}
*/

/* Information Module - END */

/* Favicon Module */

html>body .favicon { position:relative; top:1px; padding:0px; margin:-2px; line-height:0; }


/* JONMAABEL Website Main Css - END */