/*
Name: Cours Notre Dame de France
URL: http://www.ndfrance.org
Author: Com-Ocean | http://www.com-ocean.com
Date: Octobre 2009
*/

* {outline: none;}

html {font-size: 100.01%;}

body {
	background: #FFF url(../images/bkgd_body.jpg) repeat-x 0 0;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 62.5%;
	margin: 0;
}

body#tinymce {
    background-image: none !important;
    padding: 10px;
}

h1, h2, h3, h4, h5, h6, address, blockquote, ol, p, ul {
	line-height:1.6em;
	margin: 0 0 1em;
	padding: 0;
	font-size: 1.2em;
}

button, input, select, textarea {font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 125.01%}

/* ----------------------------------------------------------------------- */
/*                             	GENERAL STYLES                             */
/* ----------------------------------------------------------------------- */
.left {float: left;}

.right {float: right;}

.clear {clear: both;}
 
 img {border: 0;}
 
.italic {font-style: italic;}

.ir {
	background-position: 0 0;
	background-repeat: no-repeat !important;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
}

.imgleft {
	float: left;
	margin: 0 10px 10px 0;
}

.imgright {
	float: right;
	margin: 0 0 10px 10px;
} 



/* ----------------------------------------------------------------------- */
/*                             	LAYOUT                                     */
/* ----------------------------------------------------------------------- */

#container {
	margin: 0 auto;
	width: 970px;
}

#header {
	height: 120px;
	margin: 0;
	width: 970px;
}

	#menus {float: left;}
	
	.logo {
		float: right;
		margin: 15px 0 0 0;
		height: 7vh;
		width: auto;
	}

#main {
	clear: both;
	margin: 0;
	min-height: 320px;
	height:auto !important;
	height: 320px;
	width: 970px;
}	

	#banner {
		height: 260px;
		width: 970px;
	}
	
		#news {
			float: left;
			width: 285px;
		}
		
		.news-list {
			height: 210px;
			padding-right: 5px;
			overflow-y: auto;
			overflow-x : hidden;
		}
		
		#carousel {float: right; height: 260px; width: 670px;}
        #carousel div.slide { float: left; position: relative; display: inline-block; }
        #carousel div.slide div {
            height: 260px;
            position: absolute;
            top: 0;
            width: 670px;
        }
        #carousel div.slide h2, #carousel div.slide h3 {
            color: #FFF;
            font-weight: bold;
            margin: 0;
        }
        #carousel div.slide div h2 {
            font-size: 45px;
            left: 15px;
            position: absolute;
            top: 15px;
            text-shadow:2px 2px 5px #333333
        }
        
        #carousel div.slide div h3 {
            bottom: 20px;
            font-size: 40px;
            position: absolute;
            right: 40px;
            text-shadow:2px 2px 5px #333333
        }
        
        #carousel #etab1 h2 {
            left: 30px;
            top: 30px;
        }
        #carousel #etab1 h3 {
            bottom: 30px;
            right: 60px;
        }
        #carousel #etab2 h2 {
            left: auto;
            right: 45px;
            top: 30px;
        }
        #carousel #etab2 h3 {
            bottom: 60px;
            left: 30px;
        }
        #carousel #etab3 h2 {
            bottom: 45px;
            font-size: 40px; 
            left: auto;
            right: 25px;
            top: auto;
        }
        #carousel #etab3 h3 {
            font-size: 50px;
            left: 25px;
            top: 15px;
        }
        #carousel #etab4 h2 {
            left: auto;
            right: 35px;
            top: 20px;
        }
        #carousel #etab4 h3 {
            bottom: 30px;
            left: 30px;
        }
        #carousel #etab5 h2 {
            font-size: 60px;
            left: auto;
            right: 115px;
            top: 100px;
        }
        #carousel #etab5 h3 {
            top: 20px;
            left: 20px;
        }
        #carousel #etab6 h3 {
            font-size: 50px;
        }
        #carousel #etab7 h2 {
            bottom: 45px;
            top: auto;
        }
        #carousel #etab7 h3 {
            left: auto;
            right: 35px;
            top: 25px;
        }
        #carousel #etab8 h2 {
            top: 60px;
        }
        
        #carousel #ecole1 h3 {
            bottom: 0px;
            right: 215px;
        }
        #carousel #ecole2 h3 {
            right: 15px;
            top: 85px;
        }
        #carousel #ecole3 h2 {
            bottom: 15px;
            top: auto;
        }
        #carousel #ecole3 h3 {
            top: 15px;
        }
        #carousel #ecole6 h2 {
            bottom: 25px;
            top: auto;
        }
        #carousel #ecole6 h3 {
            top: 15px;
        }
        
        #carousel #college1 h2 {
            top: auto;
            bottom: 10px;
        }
        #carousel #college1 h3 {
            bottom: 100px;
            right: 15px;
        }
        #carousel #college3 h2 {
            top: 120px;
        }
        #carousel #college3 h3 {
            bottom: 15px;
        }
        #carousel #college4 h2 {
            bottom: 45px;
            top: auto;
        }
        #carousel #college4 h3 {
            right: 115px;
            top: 15px;
        }
        #carousel #college6 h2 {
            bottom: 115px;
            top: auto;
        }
        #carousel #college6 h3 {
            bottom: 5px;
        }
        
        #carousel #lycee1 h2 {
            top: auto;
            bottom: 10px;
        }
        #carousel #lycee1 h3 {
            top: 10px;
        }
        #carousel #lycee2 h2 {
            top: auto;
            bottom: 90px;
        }
        #carousel #lycee3 h2 {
            top: auto;
            bottom: 10px;
        }
        #carousel #lycee3 h3 {
            top: 10px;
        }
        #carousel #lycee6 h2 {
            left: 115px;
        }
        #carousel #lycee6 h3 {
            left: 15px;
        }
	
	#content {
		margin: 0;
		padding: 0;
	}
	
	#sidebar {
		background: url(../images/bkgd_sidebar.jpg) no-repeat 0 0;
		float: left;
		margin: 0;
		padding: 10px 0;
		text-align: center;
		width: 300px;
	}
	
        #sidebar a {
            display: inline-block;
        }

        #sidebar img {
			margin: 10px 0 0;
		}
		
	#right-content {
		float: left;
		padding: 15px 0 15px 15px;
		width: 655px;
	}

