@charset "UTF-8";

/* Font Declarations */
/*
	https://github.com/bramstein/fontfaceobserver
	https://codepen.io/Izaias/pen/ZbbLOJ
	https://github.com/pixijs/pixi.js/issues/1282
*/
/* @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700&display=swap');
@font-face {
	font-family: 'Roboto Condensed', sans-serif;
} */
/* ============================ */
/* DrescherGroteskBTMCO-Regular */
/* ============================ */
/* @font-face {
  font-family: 'DrescherGroteskBTMCOS-Regular';
  src:  url('fonts/DrescherGroteskBTMCO-Regular.eot')  format('opentype');
  src: url('fonts/DrescherGroteskBTMCO-Regular.eot?#iefix') format('embedded-opentype'),
	  url('fonts/DrescherGroteskBTMCO-Regular.woff')  format('woff'), 
	  url('fonts/DrescherGroteskBTMCO-Regular.ttf')  format('truetype'), 
	  url('fonts/DrescherGroteskBTMCO-Regular.svg#DrescherGroteskBTMCO-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
} */
/* ================= */
/* 		Open Sans	 */
/* ================= */
@font-face {
  font-family: 'OpenSans-Bold';
  src:  url('fonts/OpenSans-Bold.eot')  format('opentype');
  src: url('fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
	  url('fonts/OpenSans-Bold.woff')  format('woff'), 
	  url('fonts/OpenSans-Bold.ttf')  format('truetype'), 
	  url('fonts/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'OpenSans-SemiBold';
  src:  url('fonts/OpenSans-SemiBold.eot')  format('opentype');
  src: url('fonts/OpenSans-SemiBold.eot?#iefix') format('embedded-opentype'),
	  url('fonts/OpenSans-SemiBold.woff')  format('woff'), 
	  url('fonts/OpenSans-SemiBold.ttf')  format('truetype'), 
	  url('fonts/OpenSans-SemiBold.svg#OpenSans-SemiBold') format('svg');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'OpenSans-SemiBoldItalic';
  src:  url('fonts/OpenSans-SemiBoldItalic.eot')  format('opentype');
  src: url('fonts/OpenSans-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
	  url('fonts/OpenSans-SemiBoldItalic.woff')  format('woff'), 
	  url('fonts/OpenSans-SemiBoldItalic.ttf')  format('truetype'), 
	  url('fonts/OpenSans-SemiBoldItalic.svg#OpenSans-SemiBoldItalic') format('svg');
  font-weight: bold;
  font-style: italic;
}
/* ================ */
/* 		Raleway 	*/
/* ================ */
@font-face {
  font-family: 'Raleway-Bold';
  src:  url('fonts/Raleway-Bold.eot')  format('opentype');
  src: url('fonts/Raleway-Bold.eot?#iefix') format('embedded-opentype'),
	  url('fonts/Raleway-Bold.woff')  format('woff'), 
	  url('fonts/Raleway-Bold.ttf')  format('truetype'), 
	  url('fonts/Raleway-Bold.svg#Raleway-Bold') format('svg');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Raleway-SemiBold';
  src:  url('fonts/Raleway-SemiBold.eot')  format('opentype');
  src: url('fonts/Raleway-SemiBold.eot?#iefix') format('embedded-opentype'),
	  url('fonts/Raleway-SemiBold.woff')  format('woff'), 
	  url('fonts/Raleway-SemiBold.ttf')  format('truetype'), 
	  url('fonts/Raleway-SemiBold.svg#Raleway-SemiBold') format('svg');
  font-weight: bold;
  font-style: normal;
}

* {font-family: 'OpenSans-SemiBold'; font-kerning: none;}
/* .bold{
	font-family: 'AMCE-Bold';
}
.italic{
	font-family: 'AMCE-Italic';
}
.bold-italic{
	font-family: 'AMCE-BoldItalic';
} */
.visually-hidden {
	/*http://developer.yahoo.com/blogs/ydn/posts/2012/10/clip-your-hidden-content-for-better-accessibility/*/
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	padding: 0 !important;
	border: 0 !important;
	z-index: -1000;
	/*filter:alpha(opacity=0); /* that one we could drop,  we're really taking about one single pixel after all */
    /*opacity:0; /* we make that single box transparent */
}

#preloader{
	width: 100%;
	height: 100%;
	position: relative;
	background-color: #ffffff;
	display: none;
}
.loader {
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform-origin: 0 0;
	
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #3498db;
	width: 120px;
	height: 120px;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg) translate(-50%, -50%); }
  100% { -webkit-transform: rotate(360deg) translate(-50%, -50%); }
}

