@import url(https://fonts.googleapis.com/css?family=Open+Sans:800);
@import url(//fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(//fonts.googleapis.com/css?family=Dosis:400,200,600,700);

html, body{
	margin:0;
	padding:0;
	height:100%;
}

.wrapper{
	min-height:100%;
	position:relative;
}
header * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing :border-box;
    box-sizing: border-box !important;
}
header{
	position:fixed;
	top:0;
	left:0;
	position: relative;
	top:0;
	z-index: 10000000;
	width:100%;
	font-family: 'Dosis', sans-serif;
	height:99px;
	background:#000;
}

.dl-trigger{
	display:none;
	float: right;
	background:#000;
	border: none;
	width:50px;
	height:50px;
	text-align: right;
	cursor: pointer;
}
.dl-trigger img{
	width:40px;
	height:auto;
	margin-right: 10px;
	margin-top:10px;
}
#menu-responsive{
	background:#000;
	width:170px;
	height:49px;
	position:absolute;
	top:50px;
	right:0;
	z-index:100;
}

#menu-responsive ul{
	list-style-type: none;
	text-align: left;
	padding:10px 25px;
	margin:0;
	position:absolute;
	top:50px;
	width:170px;
	z-index: 100;
	background: #000;
	right:0;
	opacity:0;
}

#menu-responsive ul li{
	list-style-type: none;
	padding:20px 0;
	margin:0;
	height:30px;
	line-height: 30px;
	display: block;
	border-bottom: 1px solid #333
}
#menu-responsive ul li:last-child{
	border-bottom:none;
}
#menu-responsive a, #menu-responsive a:visited{
	font-size: 14px;
	color:#fff;
	text-decoration: none;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	padding: 0 5px;

}
#menu-responsive a:hover{
	color:#ccc;
}
 .language{
 	float: right;
 	width:75px;
 	border-right: 1px dotted #434343;
 	height:30px;
 }
 .dl-trigger{
 	float: right;
 }
 .language a{
 	display: block;
    width: 25px;
    height: 15px;
    margin-top: 10px;
    overflow: hidden;
    padding: 0;
    float: left;
 }   
#lang-en{
	background: url('img/flag-en.png') no-repeat top left;
    margin:7px 2px 0 10px;
}
#lang-fr{
	background: url('img/flag-fr.png') no-repeat top left;
    margin:7px 10px 0 2px;
}
 
#lang-en:hover, #lang-en.selected, #lang-fr:hover, #lang-fr.selected{
 	background-position: -25px 0;
 }  
.basic-links{
	float: right;
	margin:0;
	padding:0;
}
.basic-links li{
	border-right: 1px dotted #434343;
	margin:0;
	padding:0;
	height:30px;
}
.basic-links a{
	padding: 0 15px;
	line-height:30px;
}
.social-links{
	float:right;
	margin:0;
	padding:5px 15px;
}
.social-links a{
	margin:4px 3px 0;
	color:#000;
	font-size: 16px;
}

.content-menu-bar{
	width:100%;
	max-width:1200px;
	margin:0 auto;
}
.header-bar {
	width:100%;
	height:30px;
	background:#bab1aa;
	font-size:12px;
	text-transform: uppercase;
	margin:0;
	padding:0;
}
.header-bar ul{
	list-style-type: none;
	text-align: right;

}
.header-bar ul li{
	display:inline-block;
}
.header-bar a{
	color:#434343;
	text-decoration: none;
}
header nav ul{
	list-style-type: none;
}
header nav ul li{
	display:inline-block;
	height:30px;
	margin-top: 3px;
	margin:0 15px;
}
header nav a{
	font-size: 18px;
	padding: 0 0 10px;
	font-family: 'Oswald', sans-serif;
	text-decoration: none;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	padding:0;
}
.contentMainMenu{
	margin:0 auto;
	padding:0;
	max-width:1200px;
	position: relative;
}

