/* Font */

@font-face {
  font-family: "TypoBerlinSansFB-Regular";
  src: url("../fonts/Berlin Sans FB.ttf");
}

@font-face {
  font-family: "TypoDum-1";
  src: url("../fonts/dum1.ttf");
}

@font-face {
  font-family: "TypoAvantGarde-Book";
  src: url("../fonts/ITCAvantGardeStd-Bk.otf");
}


/* Global styles */

::selection {
  background: #e72031;
  color: #fff;
}

::-moz-selection {
  background: #e72031;
  color: #fff;
}

@media (max-width: 991px) {
  .mobile-top-fix {
    margin-top: 30px;
    margin-bottom: 0px;
  }
  .mobile-bottom-fix {
    margin-bottom: 30px;
  }
  .mobile-bottom-fix-big {
    margin-bottom: 60px;
  }
}

html {
  scroll-behavior: smooth;
}



/* General css */

body p {
  font-size: 14px;
  color: #000000;
  font-family: "TypoBerlinSansFB-Regular", sans-serif;
}

#top {
  padding-top: 100px;
}

#top .col-lg-4,
#top .col-lg-8 {
  padding: 0px;
}

h1 {
  font-family:"TypoDum-1";
  color: #ffffff;
  }

h2{
  font-family:"TypoDum-1";
  font-size :200%;
}

a:hover,
a:active,
a:focus {
  outline: none;
  text-decoration: none;
}



/* Reset */

html {
  font-size:62.5%;
  -webkit-text-size-adjust:100%;
  -ms-text-size-adjust:100%;
}

body {
  background:#fff;
}

header,main,nav,section {
  display:block;
}

ol,ul {
  list-style: none;
}



/* Header */

.site-header {
  padding-top:2em;
  padding-bottom:1em;
  background-color: #e72031;
}



/* Logo and Title */

.site-branding {
  margin-bottom:1em;
  text-align:center;
}



/* Menus */

.menu {
  display:table;
  margin:0 auto;
}

.menu a{
  color:#ffffff;
  text-decoration:none;
}

.menu a:hover{
  text-decoration:none;
  color:#F39894;
}

.main-navigation {
  color:#ffffff;
  font-family:"TypoDum-1";
  font-size:14px;
  font-weight:600;
  letter-spacing:1px;
  padding:15px 0;
  border-top:2px solid;
  border-bottom:2px solid;
  text-transform:uppercase;
}

.main-navigation ul {
  list-style:none;
  margin:0 auto;
  padding:3px 0;
}

.main-navigation li {
  display:inline;
  float:left;
  margin:0 1em;
  position:relative;
}

.main-navigation ul ul {
  display:none;
  text-transform:none;
  box-shadow:none;
  opacity:0.9;
  float:left;
  left:-1em;
  padding:0.5em 1em;
  position:absolute;
  top:1.5em;
  z-index:99999;
  padding-top:35px;
  transition:all 0.3s;
  font-weight:400;
  background-color:#fff;
}

.main-navigation ul ul li {
  margin:0;
  width:150px;
}

.main-navigation ul li:hover>ul {
  display: block;
}



/* Small menu */

.menu-toggle {
  display: none;
}



/* Entry Navigation */

.meta-nav {
  font-size:13px;
}



/* Archives Page */

.page-header {
  margin-bottom:1.5em;
}

.page-title {
  line-height:1;
  margin-top:0;
  text-transform:capitalize;
}

.page-title:before {
  content:"#";
}

.page-header p {
  font-style:italic;
  margin-bottom: 0.5em;
}



/* Responsive Slider */

.slides,.flex-control-nav,.flex-direction-nav {
  margin:0;
  padding:0;
  list-style: none;
}



html[xmlns] .slides {
  display:block;
}
* html .slides {
  height: 1%;
}

.no-js .slides>li:first-child {
  display: block;
}



/* Control Nav */

.flex-control-nav {
  display:none;
  width:100%;
  position:absolute;
  bottom:-40px;
  text-align:center;
}

.flex-control-nav li {
  margin:0 6px;
  display:inline-block;
  zoom:1;
  *display:inline;
}


@media screen and (max-width:860px) {
  .flex-direction-nav .flex-prev {
  	opacity:1;
  	left:10px;
  }
  .flex-direction-nav .flex-next {
  	opacity:1;
  	right:10px;
  }
}


.slide-title {
  display: none;
}



/* Media Queries */

@media screen and (max-width:860px) {
  .flex-direction-nav .flex-prev {
  	opacity:1;
  	left:-10px;
  }
  .flex-direction-nav .flex-next {
  	opacity:1;
  	right:10px;
  }
}


