/* =====[ RESET ]======================================================================== */
body,h1,h2,h3,h4,p,quote,small,form,input,ul,li,ol,label{
	/* Page reset */
	margin:0px;
	padding:0px;
	font-weight:normal;
}
/* =====[ GLOBAL STYLES ]======================================================================== */
body {
	font-family: Arial, "Myriad Pro", "sans-serif";
	font-size: 13px;
	color: #000;
	background: #ffffff;
	margin: 0px;
	padding: 0px;

}
.clear {clear:both}
a {	/*color: #00badd;*/ color:#46748c; text-decoration:none;}
a:hover { color: #46748c;}

.contenu {
	position:relative;
	/*width:720px;*/
	width:950px;
	margin:0 auto;
}
.right{	float:right; }
.left{	float:left; }
p {padding:10px 0; text-align:justify}
h1 {
	color:#333333;
	font-size:30px;
	/*font-size:27px;*/
	margin:20px 0 5px 0;
	line-height:100%;
}
.live h1{margin-top:-4px;}
h2 {
	color:#333333;
	font-size:25px;
	/*font-size:22px;*/
	margin-bottom:20px;
}
h3{
	color:#333333;
	font-size:18px;
	padding-bottom:10px;
}
.soustitre{	color:#666666;	font-size:18px;}

hr {
	height:1px;
	background:url(/client/dfc/images/2016_v1_mtl/bg_question.jpg) repeat-x;
	border:none;
	margin:32px 0 32px 0;
}

.live hr {	margin:38px 0 32px 0;}

.font12{	font-size:12px;}
.font14{	font-size:14px;}
.font18{	font-size:18px; color:#333333}

/* =====[ HEADER ]======================================================================== */

.header{	background:#43b8da; margin-bottom:0px;}
.header a{	margin-top:20px; color:#ffffff;}
.header a:hover{color:#0f6683;}
.header a span{	border-bottom:1px #fff dotted}
.header a:hover span{	border-bottom:none; color:#fff}
.header a img{	vertical-align:middle;	padding-right:5px;}
.logo {
	width:100%;
	height:auto;
	max-width:222px;
}

/* =====[ INDEX ]======================================================================== */
.paysage{
	width:100%;
	height:auto;
	max-width:950px;
}
.cols1{	width:50%;	float:left; }
.cols2{	width:45%;	float:left; margin-left:5%;}

ul.programme {	list-style:none; margin-bottom:20px; font-size:14px; }
ul.programme li div.hrs{color:#00badc; font-weight:bold; width:15%; float:left;}
ul.programme li{clear:both; }
ul.programme .left{padding-bottom:15px; width:85%;}
ul.programme .active{color:#00badc;}
ul.programme em, ul.programme a{font-size:12px;}
ul.programme strong a {font-size:14px; color:#000000;}
ul.programme strong a:hover {color:#1c758e;}

.cols2 ul.programme li div.hrs{width:17%;}
.cols2 ul.programme .left{width:70%;}

.bloc{
	background:url(/client/dfc/images/2016_v1_mtl/bg_question.jpg) repeat;
	padding:10px;
	margin-bottom:20px;
}
.bloc .cadre{
	padding:15px;
	background:#ffffff;
}

.live .bloc{
	margin-bottom:0px;
	margin-top:20px;
}
.cols2 p{	text-align:center;}

.partenaire {
	max-width:286px;
	width:100%;
	height:auto;
}
/* =====[ BOUTON - formulaire ]======================================================================== */

.bouton{
	background:#1b758e;
	position: relative;
	padding:8px 10px;
	height: 14px;
	border:none;
	cursor:pointer;
}

.bouton_input{
	background:#1b758e;
	position: relative;
	border:none;
	cursor:pointer;
	padding:0 10px;
	margin-right:2%;
}

.bouton:hover, .bouton_input:hover{
	background:#116076;
}
.bouton:hover:before, .bouton_input:hover:before{	content:""; position: absolute; left: 100%; top: 0px; width: 0; height: 0; border-top: 15px solid transparent; border-left: 13px solid #116076; border-bottom: 15px solid transparent;}

.bouton:before, .bouton_input:before{	content:""; position: absolute; left: 100%; top: 0px; width: 0; height: 0; border-top: 15px solid transparent; border-left: 13px solid #1b758e; border-bottom: 15px solid transparent;}

.reset_en{	width: 110px;}
.test_en{	width: 137px;}
.reset_fr{	width: 129px;}
.test_fr{	width: 162px;}
.submit_en { 	width:42px; margin-left:15% }
.submit_fr { 	width:65px; margin-left:15%}
.login_en { 	width:35px}
.login_fr { 	width:80px}

/*.connexion{	width: 80px;}*/

.bouton a{
	color:#fff;
	font-size:10px;
	text-transform:uppercase;
	font-weight:bold;

}

.bouton a:hover{	color:#ffffff;}
a.dashed{	border-bottom:1px dotted #46748c;}
a:hover.dashed{	border-bottom:none;}

label{
	display: table-cell;
	padding: 5px 0 6px 0;
}


input:focus, textarea:focus, select:focus{outline:  none;}
textarea:focus, select:focus, input[type=text]:focus{ border:1px solid #6ab1f3;}


textarea{	/*width:352px;*/background:#b2e9f6; width:98%; margin-bottom:12px;}



select, textarea, input{
	padding:6px;
	font-size:12px;
	border:0px;
	color:#666666;
	font-family: Arial, "Myriad Pro", "sans-serif";
	border:none;
	border-radius: 0px;
}

.styled-select select {
	background: transparent;
	border-radius: 0;
	width:150%;
	-webkit-appearance: none;
}

.styled-select {
	width: 48%;
	height: 30px;
	overflow: hidden;
	background: url(/client/dfc/images/2016_v1_mtl/select.jpg) no-repeat right #b2e9f6;
	margin-bottom:15px
}
.reset_bouton{
	background:transparent;
	position: relative;
	height: 30px;
	border:none;
	cursor:pointer;
	color:#fff;
	font-size:10px;
	text-transform:uppercase;
	font-weight:bold;
	padding:0 ;
	font-family: Arial, "Myriad Pro", "sans-serif";
}

.obligatoire{padding:0 0px 40px 0; float:left;}

/* =====[ FOOTER ]======================================================================== */

.support{
	margin-top:60px;
	background:#f1f3f3;
	padding:17px 0;
}

.support ul{list-style:none; text-align:center}
.support ul li{
	display:inline-block;
	padding-left:2%;
	padding-right:2%;
	border-left:1px dotted #46748c;
}
.support ul li:last-child{	padding-right:0px;}
.support ul li:first-child{	padding-left:0px; border-left:none;}
.support ul li img{
	vertical-align:middle;
	padding-right:5px;
	background:#f1f3f3;
}
.footer{
	background:#43b8da;
	padding:35px 0;
	color:#ffffff;
}

.footer h2{	color:#ffffff}
.footer h2 a:hover{	color:#c6eaef}
.footer span{	text-transform:uppercase; font-size:10px}
.footer a{	color:#ffffff}
.footer a:hover{	color:#ffffff}
.footer a.dashed{	border-bottom:1px dotted #ffffff;}
.footer a:hover.dashed{	border-bottom:none;}
.footer .cols {
	width:47%;
	float:left;
	/*font-size:18px;*/
}
.footer h2 {	margin-bottom:10px; font-size:18px;}


.md{	font-size:11px;}
strong{	padding-top:10px;}

.footer .right{	padding-left:15px;}
.footer .marge{	margin-left:6%}
.footer2{
	background:#f1f3f3;
	padding:20px 0 60px 0;
}

.footer2 .logo{
	width:100%;
	height:auto;
	max-width:312px;
}

.copyright {
		float:right;
		font-size:11px;
		color:#969595;
		margin-top:40px;
	/*text-align:center;
	float:none;*/

}
.copyright a {color:#969595; text-decoration:none;}

/* =====[ LIVE ]======================================================================== */
.video{
	width:100%;
	height:auto;
	max-width:960px;
	margin:26px auto 34px auto;
}

.video .player{	margin-bottom:15px}
.video a{font-size:13px;}
.video a img, .bloc a img{vertical-align:middle; padding-right:10px; background:#ffffff}
.video a img{margin-bottom:40px; float:left}
.partenaire2 img{	vertical-align:middle}
p.partenaire2{	padding:0;	margin:45px 0 0 0;}

.video h2{
	margin-top:28px;
	line-height:90%;
	margin-bottom:27px
}

.lecteur {
	width:100%;
	height:auto;
	max-width:692px;
}


.succes{
	text-align:center;
	background:#b2e9f6;
	padding:40px;
	/*margin-top:28px;*/
	margin-top:86px;
}

.succes h2{  text-align:center;}


/* =====[ CONNEXION ]======================================================================== */

.connexion{	 margin-bottom:60px;}
.note{padding:15px 0 0 0;}
.connect {width:50%;}
.connect .input{	height:19px; background:#b2e9f6; width:55%; margin-right:4%; float:left; border-radius: 0px; }
.error
{
	height:12px; color:red; padding-bottom:10px;
}




/*Style Piro*/
body{margin:0; padding:0;}

#inline{
	width:75%;
	min-height:300px;
	margin:0 auto;
	padding:0;
}

#inline ul{
	display:table;
	width:100%;
	margin:0 auto;
	position:relative;
}

#inline ul li{
	display:table-cell;
	padding:10px;
	margin:0;
	width:25%;
	text-align:center;
	border-left:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	background:#fff;

}

#inline ul li:first-child{	border-left:none !important;}
#inline ul li img{	vertical-align:middle;}

#inline ul.titre li{
	background:#333333;
	font-weight:bold;
	color:#fff;
	border-left:1px solid #454545;
	border-bottom:1px solid #454545;
}

#inline p{
	text-align:center;
	color:#cccccc;
	padding:15px 0;
}

.test_video {
	width:100%;
	max-width:800px;
	height:auto;
}
/*FIN Style Piro*/

/* :::::[ 768 PIXELS LAYOUT (ipad)]:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (min-width: 768px) and (max-width: 1024px)
{
	#inline ul{	width:90%;}
	.contenu {	width: 90%;}
	.support .contenu { width:100%}
	.support ul li{	padding-left:1%; padding-right:1%; font-size:11px;}
	.connect {width:60%;}
}

/* :::::[ 320 PIXELS LAYOUT (iphone) ]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 752px)
{
	#inline { min-height:200px;}
	#inline ul{ width:100%; padding:15px 0;}
	#inline ul li{display:inline-block; width:100%; border:0; padding:8px 0;}
	#inline ul li:last-child{ border-bottom:1px solid #454545;}
	#inline ul.titre li, .mobile{ display:none;}
	#video, #video .videoplayer{ width:250px; height:auto}
}

/* :::::[ 480 PIXELS LAYOUT (IPHONE HORIZONTALE)]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (min-width: 465px) and (max-width: 752px)
{
	.contenu {  /*width: 451px;	padding: 0 14px 0 15px;*/ width:95%}
	.cols1{	width:100%;	float:none; margin-left:130px;}
	.cols2{	width:100%;	float:none; margin-left:130px;}
	.support ul{text-align:left}
	.support ul li{	display:list-style;	padding-left:0%;	padding-right:0;	border-left:0;padding-bottom:15px;}
	.support ul li:first-child{	padding-left:10%;}
	.footer .cols {	width:100%;	float:none;}
	.footer .marge{	margin-left:0%; margin-top:30px;}
	h1 { font-size:23px;}
	h2 { font-size:18px; }
	.soustitre{ font-size:15px;}
	.header .right
	{
		/*float:left;*/
		padding-bottom:20px;
		/*margin-top:-10px;*/
	}
	.video a{font-size:14px;}
	.video .right{width:50%}
	.note{font-size:12px;}
	.connect {width:100%;}
	.cols2 ul.programme li div.hrs{width:15%;}
	p.partenaire2{	text-align:center;}
	.partenaire2 img{	display:table; margin:10px auto 20px auto;}
	.copyright {	text-align:center;	float:none;}
	.header
	{
		width:720px;
	}
	.footer
	{
		width:720px;
	}
	.footer2
	{
		width:720px;
	}
	.support
	{
		width:720px;
	}
}
/* :::::[ 320 PIXELS LAYOUT (iphone vertical) ]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media screen and (max-width: 464px)
{
	.header
	{
		width:720px;
	}
	.copyright { text-align:center; float:none;}
	body { min-width: 320px; }
	.contenu {    width: 680px;	padding: 0 13px 0 13px;}
	.header .right{	/*float:left;*/ padding-bottom:20px;}
	.cols1{	width:100%;	float:none; }
	.cols2{	width:100%;	float:none; margin-left:0;}
	ul.programme li div.hrs{width:20%; }
	.support ul{/*text-align:left*/}
	.support ul li{	display:list-style;	padding-left:0%;	padding-right:0;	border-left:0;padding-bottom:15px;}
	.support ul li:first-child{	padding-left:5%;}
	.support
	{
		width:720px;
	}
	.footer .cols {	width:100%;	float:none;}
	.footer .marge{	margin-left:0%; margin-top:30px;}
	.footer
	{
		width:720px;
	}
	.footer2
	{
		width:720px;
	}
	ul.programme li div.hrs{width:20%; }
	h1 { font-size:23px;}
	h2 { font-size:18px; }
	.soustitre{ font-size:15px;}
	.note{font-size:13px;}
	.connect {width:100%;}
	.video .right{width:50%}
	.video a{font-size:12px;}
	.submit_fr, .submit_en { margin-left:10%}
	.cols2 ul.programme li div.hrs{width:20%;}
	p.partenaire2{	text-align:center;}
	.partenaire2 img{	display:table; margin-bottom:20px;}
}
/*FIN  :::::[ 320 PIXELS LAYOUT (iphone vertical) ]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */