@charset "utf-8";
/* CSS Document */
/* STYLE EXAMS - PHP_1 */
/* ES Laurent */
/* H#HPictures */
/* 30/11/2015 */

/* début styles */
/* GENERAL ET HOME (style global !) */
body		{	background:#fff;
				font-family:Arial, Helvetica, sans-serif;
				color:#000;
				font-size:14px;
			}
h1			{	font-size:1.3em;
				text-align:left;
			}
h2			{	font-size:1.3em;
			}
h3			{	font-size:1em;
				line-height:0.9em;
			}
h4			{	font-size:1.1em;
				line-height:0.9em;
			}
h5			{	font-size:0.8em;
				line-height:0.9em;
			}
h6			{	font-size:0.9em;
			}
header 		{}
ul,
ol			{}
strong		{	font-family:"Orator Std";}
em			{	font-family:"Orator Std";}


p			{	font-size:0.8em;
			}
cite		{}
span		{}
img			{}
audio		{}

form		{}
table		{}

aside		{}
footer		{	background:#fff;
				border:1px solid #ea9501;
				border-radius:10px;
				text-align:center;
				margin-top:25px;
			}
/* classes */
.left 		{	float:left;}
.right 		{	float:right;}
.actif		{}
.bouton		{	display:block;
				border:1px solid rgba(16,157,232,0.8);
				border-radius:5px;
			}
.borderbox	{	background:rgba(255,255,255,0.5);
				border:solid 1px rgba(16,157,232,0.8);
				border-radius:10px;
				padding:10px;
				height:auto;
				box-shadow:0 -2px 2px #000;}
.slide 		{	float:left;}
.over		{	display:block;
				overflow:hidden;
			}
/* id */
#page_php1 	{	text-shadow:none;display:block;
				border-radius:200px;overflow:hidden;background:#fff;
				border:1px solid rgba(16,157,232,0.8);
			}
#page_php1 a	 {	text-shadow:none;
			}
#page_php1 div.titre_page
			{	text-align:center;
				color:#ea9501;
			}
/*---STYLE-PAGE---*/
#top_php1 header div.menu
			{	background:rgba(255,255,255,0.5);
				border:solid 1px rgba(16,157,232,0.8);
				border-radius:10px;
				padding:10px;
				height:auto;
				box-shadow:0 -2px 2px #000;
			}
#top_php1 header div.menu
			{	margin-top:15px;
			}
#top_php1 header div.menu nav
			{	background:rgba(255,255,255,0.5);
				border:solid 1px rgba(16,157,232,0.8);
				border-radius:10px;
			}
#top_php1 header div.menu nav ul
			{	padding:10px;
			}
#top_php1 header div.menu nav ul li
			{	list-style:none;
				display:inline-block;
				padding:10px;
				border-radius:5px;
				margin-left:45px;
			}
#top_php1 header div.menu nav ul li:last-child
			{	margin-right:45px;
			}
#top_php1 header div.menu nav ul li:hover
			{	border-bottom:3px solid #000;
			}
#top_php1 header div.menu nav ul li a
			{	text-decoration:none;
				font-weight:bold;
				color:#ea9501;
				text-align:center;
				padding:10px;
				border-bottom-radius:5px;
			}
#top_php1 header div.menu nav ul li a:hover
			{	color:#fff;
				background:#ea9501;
				border-radius:5px;
				border:2px solid #000;
			}
#titre_pg
			{	
			}
#titre_pg div.grid_12 h1
			{	display:block;
				margin-top:20px;
				text-align:center;
			}
#main_php1 div.mainContent
			{	margin-left:30px;
				}
#main_php1 div.mainContent a
			{	display:block;
				text-align:center;
				border:solid 1px rgba(16,157,232,0.8);
				border-radius:5px;
				overflow:hidden;}
#main_php1 div.mainContent a div.box
			{	margin-left:100px;
			}
#main_php1 div.infos
			{	padding:10px;
				margin-top:5px;
			}
#main_php1 div.infos h3
			{	text-align:left;
				margin:5px 10px;
			}
#main_php1 div.infos h3 a
			{	display:block;
				padding:10px;
			}
#main_php1 div.infos h3 a:first-child
			{	font-style:italic;
			}
#main_php1 div.infos h6
			{	text-align:center;
				margin:10px 0;}
#moi		{}
#moi h3		{	font-style:italic;
				color: rgba(16,157,232,0.9);
				
			}
	/* style bouton TOP */
#main_php1 div.top
			{}
#main_php1 div.top a
			{	color: #FFF;
				line-height: 30px;
				text-align: center;}
#main_php1 div.top a:hover
			{	color: #EA9501;}
#main_php1 div.top a:hover span
			{	background: #FFF none repeat scroll 0% 0%;
				border: 1px dashed #EA9501;}
#main_php1 div.top a span
			{	height: 30px;
				width: 30px;
				border-radius: 15px;
				background: #EA9501 none repeat scroll 0% 0%;}
	/* //fin style bouton TOP */
/* BOTTOM *//* FOOTER */
#foot		{	clear:both;
			}
footer		{	background:#fff;
				border:1px solid rgba(16,157,232,0.8);
				display:block;
				overflow:hidden;
			}
footer p	{	text-align:center;
			}
footer p a	{	color:rgba(16,157,232,0.8);}
#foot footer p a:hover
			{	color:#ea9501;}
#copy div.right,
#copy div.left
			{	padding:20px;
			}
#copy div.left
			{	clear:both;
			}
#copy div.left a
			{	color:#ea9501;
				text-decoration:none;
			}
/*---STYLE-ANIM-POPUP---*/
.mainContent{
	width:1100px; height:auto; border:1px solid #ea9501; margin:50px auto;
	overflow:hidden;
}
.box{ 
	width:250px; height:250px; float:left; margin:10px 0 10px 10px;
	background-size:cover; opacity:0.4; cursor:pointer;
	transition: 0.3s linear; border:solid 1px #fff; -moz-transition: 0.3s linear;
	 -webkit-transition: 0.3s linear; -o-transition: 0.3s linear;
}
.box:hover {  opacity:1; }
.po1{ background-image:url(img/php1_vign.jpg);}
.po2{ background-image:url(img/php2_vign.jpg);}

/*-------------------- style géré par JS ----------------*/
.masque {
	position:absolute; top:0; left:0;
	width:100%; height:100%; background:rgba(0,0,0,0.8);
}
.full {
	position: absolute; z-index:2; top:50%; left:50%;
}
.full:hover
{
	cursor:pointer;
	border:dashed 2px #fff;
}
.show {	animation: show 1.5s forwards;
	-moz-animation: show 1.5s forwards;
	-o-animation: show 1.5s forwards;
	-webkit-animation: show 1.5s forwards; }
.boutona {
	width:30px; height:30px; position:absolute; top:20px; right:20px; z-index: 4; 
	border-radius:100%; border:3px solid white; box-shadow: 2px 2px 5px 0px #656565;
	background:red; color:white; font-family :Verdana; font-weight:bold; 
	text-align:center; line-height:30px;
}
.boutona:hover
{
	cursor:pointer;
	border:solid 2px #0f0;
}
/*---KEYFRAME-POPUP---*/
@keyframes show{
	from{ opacity:.1;}
	to{ opacity:1;}
}
@-moz-keyframes show{
	from{ opacity:.1;}
	to{ opacity:1;}
}
@-o-keyframes show{
	from{ opacity:.1;}
	to{ opacity:1;}
}
@-webkit-keyframes show{
	from{ opacity:.1;}
	to{ opacity:1;}
}