@charset "UTF-8";
/* CSS Document */

html{
	margin: 0;
	padding: 0;
	}

body{
	background: #F3F3F5;
	margin: 0;
	padding: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans serif;
	font-size: 12px;
	}

a:active{
	text-decoration: none;
	margin: 0;
	padding: 0;
	}

a:link{
	text-decoration: none;
	margin: 0;
	padding: 0;
	}

a:hover{
	text-decoration: underline;
	margin: 0;
	padding: 0;
	}

a:visited{
	text-decoration: none;
	margin: 0;
	padding: 0;
	color: #0066CC;
	}

h1, h2, h3, h4, h5, h6{
	padding: 0;
	margin: 0;
	}
	
.red{
	color: red;
	}

h1{
	color: #333;btn
	font-family: "Helvetica Neue", Helvetica, Arial, sans serif;
	font-weight: lighter;	
	font-size: 2em;
	line-height: 1em;
	margin-bottom: 0.2em;
	}

h2{
	color: #0066cc;
	font-weight: lighter;
	margin-bottom: 0.2em;
	}

h3{
	color: #333;
	font-size:1em;
	margin:0.8em 0;
	}

h4{
	color: #333;
	margin:0 0 0.8em;
	}

h5{
	color: #333;
	margin:0.8em 0;
	}

h6{
	color: #333;
	font-weight: lighter;
	margin:0.8em 0;
	}

a img{border: none;}

p{margin-top: 0;}

.clear{
	clear: both;
	}
	
anti-float{
	clear: both;
	content:".";
	height: 0;
	visibility: hidden;
	display: block;
	}
	
.bold{
	font-weight: bold;
	}
	
.lower{
	text-transform: lowercase;
	}

/*//////////////////////////////////////////////////HOME///////////////////////////////////////////////////*/

.page{
	margin: 10px auto;
	width: 830px;
	}
	
.head{
	width: 100%;
	}
	
.top-nav{
	height:100px;
	padding:5px 0;
	width:100%;
	}

.left{
	float: left;
	}
	
.right{float:right;}

.top-nav .right{
	margin:0 10px;
	}
	
.univers-peyrefitte{
	display: table;
	float: right;
	padding: 5px 0;
	width: 120px;
	}.univers-peyrefitte img{max-height: 90px; }
	
.reunions-infos{
	background: url(../images/accueil/bg-reunions-infos.png) top center no-repeat;
	height: 95px;
	width: 295px;
	float: right;
	}
	.reunions-infos a{color: #000;}
	
	.reunions-infos ul{
		margin: 0 20px;
		padding: 0;
		float: left;
		list-style: none;
		}
	.reunions-infos span{
		display:block;
		margin:8px 0 4px;
		padding:0 0 0 20px;
		}

.texte{
	display:block;
	margin: 2px 0 11px;
	text-align:center;
	}
	
.title{
	color: #222D80;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
	}
	
.btn-ecoles{
	background: url(../images/accueil/bg-ecole-superieur-acces.png) top center no-repeat;
	display: block;
	float: right;
	font-family: "Helvetica Neue", Helvetica, Arial, sans serif;
	height: 25px;
	padding: 2px 0;
	text-align: center;
	width: 103px;
	}
	
.btn-ecoles a{
	color: #fff;
	font-size: 14px;
	}
	
/*//////////////////////////////////////////////////MENU///////////////////////////////////////////////////*/

	
.nav{
	display: table;
	width: 100%;
	}
	
ul#menu{
	background: url(../images/accueil/bg-menu.jpg) repeat-x;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	}
	
ul#menu li{
	float: left;
	height: 44px;
	width: 12%;
	}
	
ul#menu li a{
	color: #ffffff;
	display: block;
	height: 44px;
	text-align: center;
	padding: 0 3px;
	line-height: 14px;
	font-size: 12px;
	text-transform: uppercase;
	}
	
ul#menu li a:hover{
	background: url(../images/accueil/bg-menu-hover.jpg) repeat-x;
	}
	
ul#menu li.btn1 a{
	padding: 0 1px;
	}
	
ul#menu li.btn5 a, ul#menu li.btn6 a{
	padding: 6px 0 3px;
	}
	
ul#menu li.btn1{
	padding: 1px 0; 
	width: 30px;
	}
	
