/* 
Theme Name: themePopArt

Theme URI: http://www.popartclub.com/themePopArt

Description: Incredibly high level design and skinning possibilities theme

Author: Amandine Bachimont

Version: 1.0

License: GNU General Public License

Author URI:http://www.AmandineBachimont.com

Tags: ajax, design, beautiful, blabla
*/
#IE8 .it-wrapper img{margin:-310px 0 0 0;float:left;}#IE8 .it-wrapper2 img{margin:-290px 0 0 0;float:left;}#IE8 .it-wrapper3 img{margin:-260px 0 0 0;float:left;}
img{
border:none;
}


html{
	background-color:#1e1d20;
}

body{
	margin:0;
    padding:0;
	list-style-type: none;
	margin-left: auto;
	margin-right: auto;
	width: 1040px;
	border: none; 
	font-weight: 400; 
}
.clearboth{	clear:both;}
#container{
	margin:-25px 0 0 0;
	padding:0;
	width: 1040px;
	height:auto;
	background-image:url(img/fond.png);
	box-shadow: 0 6px 6px 0 #000000;
}

#footer{
	margin-top:-50px;
	padding:0;
	width:1040px;
	height:408px;
	float:left;
	background-image:url(img/fondfooter.png);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-accueil{
	margin:0;
	padding:0;
	width: 1040px;
	height:1430px;
	background-image:url(img/fond-accueil.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-erreur{
	margin:0;
	padding:0;
	width: 1040px;
	height:600px;
	background-image:url(img/fond-accueil.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#content-accueil{
	margin:0;
	padding:0;
	width: 1040px;
	height:auto;
}

#container-agenda{
	margin:0;
	padding:0;
	width: 1040px;
	background-image:url(img/fond-agenda.jpg);		background-repeat:no-repeat;
	background-color:#000000;
	box-shadow: 0 6px 6px 0 #000000;
}

#container-presentation{
	margin:0;
	padding:0;
	width: 1040px;
	height:2100px;
	background-image:url(img/fond-presentation-terminer.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-reservation{
	margin:0;
	padding:0;
	width: 1040px;
	height:1500px;
	background-image:url(img/fond-accueil.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-info{
	margin:0;
	padding:0;
	width: 1040px;
	height:1150px;
	background-image:url(img/fond-agenda.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-plan{
	margin:0;
	padding:0;
	width: 1040px;
	height:1170px;
	background-image:url(img/fond-agenda.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-contact{
	margin:0;
	padding:0;
	width: 1040px;
	height:900px;
	background-image:url(img/fond-agenda.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

#container-presse{
	margin:0;
	padding:0;
	width: 1040px;
	height:1350px;
	background-image:url(img/fond-agenda.jpg);
	box-shadow: 0 6px 6px 0 #000000;
}

/* ESPACE PRESSE */
.videopresse{
	margin:180px 60px 60px 60px;
	width:950px;
	height:650px;
}

#video{
	float:left;
	margin-top:60px;
}

.videopresse p{
color:#fff;
font-size:20px;
margin-top:0px;
margin-left:30px;
position: absolute;
width:800px;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
float:left;
}

#presse-titre h2 {
    color: #FFFFFF;
    float: left;
    font-size: 25px;
    height: 50px;
    margin: 45px 0 0 45px;
    padding: 0;
    text-shadow: 2px 1px 30px #000000;
    width: 250px;
}
/* FIN ESPACE PRESSE */

li{ font-family: ‘Lato’, Arial, serif; font-weight: 400; }

span{ font-family: ‘Lato’, Arial, serif; font-weight: 400; }

h4{ font-family: ‘Lato’, Arial, serif; font-weight: 400; color:#fff;}

#container img {
border: none; 
}

#texte-presentation{
margin-top:310px;
margin-left:320px;
position: absolute;
width:400px;
padding:0;
}

#texte-presentation2{
color:#fff;
font-size:16px;
margin-top:420px;
position: absolute;
width:800px;
}

#texte-presentation2 h2{
color:#fff;
font-size:20px;
margin-top:0px;
margin-left:30px;
position: absolute;
width:800px;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:30px;
}

/* MENU1 */

-moz-transition: all .5s; 
-webkit-transition: all .5s; 
-o-transition: all .5s; 
transition: all .5s;

#menu1{
    height: 150px;
    width: 220px;
	position:absolute;
}
 
#menu1 ul {
    padding: 0;
    margin: 0;
    margin-left: 20px;
    margin-top:30px;
    float:left;
}
 
#menu1 ul li {
    list-style: none;
    padding: 0px;
}
 
#menu1 ul li a {
    text-decoration: none;
    font-size: 16px;
    padding: 4px;
    display: block;
    color: white;
    background: transparent;
    width: 230px;
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -o-transition: all .5s; 
    transition: all .5s;
    line-height: 20px;
}
 
#menu1 ul li a:hover {
    background: #6CC4B0;
    padding-left: 20px;
    width: 200px;
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -o-transition: all .5s; 
    transition: all .5s;
}



/* EFFET SOIREES 1 */

#works {
    margin-bottom: 40px;
    overflow: hidden;
}
 
#works .work {
    /* Voici le overflow:hidden qui permet de cacher les triangles et de ne les voir apparaitre que lorsqu'ils sont dedans la div */
    overflow: hidden;
    width:311px;
    height: 457px;
    border: 4px solid #222;
    cursor: pointer;
    position: relative;
    -moz-transition: all .6s; 
    -webkit-transition: all .5s; 
    -o-transition: all .6s; 
    transition: all .6s;
    float: left;
    margin-right: 20px;
    margin-bottom:50px;
}
 
#works .work:hover {
    border: 4px solid #AAA5B4;
}
 
#works .work .triangle-droite {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-violet2.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à droite lorsqu'on n'est pas en :hover */
    right: -312px;
    bottom: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works .work:hover .triangle-droite {
    /* Voici la position du triangle à droite lorsqu'on est en :hover */
    right: 0;
    bottom: 0;
}
 
#works .work .triangle-gauche {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-violet.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à gauche lorsqu'on n'est pas en :hover */
    left: -311px;
    top: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works .work:hover .triangle-gauche {
    /* Voici la position du triangle à gauche lorsqu'on est en :hover */
    left: -1px;
    top: -1px;
}
 