#logo{
	position: absolute;
    left: 15px;
    right: auto;
    border-top: none;
    width: 270px;
    text-align: center;
    height: 135px;
    top: -25px;
    padding: 0 20px;
    z-index: 10;
}
#logo-header{
	height: 135px;
}
.logo-cannes{
	position: absolute;
    top: -webkit-calc( 50% - 29px);
    top: -moz-calc( 50% - 29px);
    top: calc( 50% - 29px);
    left: 20px;
    right: auto;
    border-top: none;
    width: 270px;
    text-align: center;
    height: 115px;
    top: -25px;
    padding: 0 20px;
    z-index: 10;
}
@media all and (-ms-high-contrast:none)
{
	.foo { .horloge: display:none } /* IE10 */
	*::-ms-backdrop, .horloge {  display:none } /* IE11 */
}
.logo-cannes:after{
    background-color: #fff;
    border: 10px solid #bab1aa;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: -40px;
    z-index: 50;
    transform: skew(0deg, 6deg) translateY(-15px);
    -webkit-transform: skew(0deg, 6deg) translateY(-15px);
    -moz-transform: skew(0deg, 6deg) translateY(-15px);
    -o-transform: skew(0deg, 6deg) translateY(-15px);
    -ms-transform: skew(0deg, 6deg) translateY(-15px);
}
.logo-cannes img{
	width: 100%;
    vertical-align: bottom;
    z-index: 100;
    position: relative;
    margin-top: 30px;
}
#logo-header img{
	margin: 55px auto 0;
}
header nav{
	width:100%;
	text-align: right;
	margin:0 auto;
}
header nav ul{
	padding-bottom: 0;
	padding-top:20px;
}
header nav ul .selected{
	border-bottom:3px solid #fff;
}
header nav ul .link-film.selected, header nav ul .link-film:hover{
	border-bottom: 3px solid #fc3e99;
}
header nav ul .link-partners.selected, header nav ul .link-partners:hover{
	border-bottom: 3px solid #fc3e99;
}
header nav ul .link-extern.selected, header nav ul .link-extern:hover{
	border-bottom: 3px solid #fc3e99;
}

body.accueil{
	background: url('img/background-accueil-cannes-is-yours.jpg') no-repeat center fixed;
	-webkit-background-size: cover;
	background-size: cover;

}
.main{
	margin:0 auto;
	width:100%;
	max-width: 1024px;
	text-align:center;
	padding-bottom:160px;
	min-height:600px;
}
footer * {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}
footer{
	width:100%;
	background-color: #000;
	font-family: 'Dosis', sans-serif;
	position:absolute;
	bottom:0;
	color:#fff;
}
#footer-rs{
	display: block;
	font-weight: bold;
	font-size: 24px;
	height:26px;
	line-height: 26px;
}
#sub-content-footer{
	width: -webkit-calc(100% - 620px);
	width: -moz-calc(100% - 620px);
	width: calc(100% - 620px);
	max-width:620px;
	text-align: center;
	margin:25px auto 0;
}
footer nav{
	width:100%;
	text-align: center;
	margin:0 auto;
}
footer nav ul{
	height:40px;
	padding-left:0;
}
footer nav ul li{
	display:inline-block;
	margin:0;
	padding:0;
	margin-top:10px;
}
footer nav ul li a{
	display: block;
	font-size:12px;
	color:#fff;
	text-decoration: none;
	padding:0 15px;
	border-right:1px solid #fff;
	font-size:16px;
	font-weight: bold;
	font-family: 'Dosis', sans-serif;
}
footer nav ul li:last-child a{
	border-right:none;
}
footer nav ul li a:hover{
	text-decoration: underline;
}
footer nav ul{
	margin-bottom:5px;
}
#copyright{
	text-align: center;
    color: #999999;
    font-size: 12px;
	width:100%;
	margin:0 auto;
	padding-top: 0px;
}
#copyright a{
	color:#999999;
}
#copyright a:hover{
	color:#fafafa;
}
#content-footer{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	position:relative;
	height:128px;
}

#content-logo-footer{
	position: absolute;
    left: 0;
    bottom:0;
    height:200px;
    overflow: hidden;
    width: 310px;
    text-align: center;
    padding: 0 20px;
}
#logo-footer{
	height: 200px;
}
#logo-footer img{
	margin: 100px auto 0;
}
#content-logo-footer .logo-cannes:after{
	background-color: #fff;
    border: 10px solid #bab1aa;
    bottom: -80px;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 60px;
    transform: skew(0deg, 6deg) translateY(-15px);
    -webkit-transform: skew(0deg, 6deg) translateY(-15px);
    -moz-transform: skew(0deg, 6deg) translateY(-15px);
    -o-transform: skew(0deg, 6deg) translateY(-15px);
    -ms-transform: skew(0deg, 6deg) translateY(-15px);
}
.picto-footer{
	margin:0 5px;
}
.picto-footer:hover{
	opacity:0.5;
}
h2{
	font-family: 'Oswald', sans-serif;
	color:#fff;
	font-weight:300;
	text-align: center;
	margin:0 auto;
	font-size: 2em;
}