ul#menu li.btn5{
	padding: 1px 0; 
	width: 120px;
	}
	
ul#menu li.btn7{
	padding: 1px 0; 
	width: 115px;
	}
	
ul#menu li.btn1 a:hover{
	background: none;
	}
	
ul#menu li.btn2 a, ul#menu li.btn3 a, ul#menu li.btn7 a, ul#menu li.btn8 a{
	padding: 14px 0 0;
	height: 30px;
	}
	
ul#menu li.btn4 a, ul#menu li.btn9 a{
	padding: 6px 0;
	height: 38px;
	}
	
ul#menu li.btn6{
	width: 10%;
	}
	
ul#menu li.btn9{
	width: 144px;
	}
	

	
/*//////////////////////////////////////////////////sidebar///////////////////////////////////////////////////*/
	
.sidebar{
	float: left;
	margin: 20px 0;
	width: 180px;
	}
	
.sidebar .middle{
	background: url(../images/accueil/middle-sidebar-debouches.png) repeat-x top;
	height: 200px;
	}
	
.sidebar .top{
	margin: 0;
	}
	
.sidebar h2{
	color: #fff;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-size: 16px;
	text-align: center;
	text-transform: uppercase;
	}
	
.sidebar h3{
	background: #0071B4;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin-top: 10px;
	margin-bottom: 20px;
	padding: 2px 0 2px 25px;
	text-transform: uppercase;
	}
	
.sidebar ul{
	margin: 0;
	padding-left: 25px;
	list-style: none;
	}
	
.sidebar ul li a{
	color: #FFF;
	font-size: 12px;
	padding: 2px 0;
	font-weight:bold;
	}
	
.sidebar ul li a:hover{
	text-decoration: underline;
	}
	
.zoom{
	background: url(../images/accueil/zoom.png) top center no-repeat;
	height: 300px;
	margin: 10px 0 0;
	width: 180px;
	}
	
.zoom h1{
	color: #fff;
	font-size: 21px;
	padding: 200px 40px 0;
	text-align: center;
	}
	
/*//////////////////////////////////////////////////Content///////////////////////////////////////////////////*/
	
.content{
	float: right;
	margin: 20px 0;
	width: 75%;
	}
	
.vignettes{
	height: 139px;
	float: left;
	width: 290px;
	padding:  10px 5px 5px;
	}
	
.vignettes h1{
	font-size: 16px;
	text-transform: uppercase;
	line-height: 18px;
	font-weight: bold;
	text-shadow: 1px 1px 1px #333;
	}
	
.vignettes h3{
	font-size: 14px;
	text-transform: uppercase;
	line-height: 18px;
	margin: 3px 0;
	}
	
.vignettes p{
	font-size: 13px;
	letter-spacing: 0;
	}
	
.vignettes.item3 h1 a, .vignettes.item4 h1 a, .vignettes.item5 h1 a{
	margin-top: 10px;
	color: #FFFFFF;
	}
	
.vignettes h1 a, .vignettes h3 a, .vignettes h4 a, .vignettes p{
	width: 85%;
	color: #fff;
	}
	
.vignettes p{margin-top: 0;}

.vignettes.item10{
	background:none;
	height:154px;
	padding:0;
	width:191px;
	}
	
.vignettes.item11{
	background: url(../images/accueil/univers-ecole-peyrefitte.png) top center no-repeat;
	}
	
.vignettes.item1{
	background-color: transparent;
	margin-left: -5px;
	/*background: url(../images/accueil/coiffeur-studio-formation.png) top center no-repeat;*/
	}
	
.vignettes.item2{
	background: url(../images/accueil/bachelor-management-marketing-evenementiel.png) top center no-repeat;
	}
	
.vignettes.item2 h1 a{
	margin-top: 10px;
	}
	
.vignettes.item2 h3{
	color: red;
	}
	
.vignettes.item3{
	background: url(../images/accueil/negociations-vente-tourisme.png) top center no-repeat;
	}
	
.vignettes.item3 h1{
	width: 50%;
	}
	
.vignettes.item3 p{
	margin-bottom: 5px;
	}
	
.vignettes.item4{
	background: url(../images/accueil/concept-pedagogique-metiers-sport.png) top center no-repeat;
	}
	
