@charset "UTF-8";

@font-face 
{
    font-family: 'goudy_bookletter_1911regular';
    src: url('../_font/goudybookletter1911-webfont.eot');
    src: url('../_font/goudybookletter1911-webfont.eot?#iefix') format('embedded-opentype'),
         url('../_font/goudybookletter1911-webfont.woff') format('woff'),
         url('../_font/goudybookletter1911-webfont.ttf') format('truetype'),
         url('../_font/goudybookletter1911-webfont.svg#goudy_bookletter_1911regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*
	SETUP ::::::
*/

#PRELOADER
{
	width: 320px;
	height: 460px;
	
	margin: 0;
	padding: 0;

	opacity: 0;
	
	background: #000;
	
	z-index: 1;
	
	overflow: hidden;
	
	font-family: 'goudy_bookletter_1911regular', serif; /* Goudy Bookletter 1911 */
	font-variant: normal;
	font-style: normal;
	font-weight: 400;
	font-size: 22px;
	letter-spacing: 0.05em;
	line-height: 2.5ex;
	text-align: center;
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.9);
	
	/* position: relative; */
	
	position: absolute;

	color: #fff;	
}

#preloader_disp_txt
{
	width: 320px;
	
	position: absolute;
	
	-webkit-transform: translate(0, 110px);
	transform: translate(0, 110px);
	
	opacity: 0;
	
	z-index: 1;
}

#preloader_cloud_holder
{
	width: 123px;
	height: 80px;
	
	position: absolute;
	
	-webkit-transform	: translate(94px, 70px);
	transform			: translate(94px, 70px);
	
	z-index: 2;
}

#preloader_cloud
{
	width: 123px;
	height: 80px;
	
	-webkit-mask-image: url(../_img/preloadCloudyMask.png);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 160px 80px;
	-webkit-mask-position-x: -160px;
	
	mask-image: url(../_img/preloadCloudyMask.png);
	mask-repeat: no-repeat;
	mask-size: 160px 80px;
	mask-position-x: -160px;
}

.preload_buffer
{
	-webkit-transition: -webkit-mask-position-x 0.3s ease;
	transition: mask-position-x 0.3s ease;
}

#preloader_cloud_img
{
	width: 123px;
	height: 80px;
	
	background: url(../_img/preloadCloud.png) no-repeat top left;
	background-size: 123px 80px;
}

#preloader_hint_txt
{
	width: 320px;

	font-size: 16px;
	
	position: absolute;
	
	-webkit-transform: translate(0, 225px);
	transform: translate(0, 225px);
	
	opacity: 0;
	
	z-index: 1;
}


#disp_img
{
	z-index: 0;
}

/*
	ANIMATION ::::::
*/

.preloadFX
{
	-webkit-animation-name 				: preloadFX_Apply;
	-webkit-animation-iteration-count	: infinite;
	-webkit-animation-timing-function 	: linear;
	-webkit-animation-duration 			: 0.2s;
	
	animation-name 						: preloadFX_Apply;
	animation-iteration-count			: infinite;
	animation-timing-function 			: linear;
	animation-duration 					: 0.2s;
}

.preloadShowDispText
{
	-webkit-animation-name				: preloadShowDispText_Apply;
	-webkit-animation-fill-mode			: forwards;
	-webkit-animation-timing-function	: ease;
	-webkit-animation-duration			: 0.5s; 
	
	animation-name						: preloadShowDispText_Apply;
	animation-fill-mode					: forwards;
	animation-timing-function			: ease;
	animation-duration					: 0.5s;  
}

.preloadShowHintText
{
	-webkit-animation-name				: preloadShowHintText_Apply;
	-webkit-animation-fill-mode			: forwards;
	-webkit-animation-timing-function	: ease;
	-webkit-animation-duration			: 0.5s;
	-webkit-animation-delay				: 1s; 	 
	
	animation-name						: preloadShowHintText_Apply;
	animation-fill-mode					: forwards;
	animation-timing-function			: ease;
	animation-duration					: 0.5s;
	animation-delay						: 1s;   	
}

.preloadCloudFX
{
	-webkit-animation-name 				: preloadCloudFX_Apply;
	-webkit-animation-iteration-count	: infinite;
	-webkit-animation-timing-function 	: ease-in-out;
	-webkit-animation-duration 			: 2s;
	
	animation-name 						: preloadCloudFX_Apply;
	animation-iteration-count			: infinite;
	animation-timing-function 			: ease-in-out;
	animation-duration 					: 2s;
}

/* KEYFRAMES */

/*
	WEBKIT ::::::
*/

@-webkit-keyframes preloadFX_Apply
{
	0% 		{ opacity: 1; 	}
	25%		{ opacity: 0.8;	}
	50%		{ opacity: 1;	}
	75%		{ opacity: 0.9;	}
	100%	{ opacity: 1;	}
}

@-webkit-keyframes preloadShowDispText_Apply
{
	from	{ opacity: 0; -webkit-transform: translate(0, 110px); }
	to		{ opacity: 1; -webkit-transform: translate(0, 100px); }
}

@-webkit-keyframes preloadShowHintText_Apply
{
	from	{ opacity: 0; -webkit-transform: translate(0, 225px); }
	to		{ opacity: 1; -webkit-transform: translate(0, 220px); }
}

@-webkit-keyframes preloadCloudFX_Apply
{
	0% 		{ -webkit-transform: translate(94px, 70px); 	}
	50%		{ -webkit-transform: translate(94px, 65px);		}
	100%	{ -webkit-transform: translate(94px, 70px);		}
}

/*
	DEFAULT ::::::
*/

@keyframes preloadFX_Apply
{
	0% 		{ opacity: 1; 	}
	25%		{ opacity: 0.8;	}
	50%		{ opacity: 1;	}
	75%		{ opacity: 0.9;	}
	100%	{ opacity: 1;	}
}

@keyframes preloadShowDispText_Apply
{
	from	{ opacity: 0; transform: translate(0, 110px); }
	to		{ opacity: 1; transform: translate(0, 100px); }
}

@keyframes preloadShowHintText_Apply
{
	from	{ opacity: 0; transform: translate(0, 225px); }
	to		{ opacity: 1; transform: translate(0, 220px); }
}

@keyframes preloadCloudFX_Apply
{
	0% 		{ transform: translate(94px, 70px); 	}
	50%		{ transform: translate(94px, 65px);		}
	100%	{ transform: translate(94px, 70px);		}
}