@media screen and (max-width:1023px) {
  #primary {
  	padding-top:1em;
  }
  #secondary {
  	border-top:0px solid #ffffff;
  }
  .menu-toggle,.main-navigation.toggled .nav-menu {
  	display:block;
  }
  button.menu-toggle {
  	background:none;
  	border:0;
  	box-shadow:none;
  	color:#fbf315;
  	font-size:14px;
    font-weight:600;
  	margin:0 auto;
  	outline-style:none;
  	text-shadow:none;
  	text-transform:uppercase;
  	font-family:"TypoDum-1";
    letter-spacing:2px
  }
  .main-navigation {
  	display:block;
  	float:none;
  	margin:0 auto;
  }
  .main-navigation a {
  	display:block;
  	padding:0.5em 0;
  	text-decoration:none;
  }
  .main-navigation ul {
  	display:none;
  }
  .main-navigation li {
  	float:none;
  	margin:0;
  	position:relative;
  	padding:0;
  	text-align:center;
  }
  .main-navigation li:last-child {
  	border-bottom:0;
  }
  .main-navigation ul li>ul {
  	display:block;
  	margin-left:0;
  }
  .main-navigation ul ul {
  	border-left:0;
  	box-shadow:none;
  	display:block;
  	float:none;
  	left:0;
  	padding:0;
  	position:relative;
  	top:0;
  	text-transform:capitalize;
  	z-index:99999;
  }
  .main-navigation ul ul li {
  	border-bottom:0;
  	padding:0;
  }
  .widget_search input[type="search"] {
  	width: 30%;
  }
}


@media screen and (max-width: 1023px) {
  button.menu-toggle {
  	color: #fbf315;
  }
}



/** Carousel CSS **/

.carousel {
  position: relative;
  background-size: cover;
  width: 100%;
  height:591px;
  margin: 0;
  text-align: center;
  overflow: hidden;
}

.carousel .carousel-inner,
.carousel .carousel-item {
  position: relative;
  width: 100%;
  height: 100%;
}

.carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.carousel .carousel-item::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}

.carousel .carousel-caption {
  position: absolute;
  top: -20;
  bottom: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 620px;
}

.carousel .carousel-caption h1 {
  color: #ffffff;
  font-family: "TypoDum-1";
  text-align:center;
  font-size: 45px;
  font-weight: 200;
  margin-bottom: 20px;
  text-shadow: 1px 1px 2px #e72031, 0 0 1em black, 0 0 0.2em black;
}

.carousel .carousel-caption .btn {
  padding: 15px 35px;
  font-size: 18px;
  font-family:"TypoBerlinSansFB-Regular";
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #ffffff;
  background: #e72031;
  border: 5px solid #ffffff;
  border-radius: 300px;
  transition: .3s;
}

.carousel-inner .carousel-caption .btn:hover {
  color: #ffffff;
  background: #9ad5e5; 
}

.boite{
  z-index:9;
  position:relative;
}


@media (max-width:792px) {
  .carousel .carousel-caption h1 {
  	font-size: 40px;
    font-weight: 200;
  	text-shadow: 1px 1px 2px #00b0e0, 0 0 0.1em black, 0 0 1em black;
  }
  .carousel .carousel-caption p {
  	font-size: 20px;
  }
  .carousel .carousel-caption .btn {
  	padding: 12px 30px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
  }
}


@media (max-width:575.98px) {
  .carousel .carousel-caption h1 {
  	font-size: 30px;
    font-weight: 200;
  }
    
  .carousel .carousel-caption p {
  	font-size: 16px;
  }
  .carousel .carousel-caption .btn {
  	padding: 10px 25px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
  }
}


.carousel .animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}



/* Video */

.video {
  padding-top:3%;
  position:relative;
  z-index:2;     
}

.video p {
  font-family:"TypoBerlinSansFB-Regular";
  font-size: 200%;
  color:black;   
}

.video .question {
  color: #e72031;
  margin-bottom:-20px;
  margin-top:-15px;
}

.intro {
  margin-top: 3%;
}

.play {
  margin-left:3%;
  margin-right:3%;
}
    

@media (max-width:768px){
  .play {
  	margin-bottom:8%;
        margin-left:0;
  }
  .intro {
  	text-align:center;
}
  .video p {
  	text-align:center;
  }
  .video{
  	margin-top:5%;
  }
}


@media (max-width:992px){
  .intro{
  	font-size:80%;
  }
}