.vignettes.item4 h1 a{
	color: #0071B4;
	text-shadow: 1px 1px 1px #FFFFFF;
	}
	
.vignettes.item4 h1{
	margin: 10px 10px 0;
	}
	
.vignettes.item4 h3{
	font-size: 11px;
	font-weight: bold;
	margin: 20px 0 0 10px;
	width: 100%;
	color: #000;
	}
	
.vignettes.item5{
	/*background: url(../images/accueil/conseiller-image-formation.png) top center no-repeat;*/
	background-color: transparent;
	}
	
.vignettes.item5 h1 a{
	margin-top: 10px;
	}
	
.vignettes.item5 h4{
	color: #FFFFFF;
	margin-top: 10px;
	}
	
.vignettes.item5 p{
	color: #fff;
	line-height: 13px;
	margin:0 0 5px;
	}
	
.vignettes.item6{
	background: url(../images/accueil/metiers-sport-securite-educateur.png) top center no-repeat;
	}
	
.vignettes.item6 h1 a{
	margin-top: 10px;
	text-shadow: 1px 1px 1px #333;
	color: red;
	}
	
.vignettes.item6 p{
	font-weight: bold;
	line-height: 13px;
	color: #000;
	padding: 0;
	}
	
.vignettes.item6 .boxcaption p{
	color: #fff;
	margin: 5px 0 0;
	}
	
.vignettes.item7{
	background: url(../images/accueil/cursus-peyrefitte-tourisme.png) top center no-repeat;
	}
	.vignettes.item7 h1{
		text-shadow: 2px 2px 2px #333;
		}.vignettes.item7 h1 a{color: #fff;}
	
.vignettes.item8{
	/*background: url(../images/accueil/sup-maquillage-professionnel.png) top center no-repeat;*/
	background-color: transparent;
	}
	.vignettes.item8 h1{
	margin-top: 0;
	}
	
div#no-padding{
	padding: 0;
	float: left;
	height: 150px;
	width: 191px;
	}
	
div#no-padding a:hover{
	cursor: pointer;
	}
	
/*//////////////////////////////////////////////////FOOTER///////////////////////////////////////////////////*/

.footer{
	width: 100%;
	}
	
.footer .middle{
	background: #BEC0CE url(../images/accueil/middle-formations-sport.png) bottom left no-repeat;
	width: 827px;
	}
	
#formations{
	float: left;
	width: 23%;
	padding-left: 10px;
	line-height: 0.8em;
	}
	
	#formations img{
		margin: 0 0 0 10px;
		}
		
	#formations ul{
		float: left;
		list-style: none;
		padding:0 5px;
		width: 90%;
		}
		
	#formations h3{
		color: #222d80;
		margin-bottom: 0;
		}
	
	#formations ul li a{
		color: #3B406D;
		font-size: 0.8em;
		}
		
#metiers{
	float:right;
	line-height:0.8em;
	width:40%;;
	}
	
.colonne4{
	float: left;
	width: 50%;
	line-height: 0.8em;
	
	}
	
.colonne2{
	float: left;
	width: 47%;
	display: table;
	line-height: 0.8em;
	}
	
.colonne3{
	float: right;
	width: 21%;
	}
	
.col33{
	float: left;
	margin: 0 1% 0 0;
	width: 31%;
	}	

	
.colonne2.footer ul{
	float: left;
	list-style: none;
	padding:0 5px;
	width: 100%;
	}
	
.bottom-nav ul{
	background: #77789A;
	display: table;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 827px;
	}

.bottom-nav ul li{
	height: 30px;
	margin: 0 10px;
	float: right;
	}
	
.bottom-nav ul li a{
	color: #fff;
	font-size: 13px;
	}
	
/*.colonne1 ul li a:hover,*/ .colonne3 ul li a:hover{
	text-decoration: underline;
	}

.colonne2 ul li a:hover, .colonne3 ul li a:hover{
	text-decoration: underline;
	}
	
.colonne2.footer h3{
	color: #222d80;
	margin-bottom: 0;
	}

.colonne2.footer ul li a{
	color: #3B406D;
	font-size: 0.8em;
	}
	
.colonne3 ul{
	padding: 0;
	list-style: none;
	}
	
.colonne3 ul li a{
	color: #222d80;
	font-size: 0.8em;
	}
	