#footer {
	border-top: 4px double #E0E0E0;
	clear: both;
	height: 260px;
	margin: 0 0 40px;
	padding: 10px 0 0;
	width: 970px;
}

/* ----------------------------------------------------------------------- */
/*                             	NAVIGATION                                 */
/* ----------------------------------------------------------------------- */
   
/* ------------ Navigation secondaire ------------ */

ul#second-nav {
	height: 22px;
	list-style-type: none;
	margin: 15px 0 0;
}

	#second-nav li {
		float: left;
		margin: 0 20px 0 0;
	}
	
		#second-nav li a {
			background-position: 0 0;
			display: block;
			height: 22px;
			overflow: hidden;
			text-indent: -9999em;
		}

		#second-nav li a:hover {background-position: 0 -23px;}
		
		li.second-nav-inscription a {background-image:url(../images/but_inscription.jpg); width: 74px;}
		li.second-nav-infos a {background-image:url(../images/but_infospratiques.jpg); width: 104px;}
		li.second-nav-contact a {background-image:url(../images/but_contact.jpg); width: 62px;}
		li.second-nav-accueil a {background-image:url(../images/but_accueil.jpg); width: 58px;}


/* ------------ Navigation Principale ------------ */

ul#nav {
	height: 24px;
	list-style-type: none;
	margin: 56px 0 0;
}

	#nav li {
		float: left;
		margin: 0 3px 0 0;
	}
	
		#nav li a {
			background-position: 0 -25px;
			display: block;
			height: 24px;
			overflow: hidden;
			text-indent: -9999em;
			width: 110px;
		}

		#nav li a:hover {background-position: 0 0;}
		
		li.nav-etablissement a {background-image:url(../images/nav_etablissement.jpg);}
		li.nav-ecole a {background-image:url(../images/nav_ecole.jpg);}
		li.nav-college a {background-image:url(../images/nav_college.jpg);}
		li.nav-lycee a {background-image:url(../images/nav_lycee.jpg);}
		
		#lycee li.nav-lycee a, #college li.nav-college a,#ecole li.nav-ecole a,#etablissement li.nav-etablissement a {background-position: 0 0;}

		