@media (max-width:768px){
  .intro{
  	font-size:100%;
  	text-align:center;
  	margin-top:8%;
  	margin-bottom:3%;
  }
  .play {
  	margin-top:5%;
  }
}


@media (max-width:518px){
  .play{
  	margin-bottom:3%;
        margin-left:3%;
  }
  .video p {
  	text-align:center;
  }
  .intro{
  	margin-bottom:5%;
  }
  .bulles{
  	width:100%;
  }
}



/* Le jeu */

.fond-gauche {
  background-image: url("../img/fond-gauche.jpg");
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  display:inline-block;
  height:100%;
  margin-top:-150px;
  z-index:auto;
  opacity:0.5; 
}


@media (max-width:768px){
  .fond-gauche{
  	margin-top:-400px;
  }
}


@media (max-width:600px){
  .fond-gauche{
  	margin-top:-400px;
  }
}


.bulles {
  float:right;
  width:100%;
  margin-top:5%;
  z-index:2;
}

.situation {
  z-index:4;
  position:relative;
  margin-left: auto;
  margin-right: auto;
  margin-bottom:10%;
  margin-top:4%;
}


@media (max-width:768px){
  .bulles {
  	margin-top:0; 
  }
}


@media (max-width:519px){
  .bulles {
  	width:100%;
  	margin-top:0;
  }
}


.contenu p {
  font-family:"TypoBerlinSansFB-Regular";
  font-size: 200%;
  color:black;
  text-align:center;
  margin-top:-3%;
  border-width:10px;
  border-style:dotted;
  border-color:#e72031;
  padding:20px;
}

.contenu b {
  color:#e72031;
  font-size:160%;
}

.cartes {
  margin:auto;
    margin-top:-8%;
}

.txt-jeton {
  float:right;
  margin-top:-15%;
  margin-bottom:5%;
  font-size:200%;
}


@media (max-width:768px){
  .contenu p{
  	margin-left:5%;
    margin-top:5%;
  	margin-bottom:10%;
  }
}


@media (max-width:1610px){
  .contenu p{
  	margin-top:-15%;
  }
}


@media (max-width:992px){
  .contenu p {
  	margin-top:-6%;
  }
  .jetons img{
  	margin-bottom: 18%;
  }
  .cartes{
  	margin-top:0%;
  }
}



/* Collection */

.collection p {
  font-family:"TypoBerlinSansFB-Regular";
  font-size: 200%;
  color:white;
  text-align:center;
  padding-top:3%;
}

.collection {
  margin-top:5%;
  background-color:#e72031;
  transform: skewY(-4deg);
  text-align: center;
  box-shadow: 5px 10px 20px #8e8e8e; 
}

.collection .btn {
  font-family:"TypoBerlinSansFB-Regular";
  padding: 15px 45px;
  margin-top:3%;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #e72031;
  background: #fff;
  border: 5px solid #9ad5e5;
  border-radius: 300px;
}

.collection .jaune {
  float:left; 
  margin-top:-5%;
}


@media (max-width:1400px){
  .collection .jaune {
  	width:200px;
  	transition: 0.3s;
  }
}


@media (max-width:1000px){
  .collection .jaune {
  	width:160px;
  	transition: 0.3s;
  }
}


@media (max-width:768px){
  .collection .jaune {
  	display:none;
  }
}

.jeu .jaune2{
  float:right;
  margin-top:-20%;
}


@media (max-width:1400px){
  .jeu .jaune2 {
  	width:200px;
        height:393px;
        transition: 0.3s;
  }
}


@media (max-width:1000px){
  .jeu .jaune2 {
  	width:160px;
        height:314px;
  	transition: 0.3s;
  }
}


@media (max-width:768px){
  .jeu .jaune2 {
  	display:none;
  }
}


.boites img:hover{
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  transition:1s ease-in-out;
}



/* Contact */

.contact{
  margin: auto;
  margin-top:10%;
  margin-bottom:5%;
}

.contact p{
  font-family:"TypoBerlinSansFB-Regular";
  margin-top:5%;
  color:black;
  font-size:180%;
}

.infos {
  margin-top:-3%;
  float:right;
}

.infos p {
  font-size:180%;
}

.infos b {
  font-size:180%;
  color:#e72031;
}

.infos a {
  text-decoration:none;
  color:#F39894;
  font-size:130%;
}

.infos a:hover {
  color: #e72031;
  text-decoration:none;
}

.jeux-bordier {
  margin:auto; 
}

