/********************************************************************************/
/*       ______                                                                 */
/*      |  __  |                                                                */
/*      | |  | |_   _____ _ __ _   __   ____ _ _ __ ___                         */
/*      | |  | | \ / / _ \ '__| \ /  \ / / _' | '__| _ \                        */
/*      | |__| |\ v /  __/ |   \ v /\ v / (_| | | |  __/                        */
/*      |______| \_/ \___|_|    \_/  \_/ \__,_|_|  \___|                        */
/*                                                                              */
/********************************************************************************/
/*      Auteur: HERGAULT Jeremy (reneca)                                        */
/*      E-MAIL: jeremy.hergault@orange.fr                                       */
/*      Language: HTML5 / CSS3                                                  */
/*      Date Debut:  01/03/2012                                                 */
/*      Date mise en ligne:  21/01/2012                                         */
/*      Version: 3.0                                                            */
/*      Description: Site web OVERWARE                                          */
/********************************************************************************/

/********************************************************************************/
/******************************* Style principal ********************************/
/********************************************************************************/
html, body { height: 100%; margin-bottom: 20px; }

body{margin:0; padding:0; font-size:16px; font-family:helvetica, Georgia, Times, serif; color:#919191; background-color:#FFFFFF; }

.justify{text-align:justify;}
.bold{font-weight:bold;}
.center{text-align:center;}
.right{text-align:right;}
.nostart{margin:0; padding:0; list-style:none;}
.hidden{display:none;}

.clear:after{content:"."; display:block; height:0; clear:both; visibility:hidden; line-height:0;}
.clear{display:block; clear:both;}
html[xmlns] .clear{display:block;}
* html .clear{height:1%;}

a{outline:none; text-decoration:none;}

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

img{margin:0; padding:0; border:none; line-height:normal; vertical-align:middle;}
.imgholder, .imgl, .imgr{padding:4px; border:1px solid #D6D6D6; text-align:center;}
.imgl{float:left; margin:0 15px 15px 0; clear:left;}
.imgr{float:right; margin:0 0 15px 15px; clear:right;}

/*----------------------------------------------HTML 5 Overrides-------------------------------------*/

address, article, aside, figcaption, figure,header, hgroup, nav, section{display:block; margin:0; padding:0;}
article{border: 0px solid black;}


/* ----------------------------------------------Wrapper-------------------------------------*/

div.wrapper{display:block; width:100%-20px; margin:0;
	padding: 0 10px;
	text-align:left;}

.row { color:#000000; background-color:#FFFFFF; }
.row1, .row1 a{color:#C0BAB6; background-color:#FFFFFF;} /*#333333;}*/
.row2{color:#919191; background-color:#333333/*232323*/;}
.row3{color:#979797; background-color:#FFFFFF; /*border: 1px solid red;*/ min-height: 75%;}
/*.row3 a{color:#FF9900; background-color:#FFFFFF;}*/
.row4{/*color:#989898; background-color:#333333;*/}
.row4 a{color:#FF9900; background-color:#333333;}
.row5, .row5 a{color:#919191; background-color:#232323;}
.row5{margin-top: auto; margin-bottom:1px;}

/*----------------------------------------------Generalise-------------------------------------*/

#header, #topnav, #container, footer, #copyright, #content
{
	display:block;
	min-width:980px;
	max-width:1000px;
	margin: 0 auto;
}

footer { margin-bottom: 40px; }

h1, h2, h3, h4, h5, h6{margin:0; padding:0; font-size:20px; font-weight:normal; line-height:normal;}

h12, h1 { color:#3495db; }

#content p { margin-top: 30px; margin-bottom: 30px; }

#container { margin-top: 40px; line-height: 10px; }
h1 { font-size: 80px; }
h12 { font-size: 60px; }
h2 { color:#232220; }


/*----------------------------------------------Header-------------------------------------*/

#header{padding:22px 0; height: 54px;}

#header hgroup{float:left;}
#header hgroup h1, #header hgroup h2{font-weight:normal; font-style:normal; text-transform:none;}
#header hgroup h1{font-size:36px;}
#header hgroup h2{font-size:13px;}

/*----------------------------------------------Content Area-------------------------------------*/

#container{padding:60px 0;}
#seperate
{
	display:block;
	margin: 0 auto;
	width: 940px;
	border-top: solid #333230 1px;
}

#smallseperate
{
	display:block;
	margin: 0 auto;
	margin-left: 180px;
	width: 760px;
	border-top: dashed #333230 1px;

	margin-top: -20px;
	margin-bottom: -20px;
}

h3 { float: left; }

#content { margin-top: 30px; margin-bottom: 30px; }

#content .formation
{
	font-size:19px;
	margin-left: 160px;
}

#content .formation2
{
	margin-left: 160px;
	font-size:0.88em;
}

#content .info
{
	margin-top: 8px;
	margin-left: 160px;
	font-size:0.8em;
}

#content .date
{
	float : right;
	margin-right: 10px;
}

.empl11 { float: left; margin-left: 140px; }
.empl21 { margin-left:520px; }
.empl31 { float: right; margin-top: -20px; margin-right: 140px; }

.empl12 { float: left; margin-left: 190px; }
.empl22 { margin-left:491px; }
.empl32 { float: right; margin-top: -20px; margin-right: 95px; }

.empl13 { float: left; margin-left: 225px; }
.empl23 { margin-left:524px; }
.empl33 { float: right; margin-top: -20px; margin-right: 104px; }

/*----------------------------------------------Login-------------------------------------*/
/* Freebie Styles */
div.message {
	position: relative;
	width: 700px;
	border-width: 1px;
	border-style: solid;
	margin: 10px auto;
	text-align: right;
	padding: 15px 20px;
	font-size: 14px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-image: url(/images/main/diagonal_pattern.png);
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.3);
	
	-moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
	-webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}
div.message div.icon {
	display: block;
	width: 16px;
	height: 16px;
	float: left;

	background: no-repeat left center;
	cursor: pointer;
}
div.message div.triangle {
	position: absolute;
	bottom: -1px;
	right: -1px;
	
	width:14px;
	height:14px;
	background: no-repeat bottom left;
}

div.message.error {
	color: #cc3333; background-color: #ff6666; border-color: #cc6666;

	-moz-box-shadow: 0 2px 0 -1px #cc6666;
	-webkit-box-shadow: 0 2px 0 -1px #cc6666;
	box-shadow: 0 2px 0 -1px #cc6666;
}
div.message.error div.icon { background-image: url(/images/main/close.png); }
div.message.error div.triangle { background-image: url(/images/main/red_corner.png); }

div.message.success {
	color: #339966; background-color: #5bde9a; border-color: #33cc66;

	-moz-box-shadow: 0 2px 0 -1px #33cc66;
	-webkit-box-shadow: 0 2px 0 -1px #33cc66;
	box-shadow: 0 2px 0 -1px #33cc66;
}
div.message.success div.icon { background-image: url(/images/main/tick.png); }
div.message.success div.triangle { background-image: url(/images/main/green_corner.png); }


#login {
	position: relative;
	margin: 0 auto;
	display: table;
	width: 330px;
	padding: 5px;
	border: 1px solid #b4b1b1;
	background-color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-align: center;

	-moz-box-shadow: 0 3px 0 -1px #b4b1b1;
	-webkit-box-shadow: 0 3px 0 -1px #b4b1b1;
	box-shadow: 0 3px 0 -1px #b4b1b1;
}
#login h1 {
	display: table;
	margin: 20px auto;
	color: rgba(147, 151, 152, 0.5);
	text-shadow: 0 0 0 #000;
}
#login input[type=text], input[type=password] {
	display: block;
	margin: 0 auto;
	width: 180px;
	border: 1px solid #c0c2c7;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #8c8f90;

	padding: 10px;
	font-style: italic;
	font-size: 11px;
	margin-bottom: 10px;

	-moz-box-shadow: inset 0 1px 3px -1px #b4b1b1;
	-webkit-box-shadow: inset 0 1px 3px -1px #b4b1b1;
	box-shadow: inset 0 1px 3px -1px #b4b1b1;
}
#login input[type=text]:focus, input[type=password]:focus {
	border-color: #1b67f1;
	-moz-box-shadow: 0 0 5px 0x #b4b1b1;
	-webkit-box-shadow: 0 0 5px -0 #b4b1b1;
	box-shadow: 0 0 5px 0 #b4b1b1;
}

#login input[type=button], input[type=submit] {
	padding: 5px 25px;
	border: 1px solid;
	font-size: 11px;

	cursor: pointer;
}
#login input[type=button].red, input[type=submit].red {
	color: #fff;
	border-color: #cc3333;
	-moz-box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.6);
	-webkit-box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.6);
	box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.6);
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);

	/* Gradient */
	background: #e35940; /* Old browsers */
	background: -moz-linear-gradient(top, #e35940 0%, #cb4229 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e35940), color-stop(100%,#cb4229)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #e35940 0%,#cb4229 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #e35940 0%,#cb4229 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #e35940 0%,#cb4229 100%); /* IE10+ */
	background: linear-gradient(to bottom, #e35940 0%,#cb4229 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e35940', endColorstr='#cb4229',GradientType=0 ); /* IE6-9 */

	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
#login input[type=button].red:hover, input[type=submit].red:hover {
	background: #e35940; /* Old browsers */
	background: -moz-linear-gradient(top, #e35940 0%, #c9371e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e35940), color-stop(100%,#c9371e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #e35940 0%,#c9371e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #e35940 0%,#c9371e 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #e35940 0%,#c9371e 100%); /* IE10+ */
	background: linear-gradient(to bottom, #e35940 0%,#c9371e 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e35940', endColorstr='#c9371e',GradientType=0 ); /* IE6-9 */
}
#login input[type=button].red:active, input[type=submit].red:active {
	background: #e35940;
}

#login input[type=button].blue, input[type=submit].blue {
	color: #000;
	border-color: #0099cc;
	-moz-box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.8);
	-webkit-box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.8);
	box-shadow: inset 0 0 2px 0 rgba(255, 255, 255, 0.8);
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.8);

	/* Gradient */
	background: #9ae0e9; /* Old browsers */
	background: -moz-linear-gradient(top, #9ae0e9 0%, #82c8d1 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ae0e9), color-stop(100%,#82c8d1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #9ae0e9 0%,#82c8d1 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #9ae0e9 0%,#82c8d1 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #9ae0e9 0%,#82c8d1 100%); /* IE10+ */
	background: linear-gradient(to bottom, #9ae0e9 0%,#82c8d1 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ae0e9', endColorstr='#82c8d1',GradientType=0 ); /* IE6-9 */

	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
#login input[type=button].blue:hover, input[type=submit].blue:hover {
	background: #9ae0e9; /* Old browsers */
	background: -moz-linear-gradient(top, #9ae0e9 0%, #69c4ce 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9ae0e9), color-stop(100%,#69c4ce)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #9ae0e9 0%,#69c4ce 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #9ae0e9 0%,#69c4ce 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #9ae0e9 0%,#69c4ce 100%); /* IE10+ */
	background: linear-gradient(to bottom, #9ae0e9 0%,#69c4ce 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ae0e9', endColorstr='#69c4ce',GradientType=0 ); /* IE6-9 */
}
#login input[type=button].blue:active, input[type=submit].blue:active {
	background: #9ae0e9;
}

#login .footer {
	display: table;
	margin-top: 20px;
	color: #000;
}

#login .footer label {
	margin-top: 5px;
	color: #7e7e7e;
}