/* ------------ sous-navigation  ------------ */

		
#subnav {
	float: left;
	list-style-type: none;
	margin: 20px 0 10px 0;
	width: 275px;
	height: 230px;
	overflow-y: auto;
	overflow-x : hidden; 
}

	#subnav li {
		color: #808080;
		line-height: 1em;
		height: auto;
		margin: 0 0 5px 0;
	}
	
	#subnav li a {
		color: #808080;
		display: block;	
		text-decoration: none;
		width: 290px;
		border-bottom: 2px solid transparent;
		_border-bottom: 2px solid #E0E0E0;
		background-image: url("/images/arrow0.gif");
		background-repeat: no-repeat;
		background-position: 0 3px;
		padding-left: 10px;
	}

	#subnav a.head {
	  background-image: url("/images/arrow2.gif") !important;
	  background-image: none;
	}	

	#subnav a.sel {
	  background-image: url("/images/arrow1.gif");
	}

  #subnav a.headsel {
	  background-image: url("/images/arrow3.gif") !important;
	}

	#subnav li a:hover {
		border-bottom: 2px solid #333;
		color: #333 !important;
		padding-bottom: 0;
	}
	
	body#etablissement #subnav li a:hover {
		border-bottom: 2px solid #333;
		color: #333 !important;
		padding-bottom: 0;
	}

	body#ecole #subnav li a:hover {
		border-bottom: 2px solid #018440;
		color: #018440 !important;
	}

	body#college #subnav li a:hover {
		border-bottom: 2px solid #C39C15;
		color: #C39C15 !important;
	}

	body#lycee #subnav li a:hover {
		border-bottom: 2px solid #077295;
		color: #077295 !important;
	}

#subnav li ul {
	display: block;
	height: auto;
	list-style-type: none;
	margin: 5px 0 0 0;
	width: 280px;
}

	#subnav li ul li {
		color: #808080;
		font-size: 12px;
		line-height: 1em;
		height: auto;
		margin: 0 0 5px 0;
	}
	
	.subnav-etablissement li li a:hover {border: none !important;}


  body#etablissement a.sel {color: #333333 !important;}  
  body#ecole a.sel {color: #018440 !important;}  
  body#college a.sel {color: #C39C15 !important;}  
  body#lycee a.sel {color: #077295 !important;}  
  
  
/* ----------------------------------------------------------------------- */
/*                             	GENERAL TYPO                               */
/* ----------------------------------------------------------------------- */

p, ul {color: #626262;}
	
ul {padding-left: 15px;}
li { line-height: 17px;}
	
a {
	color: #808080;
	text-decoration: underline;
}

a:hover {text-decoration: none;}

h1{
	color: #333;
	font-size: 3.0em;
	font-weight:normal;
	line-height: 1.2em;
	margin: 0 0 0.5em;
}

h2 {
	color: #333;
	font-size: 2.4em;
	font-weight: normal;
}

h3 {
	color: #017AA7;
	font-size: 1.6em;
	margin: 20px 0 5px;
}

h4 {
	color: #FDB137;
	font-size: 1.6em;
	margin: 20px 0 5px;
}

h5 {
	color: #06A450;
	font-size: 1.6em;
	margin: 20px 0 5px;
}

h6 {
	color: #808080;	
	font-size: 1.4em;
	margin: 10px 0 5px;
}


/* ----------------------------------------------------------------------- */
/*                             	SPECIFIC STYLES                            */
/* ----------------------------------------------------------------------- */

/* ------------ Footer ------------ */

#coordonnees {
	height: 260px;
	float: left;
	margin: 10px 0 0;
	width: 223px;
}


.nav-footer {
	border-left:  1px solid #E0E0E0;
	height: 260px;
	float: left;
	margin: 10px 0 0 0;
	padding: 0 0 0 10px;
	width: 175px;
}