.title-block {
    text-align: center;
}
#logos-footer{
	width:310px;
	position: absolute;
	top:0;
	right: 0;
}
#logos-footer img{
	border-right:1px solid #fff; 
}
#logos-footer #logo-palais{
	padding:0 15px;
}
#logos-footer #logo-cannes{
	padding:0 20px;
}
h3{
	color: #fff;
    font-family: 'Oswald', sans-serif;
    font-size: 14px;
    font-weight: normal;
    line-height: 0;
    padding: 30px 0 0;
    margin: 0;
    text-transform: uppercase;
	text-shadow: 1px 1px 3px rgba(0,0,0, 0.9);
}
h1{
	color: #332f3b;
    font-family: 'Oswald', sans-serif;
    font-size: 40px;
    font-weight: normal;
    letter-spacing: -1px;
    margin: 5px 0 10px;
    padding: 0;
    text-align: center;
}
.title-block .separator{
    margin-bottom: 25px !important;
    height:38px;
}
#etape-3 .content-views{
	padding-top:30px;
}
.content-views{
	width:100%;
	padding:0;
	margin: 0 auto;
	overflow: hidden;
}
.view{
	width: 100%;
	float: left;
	overflow: hidden;
    position: relative;
    bottom:0px;
  	opacity:1;
    text-align: center;
    cursor: pointer;
    background: #fff url('img/background-views-3.jpg') no-repeat center center;
    line-height: 100%;
    min-width:150px;
}
footer nav a.selected{
	text-decoration: underline;
} 
svg{
	text-align: center;
	overflow: visible;
	display: none;
}
svg circle{
	margin:auto;
}

svg #heure{
	-ms-transform: rotate(-90deg); /* IE 9 */
	-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
	transform: rotate(-90deg);
	-moz-transform-origin: 80px 80px;
	-ms-transform-origin:  80px 80px;
	-o-transform-origin: 80px 80px;
	-webkit-transform-origin:  80px 80px;
	transform-origin: 80px 80px;
	transition-duration: 2s;
	transition-timing-function: ease-in-out;
}
@keyframes adventView {

	0% {
	    -webkit-transform: translateY(500%);
	    transform: translateY(500%);
	    opacity:0;
	  }

	80% {
		opacity:1;
	    transform:translateY(-10%);
		-webkit-transform:translateY(-10%);
	}

	100% {
	    transform:translateY(0);
		-webkit-transform:translateY(0);
	}

}
.view img{
	width:100%;
	display: block;
    position: relative;
    transform: scaleY(1);
	transition: all 0.7s ease-in-out;
}
.view .mask{
    width: 100%;
    height: 100%;
    line-height: 100% !important;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    text-align: left;
    background-color: rgba(255, 231, 179, 0.3); 
    transition: all 0.5s linear;
    opacity: 0;
}

.view a{
	position: absolute;
	bottom:10px;
	left:10px;
	text-transform: uppercase;
    color: #000;
    font-weight: bold;
    font-family: 'Oswald', sans-serif;
    font-size: 1.60em;
    display:block;
    line-height:1em;
    border-left: 5px solid #000;
    width: 80%;
    padding-left:5px;
 	text-decoration: none;
    background-color: rgba(0, 0, 0, 0);
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s linear;

}
.view:hover img { 
	transform: scale(10);
    opacity: 0;
}
.view:hover .mask{ 
	opacity: 1;
}																			 
.view:hover a{ 
    transform: scale(1);
    opacity: 1;
}
.col-2{
	float: none;
	display: inline-block;
	margin:0.5%;
	max-width:-webkit-calc(94% / 3);
	max-width:-moz-calc(94% / 3);
	max-width:calc(94% / 3);

}
.col-3{
	margin:0.5%;
	max-width:-webkit-calc(94% / 3);
	max-width:-moz-calc(94% / 3);
	max-width:calc(94% / 3);

}
.col-4{
	margin:0.5%;
	max-width:-webkit-calc(96% / 4);
	max-width:-moz-calc(96% / 4);
	max-width:calc(96% / 4);

}
.col-4 a{
	font-size: 1.5em;
}

