*{
	padding:0;
	margin:0;
	outline:0;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

*,:after,:before{

	border:0;
	box-sizing:border-box;
}

body,html{

	height:99%;
	font-family:'Open Sans',sans-serif;
}

a,li,p,span{

	text-decoration:none;
	color:#e8e8e8;
	font-size:17px;
	line-height:30px;
}

p{

	margin-bottom:1.5em;
}

p:last-child{

	margin-bottom:0;
}

.h1-clone{
	
	position: relative;
	background: linear-gradient(#fff,#e6ded7,#fff);
	background-clip: text;
	-webkit-text-fill-color: transparent;
	font-family: Quattrocento,serif;
	font-size: 35px;
	text-transform: uppercase;
	line-height: 45px;
	filter: drop-shadow(3px 3px 3px rgba(0,0,0,1));
	font-weight: bold;	
}

h2 {
  background: linear-gradient(orange, #e68001, orange, #e68001, #e68001);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent; /* 🔑 Required for gradient to show */
  font-family: Quattrocento, serif;
  text-transform: uppercase;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.8));
  padding: 0 0 0.1em 0;
  margin: 0 0 0.5em 0;
  font-size: 2em;
  width: 100%;
}

h3{

	color:#fea400;
	font-family:Quattrocento,serif;
	font-size:1.4em;
	font-weight:700;
	margin:0;
	text-shadow:0 0 5px #000;
	text-transform:uppercase;
}

#main{

	z-index:0;
	width:100%;
	margin:0 auto;
	position:relative;
	display:contents;
	background:#27221d;
}

.platformPicto{

	width: 100%;
	border-radius: 1em;
	-webkit-transition: all 0.1s ease-in-out;
	margin:5px;
	//max-width:130px;
	max-width:20%;
}
.platformPicto:hover{

	-webkit-transform: scale(1.05);
}

#header{

	position:fixed;
	z-index:500;
	background-image:url(images/header-banner.png);
	background-position:center top;
	width:100%;
	height:120px;
	text-align:center;
	top:0;
}
/*
#header::before {
	
	//content: "";
	background-image:url(images/newheader2.png);
	background-position:center top;
	background-size: cover;
	position: absolute;
	width:100%;
	height:120px;
	left: 0px;
	opacity: 0.40;
}
*/
#header #logo{

	margin-top:0;
	width:400px;
	position:absolute;
	left:0;
	right:0;
	top:0;
	margin-left:auto;
	margin-right:auto;
}

#header .wrapper{

	width:auto;
	height:88px;
	margin:0 auto;
	max-width:1260px;
	padding:0;
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	min-height:unset;
}

#parallax-content{

	position:absolute;
	top:40%;
	z-index:0;
	width:100%;
	text-align:center;
}

#parallax-content h1{

	position:relative;
	background:linear-gradient(#fff,#e6ded7,#fff);
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent;
	font-family:Quattrocento,serif;
	font-size:55px;
	text-transform:uppercase;
	line-height:60px;
	width:800px;
	margin:0 auto;
	filter:drop-shadow(3px 3px 3px rgba(0,0,0,1));
	opacity:1;
	//margin-top:20px;
	margin-bottom:80px;
}

#header .playbutton.small{

	float:right;
	opacity: 0;
}

#parallax-content .playbutton{

	min-width:300px;
}