.nav-footer ul {
	list-style-type: none;
	margin: 0 0 0 10px;
	height: 300px;
}

	.nav-footer li {
		font-size: 1.1em;
		line-height: 1.6em;
	}
	
	.nav-footer li a, .nav-footer li ul li a  {text-decoration : none;}
	.nav-footer li a:hover, .nav-footer li ul li a:hover {text-decoration : underline;}
	.nav-footer li ul {
		height: auto;
		margin: 0 0 5px 10px;
	}
	
		.nav-footer li ul li, .nav-footer li ul li a {
			color: #a2a2a2;
			font-size: 0.8em;
			line-height: 1.2em;
		}

#footer h2 {margin: 0;}
	
	.h2-ecole {color: #018440;}
	.h2-college {color: #fc9f00;}
	.h2-lycee {color: #077295;}

#footer h3 {
	color: #333;
	font-size: 1.7em;
	font-weight: normal !important;
	margin: 0 0 5px;
}
		
#footer h4 {
	color: #808080;
	font-size: 1.4em;
	font-weight: normal;
	line-height: 1.2em;
	margin: 0 0 0.5em;
}

#footer p {
	color: #626262;
	line-height: 1.4em;
	margin: 0 0 0.5em;
}

/* ------------ Actualit�s home page ------------ */
.title {
	font-size: 1.8em;
	font-weight: bold;
	margin: 5px 0 10px;
}

dl.news-list {
	color: #626262;
	font-size: 1.2em;
	margin: 0;
}

.news-list dt a {
	color: #333;
	font-weight: bold;
	text-decoration: none;
}

.news-list dd {margin: 5px 0 15px;}

.news-list dd a {color: #333; text-decoration: none;}

.news-list dt a:hover, .news-list dd a:hover {text-decoration: underline;} 

/* ------------ Actualités /agenda ------------ */

.actualite {
  border-bottom: 1px solid #E0E0E0;
  margin-bottom: 15px;
}

.actualite h1 a {
	text-decoration: none;
	}

.date {
	color: #808080;
	display: block;
	float: left;
	font-size: 1.2em;
	margin : 10px 5px 0 0;
}

.actualite h1 a {
	float: left;
 	color: #007DA6;
	font-size: 0.6em;
 }
 
.actualite p {line-height: 1.5em;}

.actualite img {border: 5px solid #E0E0E0;}


/********************* Contact *********************/

#contact-content {
	float: left;
	}
 
#contact_form fieldset {
    border: none;
    padding: 0;
    margin: 0;        
}

#formulaire-contact {
  float: right;
  background-color: #E0E0E0;
  padding: 10px;
  width: 400px;
}

/*#formulaire-contact ul {list-style-type: none; padding: 0; margin: 0}*/

#formulaire-contact .form-row {float: left;padding: 0; margin: 0}

#formulaire-contact label {
  display: block;
  font-size: 11px !important;
  margin-top: 3px;
  line-height: 20px;
}

#contact_nom, #contact_prenom, #contact_email, #contact_telephone {width: 180px;}

#contact_nom, #contact_telephone {margin-right: 20px;}	

#formulaire-contact #contact_objet {
    width: 384px;
}

#formulaire-contact #contact_message {
	width: 384px;
	height: 180px;
}
	
#envoyer {
	background-color: #007DA6;
	border: none;
	cursor: pointer;
	color: #FFF;
	font-size: 1.0em;
	height: 20px;
	margin: 5px 0 5px 310px;
	text-transform: uppercase;
	width: auto;
}
.error_list {
  background-image: url("/images/error.png");
  background-repeat: no-repeat;
  padding-left: 20px !important;
  color: #cc0000;
  font-size: 0.9em;
  margin-top: 5px !important;
  margin-bottom: 0;
}

.error_list li {
  display: block;
  float: none !important;
}


/*************************** Galerie **************************/

#galerie {float: right;}
.panel-overlay {color: #ffffff;	}
.panel-overlay h2,.panel-overlay p{	margin: 1em;}
.panel-overlay p {color: #ffffff;}