.break{
	clear: both;
	float: none;
	margin-bottom:30px;
	color:transparent;
	background: transparent;
	border:none;
}
.social-links a:hover, .header-bar a:hover{
	color:#fc3e99;
}
/*
-----------------------------------------------------------------------------------------
Accueil
--------------------------------------------------------------------------------------------
*/
#logo-accueil{
	margin:0 auto;
    margin-top: 15%;
    margin-bottom: 2%;
	width:100%;
	max-width:620px;
	height:auto;
}
.form-accueil{
	margin:25px auto;
	width:100%;
	max-width: 600px;
	height:150px;
}

.form-accueil input{
	font-family: 'Dosis', sans-serif;
	font-size: 17px;
	padding:15px 25px;
	color:#7a7a7a;
}
.form-accueil input[type="email"]{
	width: calc(100% - 160px);
	max-width: 100%;
	float: left;
}
.form-accueil input[type="submit"]{
	background:#7a7a7a;
	color:#fff;
	border: none;
	float: right;
}
.form-accueil input[type="submit"]:hover{
	background:#202020;
	color:#fff;
}
.form-accueil .left{
	width: -webkit-calc(50% - 59px);
	width: -moz-calc(50% - 59px);
	width: calc(50% - 59px);
	max-width: 50%;
	float: left;
	margin-bottom:10px;
}
.form-accueil .left:nth-child(2){
	margin-left:10px;
}
#agreement {
	display: block;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Dosis', sans-serif;
    color: #fff;
    font-weight: lighter;
    background: rgba(0,0,0,0.5);
    width:100%;
    max-width: 100%;
    height:58px;
    float: left;
    margin-top: 10px;
    line-height:14px;
    padding:10px;
}
#agreement label{
	font-size: 14px;
	float: left;
	width: -webkit-calc(100% - 30px);
	width: -moz-calc(100% - 30px);
	width: calc(100% - 30px);
	text-align: left;
	margin-top:3px;
}
#agreement input{
	margin-top:10px;
	float: left;
	width:15px;
	margin-right:10px;
}
.form-accueil input[type="checkbox"]{
	float: none;
}
.accueil h2{
	max-width:480px;
	line-height:35px;
	letter-spacing: 1px;
}
.btn-facebook{
	margin-top:25px;
}
/*
-----------------------------------------------------------------------------------------
Etape 2
--------------------------------------------------------------------------------------------
*/
#etape-2 .content-views{
	padding-top: 60px;
}

.horloge{
	position: absolute;
	top:120px;
	right:50px;
	display: none;
}
.title-block #genre{
	background: url("img/separators/separator-genre.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #matin{
	background: url("img/separators/separator-matin.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #midi{
	background: url("img/separators/separator-midi.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #apres-midi{
	background: url("img/separators/separator-apres-midi.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #diner{
	background: url("img/separators/separator-diner.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #soiree{
	background: url("img/separators/separator-soiree.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #musique{
	background: url("img/separators/separator-musique.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #final{
	background: url("img/separators/separator-final.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.title-block #loie{
	background: url("img/separators/separator-loie.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
#logout{
	cursor: pointer; 
	padding: 0 10px; 
	display: none;
	height:30px;
	line-height: 30px;
	border-left: 1px dotted #434343;
	display: none;
	color:#434343;
}
#logout.active{
	display: inline-block;
}
.time h2{
	font-family: "glamor-regular";
	font-size: 80px;
	color:#332f3b;
	margin-bottom: 0;
}

/*Tsuki CSS*/


      #container {
        text-align: center;
        width: 854px;
        height: 480px;
        margin: 50px auto;
        position: relative;
      }
    .connexion #container {
     	margin-top:0px;
     	margin-bottom: 30px;
	}

      #player {
        display: none;
        position: relative;
        z-index: 1;
      }

      #player1 {
        display: none;
        position: relative;
        z-index: 1;
      }

      #music {
        display: none;
      }

      #title {
        color: #fff;
        font-family: 'Dosis', sans-serif;
      }

      #loader {
        width: 30px;
        height: 25px;
        margin: auto;
        display: flex;
        flex-flow: row no-wrap;
        justify-content: center;
        align-items: center;
        position: absolute;
        top: 50%;
        margin-top: -12px;
        left: 50%;
        margin-left: -15px;
      }

      #loader.loaded .bar {
        width: 5px;
        height: 5px;
        margin-right: 1px;
        border-radius: 5px;
        background: #ffffff;
        flex: 1 5px;
      }
      #loader.loaded .bar:last-child {
        margin: 0;
      }
      #loader.loaded .bar:nth-child(1) {
        animation: load 0.3s ease-in-out 0.1s infinite alternate;
      }
      #loader.loaded .bar:nth-child(2) {
        animation: load 0.3s ease-in-out 0.2s infinite alternate;
      }
      #loader.loaded .bar:nth-child(3) {
        animation: load 0.3s ease-in-out 0.3s infinite alternate;
      }
      #loader.loaded .bar:nth-child(4) {
        animation: load 0.3s ease-in-out 0.4s infinite alternate;
      }
      #loader.loaded .bar:nth-child(5) {
        animation: load 0.3s ease-in-out 0.5s infinite alternate;
      }

      @keyframes load {
        100% {
          height: 25px;
        }
      }