#works .work span {
    color: #FFF;
    text-transform: uppercase;
    font-size: 20px;
    text-align: center;
    position: absolute;
    /* Voici la position du span lorsqu'on n'est pas en :hover */
    top: 210px;
    left: -280px;
    background: #434443;
    padding-left: 70px;
    padding-right: 8px;
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -o-transition: all .5s; 
    transition: all .5s;
}
 
#works .work:hover span {
    /* Voici la position du span lorsqu'on est en :hover */
    left: 0px;
}

/* EFFET SOIREES 2 */

#works2 {
    margin-bottom: 40px;
    overflow: hidden;
}
 
#works2 .work2 {
    /* Voici le overflow:hidden qui permet de cacher les triangles et de ne les voir apparaitre que lorsqu'ils sont dedans la div */
    overflow: hidden;
    width:311px;
    height: 457px;
    border: 4px solid #222;
    cursor: pointer;
    position: relative;
    -moz-transition: all .6s; 
    -webkit-transition: all .5s; 
    -o-transition: all .6s; 
    transition: all .6s;
    float: left;
    margin-right: 20px;
    margin-bottom:50px;
}
 
#works2 .work2:hover {
    border: 4px solid #AAA5B4;
}
 
 
#works2 .work2 .triangle-droite2 {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-ocre-copie2.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à droite lorsqu'on n'est pas en :hover */
    right: -312px;
    bottom: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works2 .work2:hover .triangle-droite2 {
    /* Voici la position du triangle à droite lorsqu'on est en :hover */
    right: 0;
    bottom: 0;
}
 
#works2 .work2 .triangle-gauche2 {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-ocre-copie.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à gauche lorsqu'on n'est pas en :hover */
    left: -311px;
    top: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works2 .work2:hover .triangle-gauche2 {
    /* Voici la position du triangle à gauche lorsqu'on est en :hover */
    left: -1px;
    top: -1px;
}
 
#works2 .work2 span {
    color: #FFF;
    text-transform: uppercase;
    font-size: 20px;
    text-align: center;
    position: absolute;
    /* Voici la position du span lorsqu'on n'est pas en :hover */
    top: 210px;
    left: -280px;
    background: #434443;
    padding-left: 70px;
    padding-right: 8px;
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -o-transition: all .5s; 
    transition: all .5s;
}
 
#works2 .work2:hover span {
    /* Voici la position du span lorsqu'on est en :hover */
    left: 0px;
}

/* EFFET SOIREES 3 */

#works3 {
    margin-bottom: 40px;
    overflow: hidden;
}
 
#works3 .work3 {
    /* Voici le overflow:hidden qui permet de cacher les triangles et de ne les voir apparaitre que lorsqu'ils sont dedans la div */
    overflow: hidden;
    width:311px;
    height: 457px;
    border: 4px solid #222;
    cursor: pointer;
    position: relative;
    -moz-transition: all .6s; 
    -webkit-transition: all .5s; 
    -o-transition: all .6s; 
    transition: all .6s;
    float: left;
    margin-right: 20px;
    margin-bottom:50px;
}
 
#works3 .work3:hover {
    border: 4px solid #AAA5B4;
}
 
#works3 .work3 .triangle-droite3 {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-violet2.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à droite lorsqu'on n'est pas en :hover */
    right: -312px;
    bottom: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works3 .work3:hover .triangle-droite3 {
    /* Voici la position du triangle à droite lorsqu'on est en :hover */
    right: 0;
    bottom: 0;
}
 
#works3 .work3 .triangle-gauche3 {
    background: url(http://www.popartclub.com/wp-content/uploads/2016/03/triangle-gauche-violet.png);
    width: 312px;
    height: 458px;
    position: absolute;
    /* Voici le décalage du triangle à gauche lorsqu'on n'est pas en :hover */
    left: -311px;
    top: -458px;
    -moz-transition: all .6s; 
    -webkit-transition: all .6s; 
    -o-transition: all .6s; 
    transition: all .6s;
}
 
#works3 .work3:hover .triangle-gauche3 {
    /* Voici la position du triangle à gauche lorsqu'on est en :hover */
    left: -1px;
    top: -1px;
}
 
#works3 .work3 span {
    color: #FFF;
    text-transform: uppercase;
    font-size: 20px;
    text-align: center;
    position: absolute;
    /* Voici la position du span lorsqu'on n'est pas en :hover */
    top: 210px;
    left: -280px;
    background: #434443;
    padding-left: 70px;
    padding-right: 8px;
    -moz-transition: all .5s; 
    -webkit-transition: all .5s; 
    -o-transition: all .5s; 
    transition: all .5s;
}
 
#works3 .work3:hover span {
    /* Voici la position du span lorsqu'on est en :hover */
    left: 0px;
}

/* PAGE DACCUEIL */

#contenu-accueil{
	float:left;
	width:1040px;
}

#sidebar1{
	position:absolute;
	margin:0;
	width:1040px;
    height: 300px;
    padding: 0px;
}

#text-6 {
	position:absolute;
	margin-top:20px;
	margin-left:20px;
	width: 320px;
    height: 293px;
}

#text-7  {
	position:absolute;
	margin-top:20px;
	margin-left:360px;
	width: 320px;
    height: 293px;
}

#text-8  {
	position:absolute;
	margin-top:20px;
	margin-left:700px;
	width: 320px;
    height: 293px;
}

#sidebar-bas{
    padding: 0px;
    margin-top:315px;
    position:absolute;
}

#sidebar2{
	height:270px;
	width:230px;
    padding: 0px;
    margin-top:210px;
	margin-left:125px;
    position:absolute;
}

#sidebar2 p{
color:#ececec;
padding:0;
width:140px;
height:30px;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:13px;
position:absolute;
margin:198px 0 0 60px;
}

#sidebar2 a{
float:left;
}

#sidebar4 p{
color:#ececec;
margin:10px 0 0 0;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:13px;
text-align:center;
}

#sidebar3{
	width: 95px;
    height: 200px;
    padding: 0px;
    margin:210px 0 0 403px;
    position:absolute;
}

#photos {
	margin-top:0;
    margin-left:20px;
    height:270px;
	width:230px;
    overflow:hidden;
}

 
#photos a img {
    opacity: 0.7;/* l'opacite que vous voulez au depart */
    border: none;/* enlever les border d'une image en lien */
    -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
    filter: alpha(opacity = 25); /* Hack IE 5-7 */
    -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
    -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
    -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
    transition: opacity 0.5s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */
 
}
 