.contact .infos .btn{
  padding: 5px 35px;
  margin: 5px 0px;
  font-size: 18px;
  font-family:"TypoBerlinSansFB-Regular";
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: lowercase;
  color: #ffffff;
  background: #e72031;
  border: 5px solid #F39894;
  border-radius: 300px;
  transition: .3s;
}

.contact .infos .btn:hover {
  color: #ffffff;
  background: #F39894; 
}

@media(max-width:992px){
  .contact{
  	padding-top:10%;
  }
  .jeux-bordier {
  	width:80%;
  }
}


@media(max-width:768px){
  .jeux-bordier {
  	width:50%;
    padding-bottom:10%;
  }
  .contact{
  	padding-bottom:10%;
  }
}




/* PDV */

@media(max-width:992px){
  .PDV {
  	padding-top:10%;
  }
  .contact-pdv {
  	padding-top:10%;
  }
}


@media(max-width:768px){
  .contact-pdv{
  padding-top:0;
  }
}


.PDV {
  margin-top:5%;
  margin-bottom:10%;
}

.PDV b{
  font-size:180%;
  color:#e72031;
}

.PDV h2{
  padding-bottom:3%;
}

.contact-pdv{
  margin-top:5%;
  margin-bottom:10%;
}

.contact-pdv p{
font-size:180%;
}

.contact-pdv b{
  font-size:180%;
  color:#e72031;
}

.contact-pdv h2{
  padding-bottom:3%;
}

.contact-pdv a:hover {
  color: #e72031;
  text-decoration:none;
}

.contact-pdv a{
  text-decoration:none;
  color:#e72031;
  font-size:130%;
}



/* Footer */

.site-footer {
  background-color:#e72031;
  padding:45px 0 20px;
  font-size:15px;
  line-height:24px;
  color:#fff;
}

.site-footer hr {
  border-top-color:#fff;
  opacity:1;
}

.site-footer hr.small {
  margin:20px 0
}

.site-footer h6 {
  color:#fff;
  font-family: "TypoDum-1";
  font-size:16px;
  text-transform:uppercase;
  margin-top:5px;
  letter-spacing:2px
}

.site-footer a {
  color:#fbf315;
  text-transform:uppercase;
  font-family: "TypoDum-1";
}

.site-footer a:hover {
  color:#fff;
  text-decoration:none;
}

.footer-links {
  padding-left:0;
  list-style:none;
}

.footer-links li {
  display:block
}

.footer-links a{
  color:#fbf315;
  weight:bold;  
}

.footer-links a:active,.footer-links a:focus,.footer-links a:hover {
  color:#fff;
  text-decoration:none;
}

.footer-links.inline li{
  display:inline-block;
}

.site-footer {
  text-align:center;
}

.site-footer a {
  width:40px;
  height:40px;
  line-height:30px;
  margin-left:6px;
  margin-right:0;
  border-radius:100%;
}

.iris a{
	color: #ffffff;
	text-decoration:none;
    font-family: "TypoAvantGarde-Book";
    text-transform: none;
    font-size : 75%;
    margin-left:5px;
    margin-right:5px;
}


@media (max-width:991px) {
  .site-footer [class^=col-] {
  	margin-bottom:30px;
  	text-align:center;
  } 
}


@media (max-width:768px) {
  .site-footer {
  	padding-bottom:3%;
  	text-align:center
  }  
}




/* Mentions */

@media(max-width:992px){
  .mentions {
  	padding-top:10%;
  }
}


.mentions {
  margin-top:5%;
  margin-bottom:10%;
}

.mentions p{
  font-size:180%;
  font-weight: lighter;
  color:#5e5e5d;
}

.mentions b{
  font-size:180%;
  color:#e72031;
}

.mentions a{
  text-decoration:none;
  color :#e72031;
}

.mentions a:hover{
  text-decoration:none;
  color :#F39894;
}

.mentions h2{
  padding-bottom:3%;
}

.mentions strong{
  font-size:120%;
  color:#000000;
}




@media (max-width:992px) {
  #top {
  	padding-top: 100px;
  	height: auto;
  }
  .header-area .main-nav .nav li.submenu:after {
  	right: 3px;
  }
  .header-area .main-nav .nav li.submenu {
  	padding-right: 15px;
  }
  .header-area .main-nav .nav li {
  	padding-right: 5px;
  	padding-left: 5px;
  }
  .header-area .main-nav .nav li a {
  	font-size: 14px;
  	letter-spacing: 0px;
  }
  #contact {
  	margin-left: 0px;
  	margin-top: 30px;
  }
}