.colonne3 ul h3{
	color: #222d80;
	}
	
/*/////////////////////////vignettes hover////////////////////////*/

	
			.boxgrid{ 
				/*width: 182px; 
				height: 139px;
				*/
				width: 189px; 
				height: 156px;
				float:left; 
				background:#161613; 
				overflow: hidden; 
				position: relative; 
				/*margin:25px 15px 3px 0;*/
				margin: 25px 7px 3px 0;
			}
							
			.boxcaption{ 
				float: left; 
				position: absolute; 
				height: 154px; 
				padding: 0 10px;
				width: 182px;
				top: 160px;
				background: #000;
				opacity: .5; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

 			}
			
				.vignettes.boxcaption p{
					opacity: .9; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
				margin: 5px 0 0;
					}
 				.captionfull .boxcaption {
 					top: 260;
 					left: 0;
 				}
 				.caption .boxcaption {
 					top: 220;
 					left: 0;
 				}
				
/*/////////////////////////carrousel accueil////////////////////////*/

.infos{
	font-family: "Helvetica Neue", Helvetica, Arial, sans serif;
	font-size:12px;
	color:#000;
	text-align:center;
}

.galerie{
	padding-top: 10px;
	}

/*/////////////////////////PAGE FORMATIONS////////////////////////*/

.formations .colonne2{
	display: table-cell;
	padding: 10px;
	width: 45%;
	}
	
.cont_colonne{
	border: 1px dashed #06c;
	background: #fff;
	display: table;
	}
	
.list-formations{
	clear: both;
	padding: 10px;
	width: 90%;
	}
	
.list-formations ul{
	list-style: none;
	}
	
.list-formations ul li{
	border-bottom: 1px solid #ccc;
	padding: 5px 0;
	}
	
.list-formations ul li a{
	color: #06c;
	}

/*/////////////////////////PAGE METIERS////////////////////////*/

.metiers .cont_colonne{
	padding: 10px;
	}

.list-metiers{
	clear: both;
	padding: 10px;
	width: 90%;
	}
	
.list-metiers ul{
	list-style: none;
	}
	
.list-metiers ul li{
	border-bottom: 1px solid #ccc;
	padding: 5px 0;
	width:80%;
	}
	
.list-metiers ul li a{
	color: #06c;
	}
	
/*/////////////////////////PAGE NEWS////////////////////////*/

.news{
	background: #fff url(../images/news/grille.png) bottom right no-repeat;
	border: 1px dashed #06c;
	margin: 10px 0;
	padding: 10px;
	}
	
/*/////////////////////////PAGE inscriptions////////////////////////*/
	
.inscriptions{
	background: url(../images/inscriptions/inscription.png) top center no-repeat;
	float: left;
	height: 228px;
	padding: 20px 20px 20px 10px;
	width: 168px;
	}

.informations{
	background: url(../images/inscriptions/infos-sport.png) top center no-repeat;
	float: left;
	height: 199px;
	padding: 20px 20px 20px 10px;
	width: 172px;
	}
	