#photos a:hover img, #photos a:focus img {
    opacity: 1; /* opacite au survol */
    -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */
    filter: alpha(opacity = 90); /* Hack IE 5-7 */   
}

#facebook a img {
    opacity: 0.7;/* l'opacite que vous voulez au depart */
    border: none;/* enlever les border d'une image en lien */
    -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
    filter: alpha(opacity = 25); /* Hack IE 5-7 */
    -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
    -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
    -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
    transition: opacity 0.5s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */
    box-shadow: 0 8px 8px 0 #000000;
}

#facebook a:hover img, #facebook a:focus img {
    opacity: 1; /* opacite au survol */
    -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */
    filter: alpha(opacity = 90); /* Hack IE 5-7 */
    box-shadow: 0 8px 8px 0 #000000;
}

#facebook{
	margin: 7px 0 0 0;
	width: 95px;
    height: 95px;
}

#youtube{
	margin-top:24px;
	width: 95px;
    height: 95px;
}

#youtube a img {
    opacity: 0.7;/* l'opacite que vous voulez au depart */
    border: none;/* enlever les border d'une image en lien */
    -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
    filter: alpha(opacity = 25); /* Hack IE 5-7 */
    -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
    -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
    -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
    transition: opacity 0.5s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */
    box-shadow: 0 8px 8px 0 #000000;
}

#youtube a:hover img, #youtube a:focus img {
    opacity: 1; /* opacite au survol */
    -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */
    filter: alpha(opacity = 90); /* Hack IE 5-7 */
}

#diaporama{
	width: 1024px;
	height:270px;
   	padding:0; 
   	margin:0;	
}

#titre{
float:left;
margin:0px;	
}

#titre h1{
width:400px;
overflow:hidden;
color:#f0f0f1; 	
margin:-94px 0 0 488px;
float:left;
font-family: Impact, "Arial Black", sans-serif;
letter-spacing:5px;
font-size:53px;
text-shadow: 4px 2px 4px #000000;
}

#titre h2{
width:400px;
font-family: 'Ubuntu', sans-serif,Arial;
font-weight: 300;
font-size:17px;
text-shadow: 4px 2px 4px #000000;
float:left;
margin:-32px 0 0 489px;
letter-spacing:2px;
word-spacing:5px;
color:#87888a;
}

#titre span{
width:400px;
font-family: 'Ubuntu', sans-serif,Arial;
font-weight: 400;
font-size:13px;
text-shadow: 4px 2px 4px #000000;
float:left;
margin:-10px 0 0 489px;
letter-spacing:2px;
word-spacing:5px;
color:#ea9143;
}

h2{ font-family: ‘Lato’, serif; font-weight: 400;}

#sidebar4{
	margin:190px 0 0 520px;
	background: url(img/fond-video.png);
	width:400px;
    height:289px;
    padding: 0px;
    position:absolute;
}

#sidebar4 li{
	margin:14px 15px 15px 15px;
}

#reservation  img{
    width: 200px;
    height: 200px;
float:left;
 margin:50px 0 0 -60px;
}

#bt-reserv-accueil a{
    width: 208px;
    height: 49px;
float:left;
 margin:220px 0 0 -200px;
}

#newsletter{
	width: 208px;
    height: 49px;
    float:right;
}


/* PAGE AGENDA */

#reservation2 img{
    width: 200px;
    height: 200px;
	position:absolute;
	margin:0 0 0 20px;
}

#bt-reserv-agenda a{
 width: 208px;
 height: 49px;
 position:absolute;
 margin:170px 0 0 20px;
}

.date-titre{
	background: url(img/date.png);
	width:150px;
	height:150px;
	position:absolute;
	margin-top:-150px;
	margin-left:-18px;
}

#article iframe{
margin-top:20px;
}

#article  p{
margin-left:23px;
margin-top:23px;
}

#article h2{
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	color: #C4C2CC;
    font-family: ‘BebasNeueRegular’,'Arial Narrow',Arial,sans-serif;
    font-size: 27px;
    font-weight: 400;
    margin:0;
    float:left;
    text-align: center;
    text-shadow: 0 2px 0 #000000;
	width:60px;
	margin:28px 0 0 45px;
}

h2{ font-family: ‘Lato’, Arial, serif; font-weight: 400; }
p{ font-family: ‘Lato’, Arial, serif; font-weight: 400;}
 
.article img{
	border: none; 
	width:312px;
	height:312px;
	margin:0;
	padding:0;
	float:left;
	box-shadow: 0 4px 4px 0 #24262b;
	border-radius:5px;
	-mos-border-radius:5px;
	-webkit-border-radius:5px;
}

.article {
	float:left;
	width:690px;
	height:365px;
	margin:120px 0px 65px 310px; 
	background: url(img/fond-article.png);
	border-radius:15px;
	-mos-border-radius:15px;
	-webkit-border-radius:15px;
}

.article p{
	width:312px;
	height:312px;
	float:left;
	font-size:13px;
	color:#c4c8d0;
	font-family: ‘Lato’, sans-serif;
	font-weight: 300;
	text-shadow: 2px 2px 2px #24262b;
	word-spacing:1px;
	text-align:justify;
	line-height:18px;
}

.article a{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #968aa8), color-stop(1, #121211) );
	background:-moz-linear-gradient( center top, #968aa8 5%, #121211 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#968aa8', endColorstr='#121211');
	background-color:#968aa8;
	-webkit-border-top-left-radius:5px;
	-moz-border-radius-topleft:5px;
	border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	border-top-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomright:5px;
	border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-radius-bottomleft:5px;
	border-bottom-left-radius:5px;
	text-indent:0px;
	border:1px solid #58555c;
	display:inline-block;
	color:#ffffff;
	font-family:Trebuchet MS;
	font-size:12px;
	font-weight:bold;
	font-style:normal;
	height:35px;
	line-height:35px;
	width:100px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #171716;
	
	float:right;
	margin:0;
}

.article a:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #121211), color-stop(1, #968aa8) );
	background:-moz-linear-gradient( center top, #121211 5%, #968aa8 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#121211', endColorstr='#968aa8');
	background-color:#121211;
}

.article a:active {
	position:relative;
	top:1px;
}

#agenda-titre h2{
width:170px;
height:50px;
margin:45px 0px 0px 115px;
padding:0;
color:#FFFFFF;
font-size:25px;
text-shadow: 2px 1px 30px #000;
float:left;
}

