html, body {
	font: 12pt/2.25em sans-serif;
	background:#e0e0e0;
	color: #000000;
	margin: 0;
	position: relative;
}
pre, code, tt {
	font: 1em/1.5em 'Helvetica Neue', 'Arial', sans-serif;
}
h1, h2, h3, h4, h5, h6, b, strong {
	font-weight: normal;
	cursor:default;
}
em, i, dfn {
	font-style: italic;
}
dfn {
	font-weight:bold;
}
p, code, pre, kbd {
	margin:0 0 1.5em 0;
}
blockquote {
	margin:0 1.5em 1.5em 1.5em;
}
cite {
	font-style: italic;
}
li ul, li ol {
	margin:0 1.5em;
}
ul, ol {
	margin:0 1.5em 1.5em 1.5em;
}
ul {
	list-style-type:disc;
}
ol {
	list-style-type:decimal;
}
ol ol {
	list-style: upper-alpha;
}
ol ol ol {
	list-style: lower-roman;
}
ol ol ol ol {
	list-style: lower-alpha;
}
dl {
	margin:0 0 1.5em 0;
}
dl dt {
	font-weight:bold;
}
dd {
	margin-left:1.5em;
}
table {
	margin-bottom:1.4em;
	width:100%;
}
th {
	font-weight:bold;
}
th, td, caption {
	padding:4px 10px 4px 5px;
}
tfoot {
	font-style:italic;
}
sup, sub {
	line-height:0;
}
abbr, acronym {
	border-bottom: 1px dotted;
}
address {
	margin:0 0 1.5em;
	font-style:italic;
}
del {
	text-decoration: line-through;
}
pre {
	margin:1.5em 0;
	white-space:pre;
}
img.centered, .aligncenter, div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignright {
	display: inline;
}
img.alignleft {
	display: inline;
}
.alignright {
	float: right;
	margin-left: 10px;
}
.alignleft {
	float: left;
	margin-right: 10px;
}
img {
	max-width: 100%;
	height: auto;
}
* html .clearfix {
    height: 1%;
}
* + html .clearfix {
	display: inline-block;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
* html .group {
    height: 1%;
}
* + html .group {
	display: inline-block;
}
.group:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div {
	cursor:default;
}

input, label{
	cursor:pointer;
	display:block;
}

a {
	text-decoration:none;
    color: inherit;	
}
a:hover {
	color: #000000;
}
#explications a {
	text-decoration: underline;
}
/* Custom */
#main {
	margin:0 auto;
    position: relative;	
}
#wrapper {
	background: #FFF;
    position: relative;	
}

#header {
    overflow: auto;
}
#logo {
    background: #FFF;
    overflow: auto;
    padding: 0;
    width: 37.344%;
}
#logo img#logo1{
    float: left;
    max-width: 420px;
    display: block;
    width: 100%;
}

#topnav {
    width: 100%;
    position: absolute;
    top: 0;
    overflow: visible;
}
#topnav img{
    position: absolute;
    right: 8%;
    z-index: 1;
    width: 38.36%;
}

#topnav h1{
    float: left;
    display: block;
}

#menu1 {
    font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
    line-height: 1;
    position: relative;
    text-transform: uppercase;
}

#bottomnav .navnb_title {
	
}
#bottomnav ul#menu-list li {
	
}

#topnav .navnb_title, #bottomnav .navnb_title {
	float: left;
	background:#FFF;
	color: #00915A;
    padding: 3px 10px 0;
}