.inscriptions h3, .inscriptions a, .informations h3, .informations a, .informations, .inscriptions{color: #fff;}

.inscriptions h3, .informations h3{
	font-size: 24px;
	}
	
.inscriptions a, .informations a{
	background: #06c;
	border: 1px solid; 
	display: block;
	padding: 2px;
	width: 71px;
	}
	
div.panes .tab {
	display:none;		
	padding:15px 10px;
	border:1px solid #999;
	border-top:0;
	font-size:14px;
	background: #fff url(../images/peyrefitte/bg-tabs.png) top repeat-x;
}

ul.tabs{
	border-bottom: 1px solid #999;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
	}
	ul.tabs li{
		float: left;
		width: 207px;
		}
		ul.tabs li a{
			color: #000;
			display: block;
			padding: 10px 0;
			text-align: center;
			}
			ul.tabs li a.current{
				background: url(../images/peyrefitte/repere.png) bottom center no-repeat; 	
				}
			
							
.contact{
	background:#FFFFFF none repeat scroll 0 0;
	border:1px dashed #0066CC;
	margin:20px 0;
	padding:20px;
	}
	.contact label{
		display:table;
		margin:5px auto;
		width:65%;
		}
	.contact input[type="text"]{
		border: 1px solid #333;
		float: right;
		width: 300px;
		}
	.contact input[type="button"]{
		border: 1px solid #06c;
		}
	.contact img.left{
		margin: 0 30px 0 80px;	
		}
		
		
.bloc-contact{
	float: left;
	margin:10px 5%;
	width:40%;
	}
	.bloc-contact a{
		color: #06c;
		border: 1px solid #06c;
		padding: 5px;
		}
		
.ancre h2{
	border:1px solid #0066CC;
	display:inline;
	float:left;
	margin:30px 60px 0;
	padding:5px;
	}
	.ancre a{color: #333;}
	
	.partenaires{
		margin: 0 0 0 1%;
		width: 100%;	
		}
	
	.partenaires a{
		color: #06F;	
		}
	ul.partenaires{
		list-style: none;
		margin: 0; 
		padding: 0;
		}
		ul.partenaires li{
			background:#FFFFFF none repeat scroll 0 0;
			border:1px solid #CCCCCC;
			margin:5px;
			padding:5px;
			width:45%;
			float:left;
			}
			ul.partenaires li img{
				margin: 5px 10px 5px 0;
				max-width:80px;
				max-height:80px;
				}
		
.bloc-demande{
	background:#FFFFFF none repeat scroll 0 0;
	border:1px dashed #0066CC;
	margin:20px 0;
	padding:20px;
	}
		
	.bloc-demande label{
		display:table;
		margin:5px auto;
		width:65%;
		}
	.bloc-demande input[type="text"]{
		border: 1px solid #333;
		float: right;
		width: 300px;
		}
	.bloc-demande input[type="button"]{
		border: 1px solid #06c;
		}
		
	.bloc-demande input[type="radio"]{
		margin: 0 30px 0 100px; 
		}
	#etab, #form, #diplome{width: 200px;}
	
.flash{
	float: left;
	height: 150px;
	margin:25px 15px 3px 0;
	width: 190px;
	}
	
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */	
	width:675px;		
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

.simple_overlay .close { 
    background-image:url(../images/accueil/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

#triggers a img{cursor: pointer;}

.underline{
	text-decoration:underline;
}

.gallery{
	list-style: none; 
	}

.gallery li{
	border:1px solid #CCCCCC;
	float:left;
	margin:5px;
	}
	
.gallery li a{
	display: block;
	margin: 5px;
	}
	
.gallery a img{
	height: 60px;
	}
	
#malette{width: 169px;}
#buste{
	margin:0;
	width:100px;
	}
#pinceau{margin: 18px 0 -12px;}

#boutique .text{
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background:#FFFFFF none repeat scroll 0 0;
	border:1px solid #A5027D;
	min-height:100px;
	padding:10px;
	}
	
#boutique .txt{
	text-align: center;
	font-weight:bold;
	color:#A5027D ;
	font-size:16px;
	}
	
/* galerie photos */

.scrollable .items,.scrollable2 .items {
width:20000em;
position:absolute;
float:left;
}

.scrollable2 {
position:relative;
overflow:hidden;
height:170px;
}

#image_wrap {
width:550px;
text-align:center;
background-color:#efefef;
border:2px solid #fff;
outline:1px solid #ddd;
-moz-ouline-radius:4px;
margin:15px 0 15px 33px;
padding:15px 0;
}

#image_wrap img {
max-width:500px;
max-height:400px;
}

.scrollable2 {
position:relative;
overflow:hidden;
width:550px;
height:100px;
border:1px solid #ccc;
background:url(../images/h300.png) repeat-x;
float:left;
}

.scrollable2 img {
float:left;
background-color:#fff;
border:1px solid #ccc;
cursor:pointer;
-moz-border-radius:4px;
-webkit-border-radius:4px;
margin:10px 5px;
padding:2px;
}

.scrollable2 .active {
border:2px solid #000;
z-index:9999;
position:relative;
}

a.browse {
background:url(../images/hori_large.png) no-repeat;
display:block;
width:30px;
height:30px;
float:left;
cursor:pointer;
font-size:1px;
margin:20px 3px;
}

a.right {
background-position:0 -30px;
clear:right;
margin-right:0;
}

a.left {
margin-left:0;
}


.items img {
max-height:80px;
max-width:100px;
}