#menu-agenda{
width:250px;
height:230px;
margin-top:110px;
margin-left:32px;
padding:0;
position:absolute;
background: url(img/fond-menu-article.png);
}

#prochaines-soirees{
margin-top:105px;
margin-left:18px;
}

#soirees-passes{
margin-top:5px;
margin-left:18px;
}


.rond-reservation{
	position:absolute;
	margin-top:360px;
	margin-left:50px;
}

.ch-item {
	width: 220px;
	height: 220px;
	border-radius: 50%;
	position: relative;
	cursor: default;
	box-shadow: 
		inset 0 0 0 16px rgba(255,255,255,0.6),
		0 1px 2px rgba(0,0,0,0.1);
		
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}

.ch-img-1 { 
	background-image: url(img/1.png);
}

.ch-info {
	position: absolute;
	background: rgba(77,242,202, 0.8);
	width: inherit;
	height: inherit;
	border-radius: 50%;
	opacity: 0;
	
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	
	-webkit-backface-visibility: hidden;

}

.ch-info h3 a{
	text-align:center;
	display: block;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 22px;
	margin: 0 30px;
	padding: 65px 0 0 0;
	height: 140px;
	font-family: 'Open Sans', Arial, sans-serif;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.7);
}              

.ch-item:hover .ch-info {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

.ch-item:hover .ch-info p {
	opacity: 1;
}


.navigation{
	width:300px;
	heigth:auto;
	color:white;
}

/* PAGE RESERVATION */

#rond-reservation-form{
margin:30px 0 0 188px;
}

#rond-reservation-form p{
margin: -80px 0 0 188px;
padding: 0 0 50px 30px;
color:#FFF;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:14px;
width:500px;
position:absolute;
}

#formulaire{
width:370px;
height:420px;
color:#ffffff;margin:0 0 0 70px;
font-size: 12px;
background: url(img/fond-formulaire.png);
}

#titre-form h4{
color:#fff;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:16px;
position:absolute;
width:370px;
text-align:center;
margin-top:30px;
}

#formulaire ul{
margin-top:50px;
padding:15px 15px 25px 15px;
width:30px;
list-style-type:none;
float:left;
}

#formulaire li{
margin-top:5px;
}.wpcf7 p{padding-top:5px;}

#champs-saisi{
margin-top:50px;
margin-right:50px;
float:right;
width:250px;
}

#nom{
float:left;
margin-top:16px;
}

#date{
margin-top:16px;
}

#email{
margin-top:10px;
}

#tel{
margin-top:10px;
}

select{
float:right;margin-top:-40px;margin-right:90px;
width:60px;background-color:#2f2f31;border-radius:4px;
}.wpcf7 p{margin-top:20px;}
#select input{
float:right;
width:60px;
margin-top:-35px;
}
.wpcf7-list-item{
width:70px;
height:50px;
float:left;
color:#9794ab;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:13px;
padding-left:30px;
}

#formulaire form{
width:300px;
height:420px;
float:left;
margin-top:60px;
margin-left:10px;
}

input{	
background-color:#2f2f31;
-webkit-border-radius: .4em;
-moz-border-radius: .4em;
border-radius: .4em;

-moz-box-shadow:0 -1px 0 0px #000;
-webkit-box-shadow:0 -1px 0 0px #000;
box-shadow: 0 -1px 0 0px #000;

color:#858fa2;
text-shadow: 1px 1px 1px #000;
border: none;
height:25px;
padding:0 0 0 10px;
font-size:1.0em;
letter-spacing:2px;
width:270px;
}

#boutons{
width: 150px;
height:50px;
position:absolute;
margin-left:-20px;
float:left;
margin-top:120px;
}

.arrondi{
background: url(img/bouton-effacer.png);
border:none;
width:110px;
height:40px;
cursor:pointer;
}

.arrondi2{
background: url(img/bouton-reserver.png);
border:none;
width:200px;
height:40px;
cursor:pointer;
float:right;
margin-right:40px;
margin-top:-40px;
}

.wpcf7-response-output{
color:white;
float:left;
margin:0px;
width: 380px;
font-size:14px;
}

.wpcf7-submit{
background: url(img/bouton-reserver.png);
border:none;
width:200px;
height:40px;
cursor:pointer;
float:left;
margin-left:230px;
margin-top:-82px;
color:white;
font-size:11px;
}

.wpcf7-not-valid-tip-no-ajax{
	font-size:8px;
	color:red;
	padding:0;
	position:relative;
	margin-top:50px;
	margin-left:100px;
}



#contact-tel{
background: url(img/contact-reservation.png);
position:absolute;
width:300px;
height:270px;
margin:-550px 0 0 570px;
}

#vip{
float:right;
margin:-250px 130px 0 0;
}

#vip p{
margin:-120px 0 0 0;
color:#fff;
padding: 40px 20px 20px 20px;
text-shadow: 1px 1px 1px #000;
font-size:14px;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-align:center;
}

span .wpcf7-list-item{
margin-top:-30px;
float:left;
}

.wpcf7-list-item input{
float:right;
width:20px;
margin-left:-30px;
margin-top:-5px;
}

.wpcf7-submit{
float:left;
margin:-20px 0 0 85px;

}

#header-contact p{
color:#fff;
padding: 20px 20px 20px 20px;
text-shadow: 1px 1px 1px #000;
font-size:14px;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
margin-top:10px;
text-align:center;
}

p #header-contact{
margin-top:10px;
}

#contact-reserv{
width:150px;
margin-left:135px;
}

#contact-reserv2 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:13px;
padding:0;
margin:0;
}

#contact-reserv1 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#contact-reserv-texte p {
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
font-size:13px;
}

#fond-salles-reserv {
background: url(img/plan-salles.png);
background-repeat: no-repeat;
width:450px;
height:350px;
position:absolute;
margin:30px 0px 0px 250px;;
}

#plan-salle1-reserv {
background: url(img/plan-salles1.png);
background-repeat: no-repeat;
width:350px;
height:300px;
position:absolute;
margin: 270px 0px 0px 90px;;
}

#plan-salle2-reserv {
background: url(img/plan-salles2.png);
background-repeat: no-repeat;
width:350px;
height:300px;
position:absolute;
margin: 75px 0px 0px 630px;;
}