/*********************************************************************
Nos partenaires
****************************************************************************************/
.partenaires{
	background: url('img/bg-cannes-partenaires.jpg') no-repeat center top fixed;
	background-size: cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-webkit-background-size:cover;
}

.content-partenaires{
	width:100%;
	max-width: 1200px;
}
.name-partenaire{
	position:absolute;
	top:10px;
	z-index: 100;
}
.title-block #parts{
	background: url("img/separators/separator-partenaires.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.margin-big{
	margin-top:40px;
}
.visible{
	display:block;
}

.partner{
    display: block;
    height: auto;
    float: left;
    margin: 10px;
    width: -webkit-calc(25% - 20px);
    width: -moz-calc(25% - 20px);
    width: calc(25% - 20px);
    position: relative;
    z-index: 50;
    height: 148px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.images-partner{
	width:200%;
	height:100%;
	max-height: 100%;
	position:absolute;
	top:0;
	right:0;

}
.images-partner img{
	float: left;
	max-height: 100%;
	width:50%;
	max-width: 50%;
	margin:0;
	padding:0;
}


/*************************************************************
Pages mentions légales & CGU
*********************************************************************************/
.mentions-legales{
	background:#fff !important;
}
.content-mentions-legales h3{
	text-shadow:none;
	color:#262322;
	padding:0;
	text-align: left;
	margin:25px 0;
	text-transform: none;
	font-size: 18px;
}
.content-mentions-legales{
	text-align: left;
	color:#333;
	font-size: 16px;
	color:#000;
	font-family: 'Dosis', sans-serif;
}
.mentions-legales .content{
	padding:30px 20px 0;
}
.content-mentions-legales h2{
	color:#333;
	text-align: left;
	font-weight: 400;
	font-size: 1.5em;
}
.content-mentions-legales a{
	color:#23527c;
}
.content-mentions-legales a:hover{
	color:#ec5a62;
}


/*************************************************************
Etape musique
*********************************************************************************/
.title-block .separator.sep-music{
	background: url("img/separator-3-music.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}

#custom {
	display: none;
    color: #fff;
    position: absolute;
    top: 20%;
    margin: 0 auto;
    width: 100%;
    font-family: 'Oswald', sans-serif;
    font-weight: normal;
    font-size: 35px;
    z-index: 2;
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	transform: scale(1,1);
  -webkit-transition: transform 5s ease-in;
  -moz-transition: transform 5s ease-in;
  transition: transform 5s ease-in;
}

#custom.zoom {
  -webkit-transform: scale(1.25,1.25);
  -moz-transform: scale(1.25,1.25);
  transform: scale(1.25,1.25);
  -webkit-transition: transform 5s ease-in;
  -moz-transition: transform 5s ease-in;
  transition: transform 5s ease-in;
}


#custom img {
	width: 250px;
	margin-bottom: 30px;
}

#demo_1, #demo_2 {
	display: none;
}