.vertical-display{
	
	//margin-top: -20px;
	background:linear-gradient(to bottom,black,#708090);
	padding-bottom: 70px;
}

.vertical-display-banner{
	
	//background-color: grey; 
	margin-top: -21px; 
	z-index: 9; 
	position: relative; 
	padding-bottom: 10px; 
	padding-top: 15px;
	//background:linear-gradient(to bottom,black,#708090);
	background:linear-gradient(to bottom,#1a2528,#3d5754);
}

.playbutton{

	display:inline-block;
	color:#fff;
	border-radius:3px;
	font-size:23px;
	line-height:60px;
	min-width:150px;
	//font-family:Quattrocento,serif;
	font-family:Roboto,sans-serif;
	-webkit-font-smoothing:antialiased;
	font-weight:900;
	text-transform:uppercase;
	text-decoration:none;
	background:linear-gradient(to bottom,orange,#c76500);
	transition:box-shadow .3s ease;
	filter:drop-shadow(0 0 15px rgba(0,0,0,.8));
}

.playbutton:hover{

	box-shadow:inset 0 0 0 3px rgba(0,0,0,.4);
}

.playbutton.small{

	font-size:20px;
	line-height:40px;
	min-width:150px;
	margin:15px 20px;
	filter:drop-shadow(0 0 5px rgba(0,0,0,.5));
}

@keyframes jump{

	0%{
		
		transform:scale(1) rotate(-3deg);
		filter:drop-shadow: 0 1px 1px rgba(0,0,0,.15);
	}

	100%{
		
		transform:scale(1.05) rotate(5deg);
		filter:drop-shadow: 0 4px 40px rgba(0,0,0,.6);
	}
}

.ani .box h1,.ani .box p{

	opacity:1!important;
	margin-top:0!important;
}

.video{
		
	margin-top:-65px;
	width: 100%;
	/*
	background-image: url(images/index/ScreenShot_07.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
	*/
}

.boxrow{

	position:relative;
	width:100%;
	//margin-top:-1%;
	padding:20px 0;
	
	//background:linear-gradient(to bottom,#26211d,#3e352d);
	background:linear-gradient(to bottom,#1a2528,#3d5754);
	
	background-size:cover;
	-webkit-mask-position:top center;
	mask-position:top center;
	-webkit-mask-repeat:no-repeat;
	mask-repeat:no-repeat;
	-webkit-mask-size:cover;
	mask-size:cover;
}

.boxrow .box{

	width:56%;
	align-self:center;
}

.boxrow .wrapper{

	display:flex;
	flex-wrap:wrap;
}

.boxrow .box h1{

	transition:opacity .6s ease 0s,margin-top .6s ease 0s;
}

.boxrow h1{

	background:linear-gradient(orange,#e68001,orange,#e68001,#e68001);
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent;
	font-family:Quattrocento,serif;
	text-transform:uppercase;
	filter:drop-shadow(0 2px 4px rgba(0,0,0,.8));
	padding:0 0 .1em 0;
	margin:0 0 .5em 0;
	font-size:2.8em;
	width:100%;
}

.boxrow h1::before{

	content:"";
	display:block;
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:1px;
	background:linear-gradient(to left,transparent,#f19101 100%);
}

.boxrow .box p{

	transition:opacity .6s ease .3s,margin-top .6s ease .3s;
}

.boxrow .socialwrapper{

	margin:0 auto;
	max-width:1260px;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
}

.boxrow .socialwrapper span{

	font-family:Quattrocento,serif;
	font-size:1.7em;
	color:#c1bdba;
	text-transform:uppercase;
	font-weight:700;
	margin-right:20px;
	margin-left:20px;
}

.boxrow .socialwrapper img{

	width:50px;
	margin:0 5px;
	opacity:.5;
	transition:opacity .3s ease;
}

.boxrow .socialwrapper a:hover img{

	opacity:.9;
}

.wrapper{

	margin:0 auto;
	max-width:1000px;
	padding:0 20px;
}

.left{

	justify-content:flex-start;
}

.right{

	justify-content:flex-end;
}

.center{

	justify-content:center;
}

@keyframes glow{

	0%{

		opacity:.5;
		transform:scale(1);
	}

	50%{

		opacity:1;
		transform:scale(1.1);
	}

	100%{

		opacity:.5;
		transform:scale(1);
	}
}

.rowbg0{

	background:#544437!important;
}

.rowbg1{

	margin-top:-74px;
	//background-image:linear-gradient(80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/crossplateform.jpg);
	background-image:linear-gradient(80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/crossplateform.jpg);
	background-position:right 50%!important;
	background-size: auto;
	
}

.rowbg2{

	//background-image:linear-gradient(-80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/SimpleRules.jpg);
	background-image:linear-gradient(-80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/SimpleRules.jpg);
	background-position:left 35%!important;
	background-size: auto;
}

.rowbg3{

	background-image:linear-gradient(-80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/ScreenShot_06.jpg);
	//background-image:linear-gradient(-80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/ScreenShot_06.jpg);
	background-position:left 30%!important;
}

.rowbg4{

	background-image:linear-gradient(80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/ScreenShot_07.jpg);
	//background-image:linear-gradient(80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/ScreenShot_07.jpg);
	background-position:right 70%!important;
}

.rowbg5{

	background-image:linear-gradient(-80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/ScreenShot_14.jpg);
	background-position:left 25%!important;
}

.rowbg6{

	background-image:linear-gradient(-80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/items.jpg);
	//background-image:linear-gradient(-80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/items.jpg);
	background-position:left 70%!important;
	background-size: auto;
}

.rowbg7{

	background-image:linear-gradient(80deg, #14191b, #14191b, rgba(20,25,27,.95), rgba(20,25,27,.65), transparent,transparent),url(images/index/ScreenShot_14.jpg);
	//background-image:linear-gradient(80deg,#27221d,#27221d,rgba(39,34,29,.95),rgba(39,34,29,.65),transparent,transparent),url(images/index/ScreenShot_14.jpg);
	background-position:right 25%!important;
}

.footer{

	//background:linear-gradient(to bottom,#5f5144,#b9a798);
	
	background:linear-gradient(to bottom,#61827f,#a7c8c5);
	
	padding-bottom:25px!important;
	text-align:center;
}

.footer .wrapper{

	flex-direction:column;
	align-items:center;
	justify-content:center;
	min-height:100px!important;
}

.footer img{

	width:300px;
	opacity:.8;
	transition:opacity .3s;
}

.footer a:hover img{

	opacity:1;
}

.footer ul{

	list-style:none;
	margin:20px 0 30px 0;
	display:inline-block;
}

.footer ul li{

	float:left;
	border-right:1px solid #c3c3c3;
	margin-right:15px;
	padding-right:15px;
	line-height:12px;
}

.footer ul li:last-child{

	border-right:0;
	margin-right:0;
	padding-right:0;
}

.footer ul li a{

	display:block;
	color:#e9e6e4;
	font-size:1.1em;
	transition:color .3s;
	text-decoration:none;
	text-transform:uppercase;
	text-shadow:none;
}

.footer ul li a:hover{

	color:#f90;
}

.footer span{

	font-size:1em;
	color:#3d342d;
	display:inline-block;
	text-shadow:none;
}

.mainnav{

	display:flex;
	text-align:left;
	width:100%;
}

.mainnav>li{

	float:left;
	position:relative;
}

.mainnav li ul{

	background:rgba(39,34,29,.8);
	position:absolute;
	left:0;
	top:100%;
	border-radius:5px;
	width:300px;
	box-shadow:0 6px 12px rgba(0,0,0,.2);
	max-height:0;
	overflow:hidden;
	transition:max-height .3s ease-out;
}

.mainnav a{

	cursor:pointer;
	display:block;
	text-transform:uppercase;
	font-family:Quattrocento,serif;
	text-decoration:none;
}

.mainnav li ul li a{

	color:#c5bfb2!important;
	padding:10px 10px;
	font-size:20px;
	line-height:20px!important;
}

.mainnav li a{

	color:#c5bfb2;
	padding:0 10px;
	font-size:20px;
	font-weight:700;
	height:100%;
	line-height:75px;
	filter:drop-shadow(1px 1px rgba(0,0,0,.5));
}
/*
.mainnav:not(.mobile)>li:first-child a,.mainnav:not(.mobile)>li:last-child a{

	padding:0 20px;
}
*/
.mainnav li.has-sub>a:after{

	content:"▾";
	margin-left:4px;
}

.mainnav li{

	list-style:none;
}

.mainnav li:not(.on-page):hover a{

	color:#e6e3db;
}

.mainnav li ul li:hover a{

	color:#e6e3db!important;
}

.mainnav li:hover ul{

	display:block;
	max-height:200px;
	transition:max-height .3s ease-in;
}

.mainnav.mobile{

	position:absolute;
	left:0;
	top:67px;
	background:rgba(39,34,29,.8);
	width:300px;
	text-align:center;
}

.mainnav.mobile ul{

	position:relative;
	background:rgba(105,90,77,.8);
	border-radius:0;
	box-shadow:none;
	border:0;
}

.mainnav.mobile>li{

	float:none;
}

.mainnav.mobile li ul{

	max-height:0;
	overflow:hidden;
	transition:max-height .3s ease-out;
}

.mainnav.mobile li.open ul{

	display:block;
	max-height:200px;
	transition:max-height .3s ease-in;
}

.mainnav.mobile li ul li a{

	color:#fff;
	padding:10px 10px 10px 20px;
	font-size:20px;
	line-height:20px!important;
}

#mobilenavbutton{

	display:none;
	font-size:36px;
	width:36px;
	color:#e3e0dd;
	margin:10px 15px;
	float:left;
}

@media only screen and (max-width:1200px){

	.mainnav{

		display:none;
	}

	.mainnav.mobile{

		display:block;
	}

	#mobilenavbutton{

		display:inline-block;
	}

	.playbutton.small{

		display:none;
	}
}

@media only screen and (max-width:1024px){

	.boxrow .box{

		width:100%;
	}

	.boxrow .wrapper{

		min-height:300px;
	}

	.boxrow h1{

		font-size:2em;
	}

	#parallax-content{

		top:40%;
		padding:0 25px;
	}

	#parallax-content h1{

		width:auto;
		font-size:45px;
		margin-bottom:0;
		line-height:45px;
	}
}

@media only screen and (max-width:667px){

	#parallax-content{

		top:30%;
	}

	.footer ul li{

		float:none;
		border:none;
		margin:20px 0;
		padding:0;
		text-align:center;
	}
}