#salle1-titre-reserv{
margin: 100px 0px 0px 320px;
position:absolute;
text-align:center;
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
font-size:25px;
    font-weight: 400;
    text-align: center;
    text-shadow: 0 2px 0 #000000;
}

#salle2-titre-reserv{
margin: 255px 0 0 150px;
position:absolute;
text-align:center;
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:25px;
}


#salle1-texte-reserv{
width:150px;
height:150px;
position:absolute;
margin: 150px 0px 0px 285px;
color:#e2e3e4;
font-size:14px;
text-align:center;
padding-top:20px;
}

#salle2-texte-reserv{
width:150px;
height:150px;
position:absolute;
margin: 295px 0px 0px 130px;
color:#e2e3e4;
font-size:14px;
text-align:center;
}

/* PLAN DACCES */

#titre{
margin-top:250px;
margin-left:140px;
width:450px;
position:absolute;
color:#DBD8E5;
font-size:20px;
text-shadow: 2px 2px 2px #000;
}

#titre2{
margin-top:320px;
margin-left:140px;
width:450px;
position:absolute;
color:#AAA5B4;
font-size:20px;
text-shadow: 1px 1px 1px #000;
}

#titre3{
margin-top:356px;
margin-left:140px;
width:450px;
position:absolute;
color:#DF8177;
font-size:20px;
text-shadow: 1px 1px 1px #000;
}

#plan-titre h2{
width:250px;
height:50px;
margin:45px 0px 0px 50px;
padding:0;
color:#FFFFFF;
font-size:19px;
text-shadow: 2px 1px 30px #000;
float:left;
}

#adresse-plan {
width:253px;
height:362px;
margin-top:155px;
margin-left:200px;
background: url(img/fond-plan-voiture.png);
}

#adresse-popart p{
width:205px;
height:85px;
color:white;
padding:30px 20px 20px 20px;
text-align:center;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 2px 2px 2px #000;
font-size:18px;
}

#titre-voiture{
padding:0;
margin-left:120px;
}

#titre-voiture1 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
padding:0;
margin:0;
}

#titre-voiture2 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#temps {
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
width:240px;
padding-top:48px;
padding-left:62px;
font-size:12px;
}

#temps p{
margin: 0 18px 18px 0px;
}

#parkings {
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
width:220px;
height:110px;
margin-top:0px;
margin-left:230px;
font-size:13px;
background: url(img/fond-plan-parking.png);
}

#titre-parking{
padding:20px 0 0 0;
margin-left:90px;
}

#titre-parking1 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
padding:0;
margin:0;
}

#titre-parking2 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#metres{
margin-left:92px;
font-size:12px;	
}

#metres2{
margin-left:92px;
font-size:11px;	
margin-top:-8px;
color:#89869c;
}

#parkings-2 {
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
width:220px;
height:110px;
margin-top:-10px;
margin-left:230px;
font-size:13px;
background: url(img/fond-plan-parking.png);
}

#titre-parking-2{
padding:20px 0 0 0;
margin-left:90px;
}

#titre-parking1-2 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
padding:0;
margin:0;
}

#titre-parking2-2 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#metres-2{
margin-left:92px;
font-size:12px;	
}

#metres2-2{
margin-left:92px;
font-size:11px;	
margin-top:-8px;
color:#89869c;
}

#parkings-3 {
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
width:220px;
height:110px;
margin-top:-10px;
margin-left:230px;
font-size:13px;
background: url(img/fond-plan-parking.png);
}

#titre-parking-3{
padding:20px 0 0 0;
margin-left:90px;
}

#titre-parking1-3 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
padding:0;
margin:0;
}

#titre-parking2-3 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#metres-3{
margin-left:92px;
font-size:12px;	
}

#metres2-3{
margin-left:92px;
font-size:11px;	
margin-top:-8px;
color:#89869c;
}

#parkings-4 {
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
width:220px;
height:110px;
margin-top:-10px;
margin-left:230px;
font-size:13px;
background: url(img/fond-plan-parking.png);
}

#titre-parking-4{
padding:20px 0 0 0;
margin-left:90px;
}

#titre-parking1-4 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
padding:0;
margin:0;
}

#titre-parking2-4 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:0;
}

#metres-4{
margin-left:92px;
font-size:12px;	
}

#metres2-4{
margin-left:92px;
font-size:11px;	
margin-top:-8px;
color:#89869c;
}


#carte{
width:420px;
height:410px;
float:right;
margin:-330px 155px 0 0;
}

.carte{
border-radius:7px;
}

#zebu{
width:302px;
height:186px;
margin-top:-215px;
margin-right:274px;
background: url(img/fond-plan-zebu.png);
float:right;
}

#titre-zebu{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:26px;
margin: 10px 0 0 160px;
}

#texte-zebu{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:12px;
margin: -10px 0 0 160px;
}

#texte-zebu2{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:12px;
margin: 10px 0 0 160px;
}

#lien-zebu{
padding:0;
margin: 20px 0 0 160px;
}

#lien-zebu a{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:18px;
}

#lien-zebu a:hover{
color:#89869c;
text-shadow: 1px 1px 1px #000;
}



/* CONTACT */

#contact2{
background: url(img/fond-contact2.png);
width:310px;
height:490px;
margin-left:370px;
margin-top:100px;
}

#contact4 p{
color:#ffe8a1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:16px;
padding:0;
margin-top:5px;
}

#contact3 p{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:22px;
margin:0px;
}

#contact22 {
padding-left:70px;
padding-top:220px;
}

#contact-texte p {
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
font-size:15px;
margin-top:50px;
}

#contact-texte2 p {
color:#d5d3e1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
font-size:17px;
margin-top:20px;
text-align:center;
margin-left:-77px;
}

#contact-texte2 a {
color:#d5d3e1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
font-size:17px;
margin-top:20px;
text-align:center;
margin-left:-77px;
}

#contact-titre h2{
width:170px;
height:50px;
margin:45px 0px 0px 115px;
padding:0;
color:#FFFFFF;
font-size:25px;
text-shadow: 2px 1px 30px #000;
float:left;
}

#contact-booking{
float:right;
margin:-500px 50px 0 0;
}

.contact-booking-titre{
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:22px;
margin:-150px 0 0 30px;
}

.contact-booking-texte a{
color:#d5d3e1;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
font-size:17px;
text-align:center;
}