#topnav #navnb, #bottomnav #navnb {
	float:left;
}
ul#menu-list, ul#menu-list li,
ul#carrousel, ul#carrousel li{
	list-style-type: none;
	margin: 0;
    padding: 0;	
	float:left;	
}
ul#menu-list{
	background: #d6dbf6;
	-webkit-border-radius: 0 25px 25px 0;
	-moz-border-radius: 0 25px 25px 0;
	border-radius: 0 25px 25px 0;
	padding-right:25px;	
}
ul#menu-list li {
	background: #d6dbf6;
    color: #394079;
    text-align: center;
}
ul#menu-list li.last {

}
#topnav .navnb_title, #bottomnav .navnb_title {
	float: left;
    background: #d6dbf6;
    color: #2e2e2e;
}
ul#menu-list li a{
    color: #394079;	
	display: block;
}
ul#menu-list li.current a, ul#menu-list li a:hover{
	background:#394079;
	color: #d6dbf6;
}
#teaser {
	width: 100%;
    overflow: visible;
	margin-top: 0;
	position:relative;
}
ul#carrousel{
	width:88%;
    background: #394079;
	-webkit-border-radius: 0 0 30% / 50%;
	-moz-border-radius: 0 0 30% / 50%;
	border-radius: 0 0 30% / 50%;
	padding-top:35px;
}
.epi3 ul#carrousel {
    background-image: url(img/epi3/illu_perso.png);
    background-color: #394079;
    background-repeat: no-repeat;
    background-size: 42%;
    background-position: 84% 104%;
}
.epi4 ul#carrousel {
    background-image: url(img/epi4/illu_perso.png);
    background-color: #394079;
    background-repeat: no-repeat;
    background-size: 46%;
    background-position: 98% 100%;
}
ul#carrousel li {
	width:100%;
}
.teaser .col1-2 {
	width:39.064%;
}
.teaser_img {
    text-align: center;
    width: 41.723%;
    position: absolute;
    bottom: 0;
    right: 5%;
}
.epi2 .teaser_img {
    right: 12%;
}
#comble_teaser {
	max-width: 1040px;
    display: block;
    width: 100%;	
}
.teaser_img img {
	max-width: 215px;
    display: block;
    width: 100%;
}
.teaser_desc {
	color:#FFF;
	margin: 0 0 0 7%;
	position: relative;
}
.teaser_desc h3 {
	font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
	text-transform: uppercase;
	line-height: 1;
}
.teaser_desc h2 {
	font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
	text-transform: uppercase;
	line-height: 1;
}
.teaser_desc h2 span.retour {
	display: block;
}
.teaser_desc p {
	font-family: 'open_sansregular', 'Helvetica Neue', Arial, sans-serif;
    line-height: 1;
}
.calltoaction {
	margin-left: 6%;	
}
.epi2 .calltoaction {
	margin-left: 6%;	
}
.calltoaction a{
	background: #d6dbf6;
    text-transform: uppercase;
    color: #2e2e2e;
    padding: 15px 34px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
	font-size:37px;
}
.calltoaction a:hover{
	background: transparent;
	border:1px solid #d6dbf6;
	color: #d6dbf6;
}
.calltoaction.prochainement a{
	
}
.calltoaction.prochainement a:hover{
	background: #30b4ac;
	border:none;
	cursor:default;
}
.calltoaction span{
	display:block;
    width: 17%;
    height: auto;
    max-width: 33px;	
}

.episodes img {
    width: 100%;
    max-width: 567px;
    margin: 8px auto;
    height: auto;
    display: block;
}
.columns.episodes {
	width: 90%;
	margin: 0 auto;
	overflow: auto;
}
.ligne {
	overflow:auto;
}
.ligne4 {
	
	
}
#explications {
    clear: both;
	font-family: 'open_sansregular', 'Helvetica Neue', Arial, sans-serif;	
	line-height: 1.2;
    border-right: 11px solid #394079;
    padding-right: 25px;
	margin-top: 3em;
}

#explications .semibrose29 {
	font-family: 'open_sanssemibold', 'Helvetica Neue', Arial, sans-serif;
	color:#394079;
}
.boldrose33up {
	font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
	color:#394079;
	font-size:33px;
	text-transform:uppercase;
	margin-bottom: 0.5em;
}
.boldrose33 {
	font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
	color:#394079;
	font-size:33px;
}
.boldrose37 {
	font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
	color:#394079;
	font-size:37px;
}
p.boldblack33 {
	font-family: 'open_sansbold', 'Helvetica Neue', Arial, sans-serif;
	margin: 0 0 5px;
}
.epi3 p.boldblack33, .epi4 p.boldblack33 {
	margin: 0 0 .8em;
}
#logo_footer {
	width: 48.75%;
    margin: 0 auto;
}
#logo_footer img{
	max-width: 100%;
    width: 624px;
}
#signature {
    width: 3%;
    height: auto;
    position: absolute;
    right: 2%;
    max-width: 21px;	
}
.col80 {
    width: 100%;
    float: left;	
}
.col20 {
	width: 17%;
    float: right;
}

