@font-face 
{
    font-family: 'mouse_memoirsregular';
    src: url('fonts/mousememoirs-regular-webfont.eot');
    src: url('fonts/mousememoirs-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/mousememoirs-regular-webfont.woff') format('woff'),
         url('fonts/mousememoirs-regular-webfont.ttf') format('truetype'),
         url('fonts/mousememoirs-regular-webfont.svg#mouse_memoirsregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
#pokicontainer
{
	position:absolute;
	left:100px;
	right:100px;
	bottom:0px;
	top:100px;
	background:#000;
	transform:translate(0,140%);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
#pokicontainer.show
{
	bottom:100px;
	transform:translate(0,0%);
}
@media all and (max-width: 601px)
{
	#pokicontainer
	{
		left:50px;
		right:50px;
		top:50px;
	}
	#pokicontainer.show
	{
		bottom:50px;
	}
}

#poki-sdk-container
{
	width:100%;
	height:100%
}
#poki-left
{
	position:absolute;
	background:url('../images/videopopup_left.png');
	width:42px;
	top:70px;
	left:-40px;
	bottom:70px;
}
#poki-right
{
	position:absolute;
	background:url('../images/videopopup_right.png');
	width:49px;
	top:70px;
	right:-47px;
	bottom:70px;
}
#poki-top
{
	position:absolute;
	background:url('../images/videopopup_top.png');
	height:43px;
	left:73px;
	top:-42px;
	right:70px;
}
#poki-top-left
{
	position:absolute;
	background:url('../images/videopopup_top_left.png');
	height:112px;
	width:113px;
	left:-40px;
	top:-42px;
}
#poki-top-right
{
	position:absolute;
	background:url('../images/videopopup_top_right.png');
	height:112px;
	width:117px;
	top:-42px;
	right:-47px;
}

#poki-bottom
{
	position:absolute;
	background:url('../images/videopopup_bottom.png');
	height:63px;
	left:73px;
	bottom:-62px;
	right:70px;
}
#poki-bottom-left
{
	position:absolute;
	background:url('../images/videopopup_bottom_left.png');
	height:132px;
	width:113px;
	left:-40px;
	bottom:-62px;
}
#poki-bottom-right
{
	position:absolute;
	background:url('../images/videopopup_bottom_right.png');
	height:132px;
	width:117px;
	bottom:-62px;
	right:-47px;
}

body
{
	margin:0px;
	padding:0px;
	background:#fff;
	font-family: mouse_memoirsregular;
	overflow:hidden;
}

#mainCanvas
{
	padding:0px;
	margin:0px;
	background:#170A02;
	display:none;
	
	-webkit-transition: opacity 0.4s ease-in-out;
	-moz-transition: opacity 0.4s ease-in-out;
	-o-transition: opacity 0.4s ease-in-out;
	transition: opacity 0.4s ease-in-out;

}

#mainCanvas.dim
{
	opacity:0.3;
}

#canvasContainer
{
/*	background:#170A02;*/
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	margin:0px;
	padding:0px;
		
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;


}

#loader
{
	display:block;
	position:absolute;
	left:50%;
	top:50%;
	z-index:20;
	color:#000;
	width:300px;
	margin:0px;
	margin-left:-150px;
	margin-top:-40px;
	text-align:center;
}

.fb-login-button 
{
	width:230px !important;
	position:absolute !important;
	left:50%;
	margin-left:-115px; 
	text-align:center;
	bottom:55px;
}
#canvasBG
{
	display:none;
	width:100%;
	padding:0px;
	margin:0px;
}
#banner
{
	background: url('../images/banner.png');
	width:100%;
	height:64px;
	background-size:fill;
}
#bannerLogo{
	background:url('');
	width: 285px;
	height: 63px;
	background-size:285px 63px;
	margin-left:auto;
	margin-right:auto;
}

#bannerLogo.en{
	background:url('../images/bannerLogo_en.png');
	width: 480px;
	height: 59px;
	background-size:480px 47px;	
	background-repeat:no-repeat;
	background-position:0px 12px;
}
#bannerLogo.de
{
	background:url('../images/bannerLogo_de.png');
	width: 480px;
	height: 59px;
	background-size:480px 47px;	
	background-position:0px 12px;
	background-repeat: no-repeat;
}
#bannerLogo.es
{
	background:url('../images/bannerLogo_es.png');
	width: 480px;
	height: 52px;
	background-size:480px 41px;	
	background-position:0px 12px;
	background-repeat: no-repeat;
}
#bannerLogo.fr
{
	background:url('../images/bannerLogo_fr.png');
	width: 480px;
	height: 59px;
	background-size:480px 47px;	
	background-position:0px 12px;
	background-repeat: no-repeat;
}
#bannerLogo.pt
{
	background:url('../images/bannerLogo_pt.png');
	width: 480px;
	height: 60px;
	background-size:480px 48px;	
	background-position:0px 12px;
	background-repeat: no-repeat;
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
  
  /* Retina-specific stuff here */
	#banner{
		width:200%;
	}
}

#flags
{
	position:absolute;
	top:50%;
	text-align:center;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	margin-top:-230px;
}

#flags img
{
	max-width:45%;
}
.flag
{
	cursor: pointer;
	margin:5px;
}

#flags .introBanner
{
	max-width:70%;
	margin-bottom:20px;
}

body.poki
{
	background:#0D6e7a;
}

body.poki #loader
{
	color:#FFc949;
	text-shadow:2px 2px rgba(0,0,0,0.4);
}

@media all and (max-height: 419px)
{
	#flags
	{
		height:100%;
		margin-top:-100px;
	}
	.introBanner
	{
		max-height:100px;
	}
	#flags img
	{
		max-width:17%;
	}
}