/* PRESENTATION diapo */
#diapo-presentation{
margin-top:580px;
padding:0;
width:1040px;
height:300px;
position:absolute;
}
/*
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
*/
.it-wrapper{
	padding:0px;
	width: 1040px;
	height:150px;
	margin:0px 0 0 220px;
}

.it-wrapper2{
	padding:0px;
	width: 1040px;
	height:150px;
	margin:-150px 0 0 170px;
}

.it-wrapper3{
	padding:0px;
	width: 1040px;
	height:150px;
	margin:30px 0 0 220px;
}
/*
.it-wrapper h3{
	font-size: 100px;
	line-height: 188px;
	padding: 150px 0px 60px;
	color: rgba(255, 255, 255, 0.9);
	font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
	text-shadow: 7px 2px 0 rgba(000,000,000,0.6);
	
	-webkit-text-stroke: 5px rgba(255,255,255,0.5);
	
	background: url(fond-plan.png);
	background-repeat: no-repeat;
	background-image: url(img/image-gauche.png), url(img/image-droite.png);
	background-position: 50% 50%;
	-moz-background-size: 100%;
	background-size: 100%;
	-webkit-background-size: 100%;
	-o-background-size: 100%;
	
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;

	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
	
	-moz-border-radius: 30px;
	-moz-box-shadow: 0px 0px 1px 8px rgba(255, 255, 255, 0.2);
	
	border-radius:7px;
	
}
.it-wrapper h3.it-animate{
	background-size: 50%;
	background-position: 0% 50%, 100% 50%;
	color: rgba(255,255,255, 0.6);
	
	-moz-box-shadow: 0px 0px 1px 8px rgba(37, 13,180, 0.4);
}
*/


.it-toggle-button{
	width:300px;
	height:300px;
	padding:0px;
	display: inline-block;
	background: url(img/fond-popart-presentation.png);
	margin-left:371px;
	margin-top:-457px;
	position:absolute;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
}
.it-toggle-button:hover{
	background: url(img/fond-popart-presentation-hover.png);
}

.it-wrapper img{
opacity:0;
}

.it-wrapper img.it-animate{
	transform:translate(0,-310px);
	-webkit-transform:translate(0,-310px);
	-o-transform:translate(0,-310px);
	-moz-transform:translate(0,-310px);
	
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
	
	
	opacity:1;
}

.it-wrapper2 img{
opacity:0;
}

.it-wrapper2 img.it-animate2{
	transform:translate(0,-310px);
	-webkit-transform:translate(0,-310px);
	-o-transform:translate(0,-310px);
	-moz-transform:translate(0,-310px);
	
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
	transition: all 0.7s linear;
	
	opacity:1;
}

.it-wrapper3 img{
opacity:0;
}

.it-wrapper3 img.it-animate3{
	transform:translate(0,-290px);
	-webkit-transform:translate(0,-290px);
	-o-transform:translate(0,-290px);
	-moz-transform:translate(0,-290px);
	
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
	transition: all 0.7s linear;
	
	opacity:1;
}

/*PRESENTATION */

#fond2-pres{
background: url(img/fond-pres.png);
width:1040px;
height:495px;
margin-top:-310px;
height: 495px;
}
	
#salle1{
position:absolute;
width:180px;
height:180px;
margin-top:820px;
margin-left:30px;
}

#salle1-titre p{
position:absolute;
width:170px;
height:40px;
margin:20px 0px 0px 20px;
text-align:center;
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:22px;
}

#salle1-texte p{
position:absolute;
width:190px;
height:90px;
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:90px 0px 0px 10px;
text-align:center;
}

#salle2{
position:absolute;
width:180px;
height:180px;
margin-top:820px;
margin-left:810px;
}

#salle2-titre p{
position:absolute;
width:170px;
height:40px;
margin:30px 0px 0px 0px;
text-align:center;
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:22px;
}

#salle2-texte p{
position:absolute;
width:190px;
height:90px;
color:white;
padding:0;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
margin:90px 0px 0px 0px;
text-align:center;
}

#titre-pres1{
color: #e8ebee;
    display: inline-block;
    float: left;
    font-family: ‘BebasNeueRegular’,'Arial Narrow',Arial,sans-serif;
    font-size:42px;
    font-weight: 400;
    text-align: center;
    text-shadow: 0 2px 0 #000000;
    margin: 0 0 0 100px;
    width:600px;
}

#titre-pres2{
color: #e8ebee;
    display: inline-block;
    float: left;
    font-family: ‘BebasNeueRegular’,'Arial Narrow',Arial,sans-serif;
    font-size:34px;
    font-weight: 400;
    text-align: center;
    text-shadow: 0 2px 0 #000000;
    margin: 0 0 0 100px;
    width:600px;
}

#titre-pres3{
color: #e8ebee;
    display: inline-block;
    float: left;
    font-family: ‘BebasNeueRegular’,'Arial Narrow',Arial,sans-serif;
    font-size:34px;
    font-weight: 400;
    text-align: center;
    text-shadow: 0 2px 0 #000000;
    margin: 75px 0 0 398px;
    width: 110px;
}

#texte-pop-info{
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:17px;
float:right;
margin:30px;
text-align:center;
line-height:25px;
}

#texte-vip-info{
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:17px;
float:right;
margin:50px 0 0 25px;
text-align:center;
line-height:25px;
width:400px;
padding:15px 25px 25px 25px;
}

#texte-vip-info i{
font-size:12px;	
}

#texte-vip-info p{
padding:10px;
}

#texte-vip-info-reserv{
color:#fff;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:19px;
float:left;
margin:0 0 0 480px;
text-align:center;
line-height:25px;
width:400px;
}

#texte-pres{
float:left;
margin:800px 0 0 120px;
width:800px;
}

#fond-vip{
background: url(img/fond-vip.png);
float:left;
width:910px;
height:430px;
margin:0 0 0 70px;
}

#photos-vip img{
float:left;
}

#presentation-snack{
background: url(img/snack-presentation.png);
height:307px;
width:1040px;
float:left;
box-shadow: 0 6px 6px 0 #000000;
margin:50px 0 0 0;
}

#snack-texte{
margin:80px 250px 0 0;
float:right;
width:280px;
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
}

#snack-texte2{
margin:25px 240px 0 0;
float:right;
width:290px;
color:white;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:15px;
}

#photos-vip{
margin:0 0 0 59px;
}