@keyframes spin {
  0% { transform: rotate(0deg) translate(-50%, -50%); }
  100% { transform: rotate(360deg) translate(-50%, -50%); }
}
.loading-text {
	font-size: 52.8px;
	position: absolute;
	top: 65%;
	left: 50%;
	transform: translateX(-50%);
}
#percent_loaded {
	display: inline-block;
	width: 80px;
}

.spacer {
	margin-bottom: 20px;
}
/* #overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
} */
.hide {
	display: none;
}

/* Popup CSS START */
/* #user_input_wrapper {
	position: absolute;
    text-align: center;
} */
#user_input_container {
	margin: 0 auto;
	pointer-events: none;
}
#user_input_wrapper {
	position: absolute;
    /* left: 0; */
    top: 0;
}
#user_input_wrapper.show {
	/* width: 100% !important; */
}
/* #dom_input_overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
    background-color: #003360;
    opacity: 0;
	transition: opacity 5s;
}
#dom_input_overlay.show {
    opacity: 1;
} */
/* #user_input_panel {
	position: relative;
    width: 0;
    height: 0;
	display: inline-block;
    padding: 1.75%;
    border-radius: 10px;
    background-image: linear-gradient(to bottom, #ffeb93 , #fffed0);
    top: 50%;
    transform: translateY(-50%);
	transition: width 0.5s, height 0.5s;
} */
#user_input_panel {
	position: absolute;
    display: inline-block;
    border-radius: 10px;
}
#user_input_panel.scene_3 {
	top: 43.5%;
    left: 5.2%;
    width: 47.9%;
    height: 30.7%;
}
#user_input_panel.scene_4 {
	top: 35.2%;
    left: 5.1%;
    width: 48.7%;
    height: 39.5%;
}
/* #user_input_panel.show {
	width: 90%;
    height: 50%;
} */
/* #text_input_container{
    position: relative;
    width: calc(100% - 2.75%);
    height: calc(100% - 30%);
    display: block;
    padding-bottom: 4.7%;
    margin: 0;
} */
#text_input_container{
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    /* padding-bottom: 4.7%; */
    margin: 0;
	pointer-events: all;
}
#html_textInput {
    position: relative;
    width: 100%;
    height: 100%;
    resize: none;
    font-size: 16px;
    padding: 0.5% 0% 0.5% 2%;
    margin: 0;
    /* border: 3px solid #f5d28f; */
    border-radius: 10px;
	outline: none;
	border: none;
	background-color: transparent;
}
/* #buttons_container {
	position: relative;
	height: calc(100% - 80%);
	top: 5px;
	display: none;
} */
#btn_html_submit,
#btn_html_cancel {
	/* background-color: #0aff07; */
	background-color: transparent;
    background-repeat: no-repeat;
    background-size: contain;
	height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
	cursor: pointer;
}
#btn_html_submit {
	background-image: url('../images/btn_enter.png');
	width: 9.4%;
    margin-right: 5px;
}
#btn_html_submit:hover {
	background-image: url('../images/btn_enter.hover.png');
}
#btn_html_cancel {
    width: 10.5%;
	background-image: url('../images/btn_cancel.png');
	margin-left: 5px;
}
#btn_html_cancel:hover {
	background-image: url('../images/btn_cancel.hover.png');
}
textarea[disabled] {
	/* background-color: #e8e8e8; */
    color: #8e8e8e;
}	
/* Popup CSS END */