#bottomnav {
    display: block;
    overflow: auto;
    width: 100%;
    float: left;
}
a#totop {
    background: transparent url(img/fleche_top.png) no-repeat 0 0;
    width: 33px;
    height: 47px;
    position: fixed;
	bottom: 70px;
    right: 50px;
    overflow: hidden;
    z-index: 9999;
	display:none;	
}
a#tobottom {
    background: transparent url(img/fleche_bottom.png) no-repeat 0 0;
    display: block;
    width: 33px;
    height: 47px;
    position: fixed;
	bottom: 20px;
    right: 50px;
    overflow: hidden;
    z-index: 9999;
}
#explications ul {
	font-size: 21px;	
	list-style-type:none;
    margin: 0px 0 1em 1em;
	padding:0;
}
.epi3 #explications ul,
.epi4 #explications ul {
	margin: 0 0 1em 0;
}
#explications ul li {
    padding: 0 0 0 0.8em;
    position: relative;
    margin: 0 0 0.3em;
}
#explications ul li:before {
    content: "• ";
    color: rgb(57, 64, 121);
    display: inline-block;
    width: 0.8em;
    margin-left: 0;
    position: absolute;
    left: 0;
    top: 0;
}
/* for-phone-only */
@media (max-width: 599px) { 
	#main {
		width:100%;		
	}
	#teaser {
		padding: 15px 0 0;	
	}		
	#topnav img {
		top: -55px;
	}
	.ligne .col1-2, .ligne .col2-2 {
		width:98%;
	}
	.ligne .col1-2{
		margin: 0 1%;
	}
	.ligne .col2-2{
		margin: 0 1%;
	}	
	#teaser .col1-2, #teaser .col2-2 {
		width:48%;
		float: left;		
	}
	#teaser .col1-2{
		margin: 0 0 0 0;
		width:19.088%;
	}
	#teaser .col2-2{
		width:75%;
	    padding-bottom: 54px;
	}	
	.epi4 #teaser .col2-2 {
		padding-bottom: 30px;
	}

	#topnav h1{
		margin: 0 3% 0 10%;
		width: 63%;
	}	
	.teaser_desc h2 {
		font-size: 20px;
		margin: 0 0 22px;
	}
	.teaser_desc h3 {
		font-size: 12px;
		margin: 0 0 12px;
	}
	.teaser_desc p {
		font-size: 16px;
		margin: 0 0 10px 0;
	}		
	.calltoaction {
		
	}	
	.calltoaction a{
	    font-size: 12px;
		padding: 6px 12px;
	}
	.calltoaction a:hover{

	}
	.calltoaction span{
		margin: 5px auto 0;
	}	
	.columns.episodes {
		margin: 20px auto 0;
	}	
	#explications h3 {
		font-size: 23px;
	}	
	#explications p {
		font-size: 21px;
	}
	#explications p.boldrose33 {
		font-size:25px;
	}	
		
	#bottomnav {
		margin: 10px 0 20px;
	}	
	#topnav #menu, #bottomnav #menu {
		font-size: 17px;
	}		
	#topnav .navnb_title, #bottomnav .navnb_title {
		padding: 8px 10px 0 5.6%;
		height: 25px;
	}
	ul#menu-list li a{
		padding: 8px 10px 0;
		height: 25px;	
		width: 13px;
	}	
}