/* INFORMATIONS */

#plan-titre h2{
font-size:25px;
float:left;
width:200px;
}

#info-photo{
background: url(img/fond-info-photo.png);
background-repeat:no-repeat;
position:absolute;
margin:170px 0 0 15px;
height:600px;
width:1020px;
}

#reservations-info{
color: #fff;
float: left;
font-family: ‘Lato’,Arial,serif;
font-size: 18px;
font-weight: 400;
margin:30px 0 0 30px;
text-shadow: 1px 1px 1px #000000;
width:350px;
text-align:center;
}

#texte-info{
color: #89869C;
font-family: ‘Lato’,Arial,serif;
font-size: 14px;
font-weight: 400;
margin:65px 0 0 20px;
padding-top:40px;
text-shadow: 1px 1px 1px #000000;
width:380px;
text-align:center;
}

#email-info a{
color: #d2d1d7;
font-family: ‘Lato’,Arial,serif;
font-size: 18px;
font-weight: 400;
margin:0 0 0 140px;
padding-top:15px;
text-shadow: 1px 1px 1px #000000;
text-align:center;
}

#email-info2 a{
color: #d2d1d7;
font-family: ‘Lato’,Arial,serif;
font-size: 18px;
font-weight: 400;
margin:0 0 0 80px;
padding-top:15px;
text-shadow: 1px 1px 1px #000000;
text-align:center;	
}

#info-reservation{
color:#89869C;
font-family: ‘Lato’,Arial,serif;
font-size: 15px;
font-weight: 400;
margin:20px 0 0 30px;
padding-top:10px;
text-shadow: 1px 1px 1px #000000;
width:350px;
text-align:center;
border-top: 1px solid #525763;
}

#info-reservation-2{
color: #89869C;
font-family: ‘Lato’,Arial,serif;
font-size: 16px;
font-weight: 400;
margin:15px 0 0 30px;
padding:0;
text-shadow: 1px 1px 1px #000000;
width:350px;
text-align:center;	
}

#reserver-info{
margin:-40px 0 0 110px;
padding:0;
width:380px;
height:auto;
}

#bt-reserv-info{
margin:-25px 0 0 105px;
padding:0;
width:376px;
height:auto;
float:left;
}

#info-horaires h3{
width:100px;
height:auto;
color:#fff;
padding:0;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 3px #555;
font-size:24px;
margin:40px 0 0 108px;
text-align:center;
}

#info-horaires2 h3{
width:300px;
height:auto;
text-align:center;
color:#d2d1d7;
padding:0;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
text-shadow:0px 2px 0px rgba(000,000,000,0.8);
font-size:30px;
margin:-20px 0 0 5px;
float:left;
}

#info-photo1{
float:left;
margin:0;
width:500px;
}

#info-photo2{
float:right;
margin:0;
width:600px;
margin:100px 60px 0 0;
}

#titre-info{
text-align:center;
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:28px;
float:left;
margin:385px 0 0 110px;
width:200px;
}

#titre-info2{
width:415px;
text-align:center;
color:#ffffff;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:25px;
float:left;
margin:15px 0 0 0;
}

#titre-info3{
width:415px;
text-align:center;
color:#c4c2cc;
font-family: ‘BebasNeueRegular’, 'Arial Narrow', Arial, sans-serif;
font-weight: 400;
text-shadow: 0px 2px 0px black;
font-size:23px;
float:left;
margin:5px 0 0 0;
}

/* FOOTER */

#col1 a{
margin-top:85px;
width:150px;
float:left;
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:14px;
}


#col3 a{
float:right;
margin-top:70px;
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:14px;
width:210px;
}


#col2 a{
margin:270px 0 0 119px;
color:#89869c;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:18px;
float:left;
}

#col2 a:hover{
color:#c4c1d1;
}

#col1 a:hover{
color:#c4c1d1;
}

#col3 a:hover{
color:#c4c1d1;
}

#col1{
height:340px;
width:150px;
float:left;
margin-left:190px;
}	

#col3{
height:320px;
width:150px;
float:right;
margin-right:165px;
}	

#mentions{
width:1040px;
height:50px;
color:#929297;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:11px;
float:left;
text-align:center;
margin-top:30px;
}

/* ERREUR 404 */
#erreur{
width:1040px;
height:50px;
color:#fff;
font-family: ‘Lato’, Arial, serif; 
font-weight: 400;
text-shadow: 1px 1px 1px #000;
font-size:18px;
float:left;
text-align:center;
margin-top:60px;
}

/* SLIDER */

.clr{
	clear: both;
}
.wrapper{
	float:left;
	width: 100%;
	margin-top:25px;
}
.wrapper p{
	clear: both;
	font-size: 24px;
	line-height: 40px;
	text-align: center;
}
.reference{
	padding-top: 40px;
}

/* Header Style */
.header{
	font-family:"Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
	font-size: 10px;
	padding: 3px 5px;
	background: #000;
	opacity: 0.9;
	text-transform: uppercase;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.8);
	-moz-box-shadow: 0px 1px 4px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px 1px 4px rgba(0,0,0,0.6);
	box-shadow: 0px 1px 4px rgba(0,0,0,0.6);
}
.header a{
	line-height: 18px;
	padding: 0 4px;
	letter-spacing: 1px;
	text-shadow: 1px 1px 1px #000;
	color: #ddd;
}
.header a:hover{
	color: #fff;
}
.header a span{
	font-weight: bold;
}
.header span.right{
	float: right;
}
@media screen and (max-width: 860px) {
	.header a{
		display: block;
		text-align: center;
		font-size: 10px;
		text-shadow: none;
	}
	.header span.right{
		float: none;
	}
}

.ei-slider{
	height: auto;
	margin:0;
}
.ei-slider-thumbs{
	display: none;
	margin:0;
	width:100%;
	padding:0;
}
.ei-slider-large li{
	position: relative;
	list-style-type:none;
	margin:0;
}

.ei-slider{
	position: relative;
	width: 100%;
	max-width: 1920px;
	height: 400px;
	margin: 0 auto;
	margin:0;
}
.ei-slider-loading{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index:999;
	background: rgba(0,0,0,0.9);
	color: #fff;
	text-align: center;
	line-height: 400px;
	margin:0;
}
.ei-slider-large{
	height: 100%;
	width: 100%;
	position:relative;
	overflow: hidden;
	margin:0;
}
.ei-slider-large li{
	position: absolute;
	top: 0px;
	left: 0px;
	overflow: hidden;
	height: 100%;
	width: 100%;
	margin:0;
}

.ei-slider-large li img{
	width: 100%;
	margin:0;
}
.ei-title{
	position: absolute;
	right: 50%;
	top: 30%;
}
.ei-title h2, .ei-title h3{
	text-align: right;
}
.ei-title h2{
	font-size: 80px;
	font-family: ‘Lato’,Arial,serif;
	font-style: italic;
	color: #b5b5b5;
	text-shadow: 2px 1px 2px #000000;
}
.ei-title h3{
	font-size: 60px;
	line-height: 5px;
	font-family: ‘Lato’,Arial,serif;
    font-weight: 400;
    text-shadow: 2px 1px 2px #000000;
	text-transform: uppercase;
	color: #fff;
}
.ei-slider-thumbs{
	height: 13px;
	margin: 0 auto;
	position: relative;
}
.ei-slider-thumbs li{
	position: relative;
	float: left;
	height: 100%;
}
.ei-slider-thumbs li.ei-slider-element{
	top: 0px;
	left: 0px;
	position: absolute;
	height: 100%;
	z-index: 10;
	text-indent: -9000px;
	background: #000;
	background: rgba(0,0,0,0.5);
}
.ei-slider-thumbs li a{
	display: block;
	text-indent: -9000px;
	background: #373c44;
	width: 100%;
	height: 100%;
	cursor: pointer;
	-webkit-box-shadow: 
        0px 1px 1px 0px rgba(0,0,0,0.3), 
        0px 1px 0px 1px rgba(255,255,255,0.1);
	-moz-box-shadow: 
        0px 1px 1px 0px rgba(0,0,0,0.3), 
        0px 1px 0px 1px rgba(255,255,255,0.1);
	box-shadow: 
        0px 1px 1px 0px rgba(0,0,0,0.3), 
        0px 1px 0px 1px rgba(255,255,255,0.1);
	-webkit-transition: background 0.2s ease;
    -moz-transition: background 0.2s ease;
    -o-transition: background 0.2s ease;
    -ms-transition: background 0.2s ease;
    transition: background 0.2s ease;
}
.ei-slider-thumbs li a:hover{
	background-color: #24292f;
}
.ei-slider-thumbs li img{
	position: absolute;
	bottom: 50px;
	opacity: 0;
	z-index: 999;
	max-width: 100%;
	-webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    transition: all 0.4s ease;
	-webkit-box-reflect: 
        below 0px -webkit-gradient(
            linear, 
            left top, 
            left bottom, 
            from(transparent), 
            color-stop(50%, transparent), 
            to(rgba(255,255,255,0.3))
            );
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.ei-slider-thumbs li:hover img{
	opacity: 1;
	bottom: 13px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}






table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}

address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}

q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

#texte-fermeture{
padding:20px;
color:#f0f0f1;
background-color:#1b1e22;
font-family:"Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
font-size: 11px;
float:left;
width:1000px;
}

#mentions img{
float:right;
margin:-30px 100px 0 0;
}







.box {
	width: 460px;
	height: 300px;
	position: relative;
	background: rgba(255,255,255,1);
	display: inline-block;
	margin: 0 10px;
	cursor: pointer;
	color: #2c3e50;
	box-shadow: inset 0 0 0 3px #2c3e50;
	-webkit-transition: background 0.4s 0.5s;
	transition: background 0.4s 0.5s;
}

.box:hover {
	background: rgba(255,255,255,0);
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.box h3 {
	font-family: "Ruthie", cursive;
	font-size: 180px;
	line-height: 370px;
	margin: 0;
	font-weight: 400;
	width: 100%;
}

.box span {
	display: block;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 13px;
	padding: 5px;
}

.box h3,
.box span {
	-webkit-transition: color 0.4s 0.5s;
	transition: color 0.4s 0.5s;
}

.box:hover h3,
.box:hover span {
	color: #fff;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.box svg {
	position: absolute;
	top: 0;
	left: 0;
}

.box svg line {
	stroke-width: 3;
	stroke: #242930;
	fill: none;
	-webkit-transition: all .8s ease-in-out;
	transition: all .8s ease-in-out;
}

.box:hover svg line {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}

.box svg line.top,
.box svg line.bottom {
	stroke-dasharray: 330 240; 
}

.box svg line.left,
.box svg line.right {
	stroke-dasharray: 490 400;
}

.box:hover svg line.top {
	-webkit-transform: translateX(-600px);
	transform: translateX(-600px);
}

.box:hover svg line.bottom {
	-webkit-transform: translateX(600px);
	transform: translateX(600px);
}

.box:hover svg line.left {
	-webkit-transform: translateY(920px);
	transform: translateY(920px);
}

.box:hover svg line.right {
	-webkit-transform: translateY(-920px);
	transform: translateY(-920px);
}

/* Alternatives */




/* Spin */
.demo-4 .box {
	box-shadow: none;
	background: rgba(0,0,0,0.4);
	-webkit-transition: none;
	transition: none;
	color: #fff;
}

.demo-4 .box h3,
.demo-4 .box span {
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}

.demo-4 .box:hover h3,
.demo-4 .box:hover span {
	-webkit-transform: scale(1);
	transform: scale(1);
}

.demo-4 .box svg line {
	stroke-width: 20;
	-webkit-transition: all .4s;
	transition: all .4s;
}

.demo-4 .box:hover svg line {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.demo-4 .box:hover svg line {
	stroke-width: 0;
}

.demo-4 .box svg line.top,
.demo-4 .box svg line.bottom {
	stroke-dasharray: 0; 
}

.demo-4 .box svg line.left,
.demo-4 .box svg line.right {
	stroke-dasharray: 300;
}

.demo-4 .box:hover svg line.top {
	-webkit-transform: translateX(-300px);
	transform: translateX(-300px);
}

.demo-4 .box:hover svg line.bottom {
	-webkit-transform: translateX(300px);
	transform: translateX(300px);
}

.demo-4 .box:hover svg line.left {
	-webkit-transform: translateY(460px);
	transform: translateY(460px);
}

.demo-4 .box:hover svg line.right {
	-webkit-transform: translateY(-460px);
	transform: translateY(-460px);
}


section {
	padding: 4em 2em;
	text-align: center;
}