#last_pannel.zoom {
  -webkit-transform: scale(1.25,1.25);
  -moz-transform: scale(1.25,1.25);
  transform: scale(1.25,1.25);
  -webkit-transition: transform 5s ease-in;
  -moz-transition: transform 5s ease-in;
  transition: transform 5s ease-in;
}


#last_pannel {
	display: none;
	-webkit-transform: scale(1,1);
	-moz-transform: scale(1,1);
	transform: scale(1,1);
 	-webkit-transition: transform 5s ease-in;
	-moz-transition: transform 5s ease-in;
	transition: transform 5s ease-in;
	color: #fff;
	font-family: 'Oswald', sans-serif;
	font-size: 22px;
	font-weight: normal;
	letter-spacing: -1px;
	margin: 5px 0px 10px;
	padding: 0px;
	text-align: center;
	position: absolute;
	z-index: 2;
	padding-top: 50px;
	width: 854px;
}

#last_pannel img.logo, #custom img.logo{
width: 350px;
margin-top: 20px;
}

#last_pannel img.social {
	width: 55px;
}

.p9 {
    font-family: 'Open Sans', sans-serif;
    position: relative;
	text-transform: uppercase;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
    display: block;
    font-size: 4.875em;
    height: 95px;
    width: 500px;
}

.music-choice {
	display: inline-block;
	margin-top: 50px;
}

.p9 a {
color: #fff;
text-decoration: none;
  width: 500px;
  height: 55px;
  line-height: 55px;
  -webkit-transition: all 0.5s cubic-bezier(0, 0.28, 0, 1);
  -moz-transition: all 0.5s cubic-bezier(0, 0.28, 0, 1);
  -ms-transition: all 0.5s cubic-bezier(0, 0.28, 0, 1);
  -o-transition: all 0.5s cubic-bezier(0, 0.28, 0, 1);
  transition: all 0.5s cubic-bezier(0, 0.28, 0, 1);
}

.p9 a:before,
.p9 a:after,
.p9 a div {
  content: '';
  height: 9px;
  background-color: #fff;
  position: absolute;
  right: 89%;
  width: 0;
}
.p9 a:before {
  top: 75px;
}
.p9 a > div:first-of-type {
  top: 43px;
}
.p9 a > div:last-of-type {
  top: 28px;
}
.p9 a:after {
  top: 59px;
}
.p9 a:hover {
  padding-left: 40px;
}
.p9 a:hover:before {
  -webkit-animation: bar1 0.8s infinite;
  -moz-animation: bar1 0.8s infinite;
  -ms-animation: bar1 0.8s infinite;
  animation: bar1 0.8s infinite;
}
@-moz-keyframes bar1 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 25px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 28px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 45px;
  }
  100% {
    width: 10px;
  }
}
@-webkit-keyframes bar1 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 25px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 28px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 45px;
  }
  100% {
    width: 10px;
  }
}
@keyframes bar1 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 25px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 28px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 45px;
  }
  100% {
    width: 10px;
  }
}
.p9 a:hover > div:last-of-type {
  -webkit-animation: bar2 0.8s infinite;
  -moz-animation: bar2 0.8s infinite;
  -ms-animation: bar2 0.8s infinite;
  animation: bar2 0.8s infinite;
}
@-moz-keyframes bar2 {
  0% {
    width: 50px;
  }
  5% {
    width: 15px;
  }
  16% {
    width: 55px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 38px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 14px;
  }
  100% {
    width: 50px;
  }
}
@-webkit-keyframes bar2 {
  0% {
    width: 50px;
  }
  5% {
    width: 15px;
  }
  16% {
    width: 55px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 38px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 14px;
  }
  100% {
    width: 50px;
  }
}
@keyframes bar2 {
  0% {
    width: 50px;
  }
  5% {
    width: 15px;
  }
  16% {
    width: 55px;
  }
  32% {
    width: 18px;
  }
  50% {
    width: 38px;
  }
  66% {
    width: 50px;
  }
  73% {
    width: 14px;
  }
  100% {
    width: 50px;
  }
}
.p9 a:hover > div:first-of-type {
  -webkit-animation: bar3 0.8s infinite;
  -moz-animation: bar3 0.8s infinite;
  -ms-animation: bar3 0.8s infinite;
  animation: bar3 0.8s infinite;
}
@-moz-keyframes bar3 {
  0% {
    width: 0;
  }
  5% {
    width: 35px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 5px;
  }
  66% {
    width: 20px;
  }
  73% {
    width: 10px;
  }
  100% {
    width: 30px;
  }
}
@-webkit-keyframes bar3 {
  0% {
    width: 0;
  }
  5% {
    width: 35px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 5px;
  }
  66% {
    width: 20px;
  }
  73% {
    width: 10px;
  }
  100% {
    width: 30px;
  }
}
@keyframes bar3 {
  0% {
    width: 0;
  }
  5% {
    width: 35px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 5px;
  }
  66% {
    width: 20px;
  }
  73% {
    width: 10px;
  }
  100% {
    width: 30px;
  }
}
.p9 a:hover:after {
  -webkit-animation: bar4 0.8s infinite;
  -moz-animation: bar4 0.8s infinite;
  -ms-animation: bar4 0.8s infinite;
  animation: bar4 0.8s infinite;
}
@-moz-keyframes bar4 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 20px;
  }
  66% {
    width: 30px;
  }
  73% {
    width: 20px;
  }
  100% {
    width: 10px;
  }
}
@-webkit-keyframes bar4 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 20px;
  }
  66% {
    width: 30px;
  }
  73% {
    width: 20px;
  }
  100% {
    width: 10px;
  }
}
@keyframes bar4 {
  0% {
    width: 10px;
  }
  5% {
    width: 5px;
  }
  16% {
    width: 15px;
  }
  32% {
    width: 25px;
  }
  50% {
    width: 20px;
  }
  66% {
    width: 30px;
  }
  73% {
    width: 20px;
  }
  100% {
    width: 10px;
  }
}