@media (min-width: 470px) { 
	.calltoaction span{
		display:block;
	}
	#teaser {
		padding: 15px 0 0;	
	}	
	.teaser_desc h3 {
		font-size: 16px;
		margin: 0 0 16px;
	}
	.teaser_desc h2 {
		font-size: 30px;
		margin: 0 0 74px;
	}
		
	.teaser_desc p {
		font-size: 20px;
		margin: 0 0 10px 0;
	}
	.calltoaction a{
		font-size:12px;
	}	
}
/* for-tablet-portrait-up */
@media (min-width: 600px) { 

	#main {
		width:600px;		
	}
	#teaser {
		padding: 25px 0 0;
		margin-top:0;		
	}	
	#topnav img, .epi3 #topnav img {
		top: -32px;
	}
	.ligne .col1-2, .ligne .col2-2 {
		width:49.298%;
		float: left;		
	}
	.ligne .col1-2{
		margin: 0 0.702% 0 0;
	}
	.ligne .col2-2{
		margin: 0 0 0 0.702%;
	}
	
	.epi1 .ligne1 .col1-2 {
		width:48.004%;
	}
	.epi1 .ligne1 .col2-2 {
		width:47.396%;
	}	
	.epi1 .ligne2 .col1-2 {
		width:48.612%;
	}
	.epi1 .ligne2 .col2-2 {
		width:47.397%;
	}		
	.epi1 .ligne3 .col1-2 {
		width:48.004%;
	}
	.epi1 .ligne3 .col2-2 {
		width:47.223%;
	}		
	.epi1 .ligne4 .col1-2 {
		width:48.004%;
	}
	.epi1 .ligne4 .col2-2 {
		width:47.223%;
	}		
	#teaser .col1-2, #teaser .col2-2 {
		width:48%;
		float: left;		
	}
	#teaser .col1-2{
		margin: 0 0 0 0;
		width:19.088%;
	}
	#teaser .col2-2{
		width:80.435%;
		padding-bottom: 54px;
	}		
	#topnav #menu {

	}	
	#topnav h1{
		margin: 0 3% 20px 10%;
		width: 33%;
	}
	.teaser_desc h2 {
	    font-size: 39px;
		margin: 0 0 40px;
	}
	.epi3 .teaser_desc h2,
	.epi4 .teaser_desc h2 {
		font-size: 33px;
	}
	.epi4 .teaser_desc h2 {
		margin: 0px 0 30px 0;
	}
	.epi4 #teaser .col2-2 {
		padding-bottom: 40px;
	}
	.teaser_desc h3 {
		font-size:21px;
		margin: 0px 0 20px 0;
	}
	.teaser_desc p {
		font-size: 27px;
		margin: 0 0 30px 0;
	}		
	.calltoaction {

	}	
	.calltoaction a{
		font-size: 15px;
		padding: 10px 17px;
	}
	.calltoaction a:hover{

	}
	.calltoaction span{
		margin: 8px auto 0;
	}	
	.columns.episodes {
		margin: 20px auto 0;
	}	
	#explications h3 {
		font-size: 27px;
	}	
	#explications p {
		font-size: 23px;
	}
	#explications p.boldrose33 {
		font-size:27px;
	}
	#explications ul {
		font-size: 23px;	
	}	
	
	#bottomnav {
		margin: 20px 0 40px;
	}	
	#topnav #menu, #bottomnav #menu {
		font-size: 17px;
	}		
	#topnav .navnb_title, #bottomnav .navnb_title {
		padding: 14px 14px 14px 5.65%;
		font-size: 22px;
	}
	ul#menu-list li a{
		padding: 14px 0;
	    width: 42px;
		font-size: 22px;
	}		
}
@media (min-width: 815px) {
	#topnav #menu {
	
	}	
}
/* for-tablet-landscape-up */
@media (min-width: 900px) {
	#main {
		width:900px;		
	}
	span.retour {
		display: block;
	}
	#teaser {
		padding: 35px 0 0;	
	}		
	#topnav img, .epi3 #topnav img {
		top: -67px;
	}
	.teaser_desc h2 {
		font-size: 58px;
		margin: 0 0 109px 0;	
	}
	.epi3 .teaser_desc h2,
	.epi4 .teaser_desc h2 {
		font-size: 50px;
	}
	.epi4 .teaser_desc h2 {
		margin: 0 0 60px 0;
	}
	.epi4 #teaser .col2-2 {
		padding-bottom: 54px;
	}
	.teaser_desc h3 {
		font-size:32px;
		margin: 0px 0 36px 0;
	}	
	.teaser_desc p {
		font-size: 40px;
		margin: 0 0 37px 0;
	}
	.calltoaction {
		font-size: 25px;
	}	
	.calltoaction a{
		font-size:23px
	}
	.calltoaction a:hover{

	}
	.calltoaction span{
		margin: 13px auto 0;
	}	
	.columns.episodes {
		margin: 40px auto 0;
	}	
	#explications h3 {
		font-size: 33px;
	}	
	#explications p {
		font-size: 29px;
	}
	#explications p.boldrose33 {
		font-size:33px;
	}
	#explications ul {
		font-size: 29px;	
	}	
	.epi3 #explications p, .epi3 #explications ul {
		font-size: 23px;
	}
	#topnav #menu, #bottomnav #menu {
		font-size: 37px;
	}	
	#topnav .navnb_title, #bottomnav .navnb_title {
		padding: 19px 19px 20px 5.65%;
		font-size: 31px;
	}
	ul#menu-list li a{
		padding: 19px 0 20px;
		width: 60px;
		font-size: 31px;
	}	
	#bottomnav {
		margin: 35px 0 64px;
	}		
}
@media (min-width: 1024px) {
	#main {
		width:1024px;		
	}
	#teaser {
		padding: 35px 0 0;	
	}		
	#topnav img, .epi3 #topnav img {
		top: -67px;
	}
	.teaser_desc h2 {
		font-size: 66px;
		margin: 0 0 111px 0;	
	}
	.epi2 .teaser_desc h2 {
		font-size: 70px;
	}
	.epi3 .teaser_desc h2,
	.epi4 .teaser_desc h2 {
		font-size: 56px;
	}
	.epi4 .teaser_desc h2 {
		margin: 0 0 70px 0;
	}
	.teaser_desc h3 {
		font-size: 36px;
		margin: 0 0 39px 0;	
	}	
	.teaser_desc p {
		font-size: 46px;
		margin: 0 0 35px 0;
	}	
	.calltoaction {

	}	
	.calltoaction a{
		font-size: 25px;
	}
	.calltoaction a:hover{

	}
	.calltoaction span{
		margin: 13px auto 0;
	}
	.columns.episodes {
		margin: 40px auto 0;
	}
	.epi3 #explications p, .epi3 #explications ul {
		font-size: 27px;
	}
	#bottomnav {
		margin: 40px 0 75px;
	}		
}
/* for-desktop-up */
@media (min-width: 1280px) {
	#main {
		width:1280px;		
	}
	#teaser {
		padding: 35px 0 0;	
	}
	#topnav img, .epi3 #topnav img {
		top: -95px;
	}

	.teaser_desc h2 {
		font-size: 83px;
		margin: 0 0 140px 0;	
	}
	.epi3 .teaser_desc h2 {
		font-size: 70px;
		margin: 0 0 150px 0;
	}
	.epi4 .teaser_desc h2 {
		font-size: 70px;
		margin: 0 0 70px 0;
	}
	.teaser_desc h3 {
		font-size:58px;
		margin: 0px 0 50px 0;
	}
	.epi3 .teaser_desc h3,
	.epi4 .teaser_desc h3 {
		margin: 0px 0 28px 0;
	}
	.teaser_desc p {
		font-size: 58px;
		margin: 0 0 60px 0;
	}	
	.calltoaction {

	}
	.calltoaction a{
		font-size: 33px;
		padding: 11px 40px 13px 34px;
		line-height: 69px;
	}
	.calltoaction a:hover{

	}
	.calltoaction span{
		margin: 13px auto 0;
	}	
	.columns.episodes {
		margin: 88px auto 0;
	}
	.epi3 #explications p, .epi3 #explications ul {
		font-size: 33px;
	}
	#bottomnav {
		margin: 50px 0 100px;
	}	
}

/* for-big-desktop-up */
@media (min-width: 1800px) { 

}