#login div.triangle {
	position: absolute;
	bottom: -2px;
	right: -2px;
	
	width:14px;
	height:14px;
	background: no-repeat bottom left;
}
#login div.triangle { background-image: url(/images/main/gray_corner.png); }




/*----------------------------------------------Page-------------------------------------*/
#page
{
	/*border: solid black 1px;*/
	width: 80%;
	height: 26px;
	padding: 0;
	margin-left: 2px;
	margin-bottom: 14px;
}
#page .idtextpage
{
	text-align: center;
	margin: 0 4px 0 4px;
	float: left;
	padding: 2px 9px 5px 9px;
	min-width: 10px;
	color:#919191;
	background-color:#FFFFFF;
}
#page .idactivepage
{
	border-radius: 4px;
	font-size:1.4em;
	text-align: center;
	margin: 0 4px 0 4px;
	float: left;
	padding: 2px 9px 5px 9px;
	min-width: 10px;
	color:#C3C2C0;
	background-color:#232220;
}
#page .idpage
{
	border-radius: 4px;
	font-size:1.4em;
	text-align: center;
	margin: 0 4px 0 4px;
	float: left;
	padding: 2px 9px 5px 9px;
	min-width: 10px;
	color:#333230;
	background-color:#B3B2B0;
}
#page .idpage:hover
{
	border-radius: 4px;
	font-size:1.4em;
	text-align: center;
	margin: 0 4px 0 4px;
	float: left;
	padding: 2px 9px 5px 9px;
	min-width: 10px;
	color:#C3C2C0;
	background-color:#232220;
}



/*----------------------------------------------Footer-------------------------------------*/
#footer{padding: 10px 0;}

.lienfondblanc{vertical-align: middle; text-align: center; margin: 8px; font-size: 10px; color: #666666;}
.lienfondblanc:hover{color: #78BA00;}

.img_licence{margin-left: 14px; float: left;}
.licence_footer{width: 190px; margin-top: 32px; margin-left: 16px; font-size: 12px; color: #777777; float: left;}
.footer_middle
{
	width: 400px;
	float: left;
	padding: 0 auto;
	margin-left: 17%;	/* A modifier si on rajoute des liens */
	margin-top: 32px;
}
.footer_right
{
	float: right;
	margin-top: 26px; /* margin-top middle -6px */
	margin-right: 14px;
	font-size: 12px;
	color: #777777;
}
.img_rss
{
	float: right;
}
.liensfooter
{
	text-align : center;
	margin-top: 20px;
	margin-bottom: 20px;
}


/********************************************************************************/
/******************************** Style central *********************************/
/********************************************************************************/
#container .link_article {outline:none; text-decoration:none; color:#333230;}
#container .link_article:hover {outline:none; text-decoration:none; color:#333230;}
#container .link_article:visited {outline:none; text-decoration:none; color:#333230;} 

#container article a {outline:none; text-decoration:none; color:#5f870d;}
#container article a:hover {outline:none; text-decoration:underline; color:#5f870d;}
#container article a:visited {outline:none; text-decoration:none; color:#5f870d;}

#container article {display:block; width:100%-20px; padding:10px/*Marge entre articles*/ 10px/*Marge exterieur left right*/; margin: 10px 0 26px;}

#container article .date{margin:4px 12px 10px; padding:0; color:#939290;}
#container article img{margin:0 0 15px 0; padding:4px; border:1px solid #D6D6D6;}
#container article .fleft{float:left; margin:10px 15px 10px 0; clear:left;}
#container article .fright{float:right; margin:10px 0 10px 15px; clear:right;}
#container article .fmiddle{margin:10px 0 10px 0;}
#container article .contenuart{/*margin:10px 12px;*/ font-size:1.3em; color:#333230;}
/*#container article h2{font-size:2.05em; font-weight:bold; color:#5f870d;}*/
#container article h12{margin-left:4px; font-size:1.5em; font-weight:bold; color:#5f870d;}
#container article h3{margin-left:4px; font-size:1.5em; font-weight:bold; color:#131210;}
#container article h4{margin-left:8px; font-size:1.3em; font-weight:bold; color:#232220; margin:0px 8px;}
#container article p{margin:10px 12px; /*font-size:1.3em;*/ padding:0; color:#333230;}


/********************************************************************************/
/********************************** Style nav ***********************************/
/********************************************************************************/
nav ul{margin:0; padding:0; list-style:none;}

/* ----------------------------------------------Top Navigation-------------------------------------*/

div.bslide
{
	display: block;
	font-size: 18px;
	width: 36px;
	height: 23px;
	margin-top: -6px;	/*permet le centrage vertical*/
	padding-top: 1px;	/*Alignement de l'image */
	padding-bottom: 4px;
	text-align: center;
	color: #000;
	background: #444;
	background: -webkit-linear-gradient( #555, #2C2C2C);
	background:    -moz-linear-gradient( #555, #2C2C2C);
	background:     -ms-linear-gradient( #555, #2C2C2C);
	background:      -o-linear-gradient( #555, #2C2C2C);
	background:         linear-gradient( #555, #2C2C2C);
	border-radius: 4px;
	text-shadow: 0px 1px 0px rgba( 255, 255, 255, 0.2);
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0.5),
				0 -1px 0 rgba( 255, 255, 255, 0.4);
}


div.bslide:hover{
	color: #222;
	background: #555;
	background: -webkit-linear-gradient( #777, #333);
	background:    -moz-linear-gradient( #777, #333);
	background:     -ms-linear-gradient( #777, #333);
	background:      -o-linear-gradient( #777, #333);
	background:         linear-gradient( #777, #333);
}

div.bslide:active{
    color: #000;
    background: #444;
    background: -webkit-linear-gradient( #555, #2C2C2C);
    background:    -moz-linear-gradient( #555, #2C2C2C);
    background:     -ms-linear-gradient( #555, #2C2C2C);
    background:      -o-linear-gradient( #555, #2C2C2C);
    background:         linear-gradient( #555, #2C2C2C);
    box-shadow: 1px 1px 10px black inset,
                0 1px 0 rgba( 255, 255, 255, 0.4);
}

#topnav{padding:18px 0 12px /* hauteur haut = bas + 6*/; font-size:1.0em;}
#topnav ul{width: 74%;}
#topnav .topuser{float: right; width: 180px; margin-right: 46px; overflow: hidden;}
#topnav li{float:left; margin-right:9.2%; text-transform:uppercase;}
#topnav li.navright{margin-right: 0;}
#topnav li li{margin-left:0;}
#topnav li a:link, #topnav li a:visited, #topnav li a:hover{display:block; margin:0; padding:0; color:#C0BAB6; background-color:#333333;}
#topnav li a:hover, #topnav li.active a{color:#5F870D; background-color:#333333;}
#topnav li:hover ul{left:auto;}
#topnav li:hover{position:static;}
#topnav li.last{margin-right:0;}




/********************************************************************************/
/********************************* Style forms **********************************/
/********************************************************************************/
fieldset, legend{margin:0; padding:0; border:none;}

legend{display:none;}

input, textarea, select{font-size:12px; font-family:Georgia,"Times New Roman",Times,serif;}

/* ----------------------------------------------Search Form-------------------------------------*/

#header form{display:block; width:264px; /*ecart de 10px*/ float:right; margin:12px 0 0 0;/*hauteur*/ padding:0;}
#header form input{display:block; float:left; width:200px; margin:0; padding:5px; color:#C0BAB6; background-color:#232323; border:1px solid #666666;}