/********************************************************
Shared
***************************************************************************************/
.title-block .separator.five{
	background: url("img/separator-5.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
#black_screen {
	position: absolute;
	width: 854px;
	height: 480px;
	background: rgba(0, 0, 0, 1);
	z-index: 0;
	display: none;
}

#prevent_yt {
	position: absolute;
	bottom: 0px;
	right: 0px;
	height: 55px;
	width: 100px;
	z-index: 2;
}

#part_1 {
    position: relative;
    top: 5px;
    width: 500px;
    margin: 0 auto;
}

#partners {
    text-align: left;
    text-align: left;
    margin-top: 35px;
}

#part_2 {
	display: none;
	background-color: black;
	width: 682px;
    margin-left: 86px;
    height: 371px;
    margin-right: 180px;
}
/******************************************************************************
Page Contact
*********************************************************************************/
.contact{
	background: url('img/background-contact-cannes-is-yours.jpg') no-repeat center top fixed;
	background-size: cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-webkit-background-size:cover;
}

.contact .content-mentions-legales{
	background-color: rgba(255,255,255,0.8);
	padding:20px;
}

/**************************************************************************
Video
*******************************************************************************/
.title-prepare{
	color:#f34aa2;
	font-size: 22px;
	font-weight: bold;
}
a.btn-reserver{
	display: block;
	padding:5px 20px;
	width:80px;
	background-color:#f34aa2;
	color:#fff;
	text-align: center;
	border-radius: 8px 8px;
	margin: 0 auto;
	text-decoration: none;
	font-size: 18px;
	font-weight: 400;
}
a.btn-reserver:hover{
	color:#fff;
	background-color: #bf3d81;
}
.title-partage{
	font-size: 18px;
	padding-bottom:0;
	margin-bottom: 0;
}
#shared {
	padding:0;
	margin-top: 0;
	margin-bottom: 15px;
}
#shared a{
	font-family: 'Dosis', sans-serif;
	color: #3688BB;
	font-size: 18px;
}
#last_pannel h2,#part_1 h2{
	font-size: 1.2em;
	color:#f34aa2;
	margin-bottom: 10px
}
#last_pannel img.logo{
	margin-top: 0px
}
a#email_share {
margin-left: 3px;
}
#facebook_share, #twitter_share,#email_share{
	margin-top:10px;
}
#cache{
	width: 854px;
    height: 480px;
	min-height: 100%;
	position: absolute;
	top:0;
	z-index: 100000000000;
}
a#email_share{
	cursor:pointer;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	svg { display:none!important; } 
}
