@charset "utf-8";

/***********************************************************************
    MOBILE MODE
***********************************************************************/

.r6-navigation-toggle					{ position:absolute; top:20px; left:15px; width:34px; height:25px; cursor:pointer; transition:.5s ease-in-out; -webkit-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); display:none; }

.r6-navigation-toggle span				{ position:absolute; display:block; left:0; -webkit-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); transition:.25s ease-in-out; width:34px; height:2px; background:#fff; opacity:1; }

.r6-navigation-toggle span:nth-child(1) { top:0px; }
.r6-navigation-toggle span:nth-child(2),
.r6-navigation-toggle span:nth-child(3) { top:10px; }
.r6-navigation-toggle span:nth-child(4) { top:20px; }

/***********************************************************************
   IS OPEN
***********************************************************************/

.r6-navigation.open .r6-navigation-toggle span:nth-child(1) { top:18px; left:50%; width:0%; }
.r6-navigation.open .r6-navigation-toggle span:nth-child(2) { -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); }
.r6-navigation.open .r6-navigation-toggle span:nth-child(3) { -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg); }
.r6-navigation.open .r6-navigation-toggle span:nth-child(4) { top:18px; left:50%; width:0; }

@media only screen and (max-width:1279px)
{
	.r6-navigation.open						{ height:100%; }
	
	.r6-navigation-toggle				{ display:block; }
	
	.r6-navigation-logo					{ margin:5px auto; }
	.r6-navigation-logo .icon-game		{ display:inline-block; width:50px; height:50px; background:url("r6-six.png") 0 0 no-repeat; }
	.r6-navigation-logo .logo-game		{ display:none; }


	.r6-navigation-list {
		display:-ms-flexbox; display:-webkit-box; display:-webkit-flex; display:flex;
		-ms-flex-direction:column; -webkit-flex-direction:column; flex-direction:column;
		margin:0 auto;
		height:auto;
	}
	
	.r6-navigation.open .r6-navigation-bar			{ height:inherit; }

	.r6-navigation-content {
		display:-ms-flexbox; display:-webkit-box; display:-webkit-flex; display:flex;
		-ms-flex-direction:column; -webkit-flex-direction:column; flex-direction:column;
		position:absolute; z-index:-100; left:0; top:60px; width:100%; height:calc(100% - 105px); background:#0d0d0d; opacity:0; pointer-events:none;
		-ms-flex-align:center; -webkit-align-items:center; align-items:center;
		-ms-flex-pack:center; -webkit-justify-content:center; justify-content:center;
	}

	.r6-navigation.open .r6-navigation-content { opacity:1; z-index:1000; pointer-events:all; transition:opacity 0.3s ease-in-out; }

	.r6-navigation-list li {
		font-size:4rem;
		line-height:0.8;
	}

	.r6-navigation-list > li { /*border-top:1px solid #000; border-bottom:1px solid #1a1a1a;*/ }

	.r6-navigation-list li,
	.r6-navigation-list a		{ display:block; width:100%; height:auto; line-height:0.8; text-align:center; }
	
	.r6-navigation-list a		{ padding:5px 10px 10px 10px; }
  
  	.r6-navigation-subnav {
		position:static;
		display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
		-webkit-box-orient:vertical; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column;
		-webkit-box-align:center; -ms-flex-align:center; align-items:center;	
		/*-webkit-align-items:center; -ms-flex-align:center; align-items:center;*/
		/*-webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;*/
		-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;
		height:0;
		overflow:hidden;
		-webkit-transition-property:opacity; -o-transition-property:opacity; transition-property:opacity;
		-webkit-transition-duration:150ms; -o-transition-duration:150ms; transition-duration:150ms;
		-webkit-transition-timing-function:ease-in; -o-transition-timing-function:ease-in; transition-timing-function:ease-in;
		opacity:0;
	}
	.r6-navigation-subnav a		{ color:#b7bac2; }
	
	.is-open .r6-navigation-subnav	{ height:auto; opacity:1; background-color:#0d0d0d; border-top:1px solid #404040; border-bottom:1px solid #404040; }
	
	.r6-navigation-subnav li {
		font-size:3rem;
	}
	
	.r6-navigation-cta {
		position:static;
		text-align:center;
	}
}

	@media only screen  
and (max-device-width : 823px)
and (orientation : landscape) { 

 .r6-navigation-content {
 overflow-y: scroll;
 }

 .r6-navigation-cta {
    position: absolute;
    top: 275px;
    left:0
}

}