/*-- HTML CSS Starts --*/
/* -- Fonts : Starts --*/
@font-face {
    font-family:'Lilita_One';
    src: url('fonts/Lilita_One.eot');
	src: url('fonts/Lilita_One.eot?#iefix') format('embedded-opentype'),		
	url('fonts/Lilita_One.woff') format('woff'),
	url('fonts/Lilita_One.woff2') format('woff2'),
	url('fonts/Lilita_One.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/*Fonts : Ends*/
/*! normalize - making reset / default for all browsers */
/*
*,html
{font-family:'Lilita_One'; -ms-text-size-adjust:100%;-webkit-text-size-adjust:100%; outline: none;
-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-o-user-select: none;user-select: none;-webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-touch-callout: none;
-webkit-backface-visibility:hidden;-o-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;}
body{background-color:#ffffff; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);-webkit-touch-callout: none;margin: 0px;padding: 0px; touch-action: manipulation !important;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}
audio:not([controls]){display:none;height:0;}
[hidden],template{display:none;}a{background:transparent;}
a:active,a:hover{outline:0;}
abbr[title]{border-bottom:1px dotted;}
dfn{font-style:italic;}
h1{font-size:2em;margin:.67em 0;}
mark{background:#ff0;color:#000;}
small{font-size:80%;}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup{top:-.5em;}
sub{bottom:-.25em;}
img{border:0;}
svg:not(:root){overflow:hidden;}
figure{margin:1em 40px;}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}
code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em;}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;}
button{overflow:visible;}
button,select{text-transform:none;}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;}
button[disabled],html input[disabled]{cursor:default;}
input{line-height:normal;}
input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto;}
input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em;}
table{border-collapse:collapse;border-spacing:0;}
td,th{padding:5px 0;}
b,strong,optgroup{font-weight:700;}
pre,textarea{overflow:auto;}
button::-moz-focus-inner,input::-moz-focus-inner,legend{border:0;padding:0;} 
::selection { background: transparent; }
::-moz-selection { background: transparent; }
*/

div{box-sizing: border-box;}

html{overflow: hidden !important; touch-action: manipulation !important;}

/* div{ touch-action: manipulation !important;} */

body{font-family:'Lilita_One'; -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); background-color: #ffffff;}

body input {
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    user-select: text;
}

body textarea {
    -webkit-touch-callout: text; -moz-touch-callout: text; -ms-touch-callout: text; -o-touch-callout: text;
    -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; -o-user-select: text;
    user-select: text; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; -o-user-select: text;
}
/*-- HTML CSS Ends --*/

/*-- Loader CSS Starts --*/
#html5Loader{
	top:0;left:0;margin:0;position:fixed;z-index: 3;background: #ffffff;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDA3NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ5JSIgc3RvcC1jb2xvcj0iIzAwMDAzMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	background: -moz-linear-gradient(left,  #ffffff 0%, #ffffff 49%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffffff), color-stop(49%,#ffffff));
	background: -webkit-linear-gradient(left,  #ffffff 0%,#ffffff 49%);
	background: -o-linear-gradient(left,  #ffffff 0%,#ffffff 49%);
	background: -ms-linear-gradient(left,  #ffffff 0%,#ffffff 49%);
	background: linear-gradient(to right,  #ffffff 0%,#ffffff 49%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 );
}
#html5Loader .fallback {top:50%;position:absolute;text-align:center;width:100%;color:white;/*vertical-align: middle;*/ /*display: block;font-style: normal;font-size:100px;*/}

div#DvLoaderCont{width:300px; height: 50px; position: absolute; top:-100px; left:0px; bottom: 0px; right: 0px; margin: auto; z-index:100; background: #ffffff; overflow: hidden;}
div#DvLoaderProgress{width:300px; height: 50px; position: absolute; top:0px; left:-300px; background:#8d4513;}
div#DvLoaderProgressBgText{
    width:300px; height: 0px; position: absolute; top:0px; left:0px; background:#8d4513; 
    text-align: center; font-size: 32px; color:#ffffff; line-height: 50px; letter-spacing: 5px;

}

/*-- Loader CSS Ends --*/


/*--Player CSS Starts --*/
div#DvMainCont{width:1280px; height:720px;	position: absolute;}
div#DvMainCont.ClsAbs{position: absolute !important;}

div#DvScrCont{width:1280px; height:720px; position: absolute; top:0px; left:0px; background: url("../assets/images/bg.png"); background-size:cover;}

/*-- Global css : Starts --*/
.ClsDisableCont{pointer-events: none;}
.ClsEnableCont{pointer-events: auto;}

/*-- Screen 0 : Starts --*/
div#DvScr0{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background: url("../assets/images/home.png"); background-size:cover;*/}
div#DvBaseScr0{width:439px; height:351px; position: absolute; top:299px; left:421px; background: url("../assets/images/baseScr0.png"); background-size:cover;}
div#DvTxtScr0_0{
	width:1280px; height:120px;	position: absolute; top:124px; left:0px;
	color:#ffffff; font-family: "Lilita_One"; font-size: 140px; text-align: center; 
	text-shadow: 0px 20px 2px rgba(81,16,56,0.75); 
	-webkit-text-shadow: 0px 20px 2px rgba(81,16,56,0.75); 
	-moz-text-shadow: 0px 20px 2px rgba(81,16,56,0.75); 
	-ms-text-shadow: 0px 20px 2px rgba(81,16,56,0.75);
	-o-text-shadow: 0px 20px 2px rgba(81,16,56,0.75);
}

div#DvBtn0_0{
	width:322px; height:110px; position: absolute; top:49px; left:57px; background: url("../assets/images/btn0_0.png"); background-size:cover;
	color:#ffffff; font-family: "Lilita_One"; font-size: 38px; text-align: center; cursor: pointer;
}
div#DvBtn0_0:hover{
	transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);
}

div#DvBtn0_1{
	width:322px; height:110px; position: absolute; top:195px; left:57px; background: url("../assets/images/btn0_1.png"); background-size:cover;
	color:#ffffff; font-family: "Lilita_One"; font-size: 38px; text-align: center; cursor: pointer;
}
div#DvBtn0_1:hover{
	transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);
}

/*-- Screen 0 : Ends --*/

/*-- Screen 1 : Starts --*/
div#DvScr1{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background: url("../assets/images/03.jpg"); background-size:cover;*/}
div#DvBaseScr1{width:758px; height:524px; position: absolute; top:104px; left:262px; background: url("../assets/images/baseScr1.png"); /*background-size:cover; opacity: 0.5;*/}
div#DvTxtScr1_0{
	width:758px; height:46px; position: absolute; top:16px; left:0px; color:#ffffff; font-family: "Lilita_One"; font-size: 40px; text-align: center; /*background: rgba(0,0,0,0.5);*/
}

div#DvBtnChar0{width:120px; height:123px; position: absolute; top:106px; left:102px; background-size:cover; cursor: pointer;}
div#DvBtnChar0:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvBtnChar1{width:120px; height:134px; position: absolute; top:96px; left:312px; background-size:cover; cursor: pointer;}
div#DvBtnChar1:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvBtnChar2{width:137px; height:129px; position: absolute; top:101px; left:536px; background-size:cover; cursor: pointer; }
div#DvBtnChar2:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvBtnChar3{width:120px; height:132px; position: absolute; top:302px; left:102px; background-size:cover; cursor: pointer;}
div#DvBtnChar3:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvBtnChar4{width:131px; height:129px; position: absolute; top:305px; left:312px; background-size:cover; cursor: pointer;}
div#DvBtnChar4:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvBtnChar5{width:120px; height:129px; position: absolute; top:305px; left:536px; background-size:cover; cursor: pointer;}
div#DvBtnChar5:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}

div#DvNameChar0{width:120px; height:30px; position: absolute; top:237px; left:102px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}
div#DvNameChar1{width:120px; height:30px; position: absolute; top:237px; left:312px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}
div#DvNameChar2{width:137px; height:30px; position: absolute; top:237px; left:536px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}

div#DvNameChar3{width:120px; height:30px; position: absolute; top:441px; left:102px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}
div#DvNameChar4{width:131px; height:30px; position: absolute; top:441px; left:312px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}
div#DvNameChar5{width:120px; height:30px; position: absolute; top:441px; left:536px; color:#8d4513; font-family: "Lilita_One"; font-size: 30px; text-align: center;}

.ClsChar0{background-image: url("../assets/images/char_filipa.png");}
.ClsChar1{background-image: url("../assets/images/char_naomi.png");}
.ClsChar2{background-image: url("../assets/images/char_zara.png");}
.ClsChar3{background-image: url("../assets/images/char_ben.png");}
.ClsChar4{background-image: url("../assets/images/char_ming.png");}
.ClsChar5{background-image: url("../assets/images/char_noah.png");}

.ClsBackBtn{
	width:99px; height:99px; position: absolute; top:16px; left:30px; background-image: url("../assets/images/btn_back.png"); background-size:cover; cursor: pointer;
	border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; 
}
.ClsBackBtn:hover{transform: scale(1.05); -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}
/*-- Screen 1 : Ends --*/

/*-- Screen 2 : Starts --*/
div#DvScr2{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background-image: url("../assets/images/04.jpg"); background-size:cover;*/}
div#DvCharScr2{width:150px; height:150px; position: absolute; top:230px; left:75px; background-size: contain; background-position: center; background-repeat: no-repeat;}
div#DvCharNameScr2{width:150px; height:30px; position: absolute; top:385px; left:75px; color:#ffffff; font-family: "Lilita_One"; font-size: 30px; text-align: center;}


div#DvScoreLabel{width:110px; height:30px; position: absolute; top:220px; left:1050px; color:#ffffff; font-family: "Lilita_One"; font-size: 30px; text-align: left;}
div#DvScore{width:110px; height:30px; position: absolute; top:220px; left:1155px; color:#ffffff; font-family: "Lilita_One"; font-size: 30px; text-align: left;}

div#DvTimerLabel{width:130px; height:30px; position: absolute; top:260px; left:1050px; color:#ffffff; font-family: "Lilita_One"; font-size: 30px; text-align: left;}
div#DvTimer{width:150px; height:30px; position: absolute; top:260px; left:1140px; color:#ffffff; font-family: "Lilita_One"; font-size: 30px; text-align: left;}

/*-- activity containers : starts --*/

div#DvContAct0{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background-image: url("../assets/images/05.jpg"); background-size:cover;*/}
.ClsActBase{width:800px; height:460px;	position: absolute; top:200px; left:240px; background-image: url("../assets/images/actBase.png"); background-size:cover;}
div#DvBaseAct1.ClsDisable{pointer-events: none; cursor: default;}
div#DvBaseAct2.ClsDisable{pointer-events: none; cursor: default;}

.ClsActCont{width:710px; height:400px;	position: absolute; top:30px; left:45px; /*background: rgba(0,0,0,0.5);*/}
div#DvActCont0{width:710px; height:400px;	position: absolute; top:30px; left:45px; /*background: rgba(0,0,0,0.5);*/}
.ClsQuesCont{
	width:1038px; height:103px;	position: absolute; top:-86px; left:-120px; background-image: url("../assets/images/quesBase.png"); background-size:cover;
	color:#ffffff; font-family: "Lilita_One"; text-align: center;
	text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-webkit-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-moz-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-ms-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
	-o-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
}

div#DvQues0{font-size: 32px; /*line-height: 103px;*/ padding-top: 20px;}
div#DvQues1{font-size: 32px; /*line-height: 103px;*/ padding-top: 20px;}
div#DvQues2{font-size: 32px; /*line-height: 103px;*/ padding-top: 20px;}

div#DvContAct1{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background-image: url("../assets/images/04.jpg"); background-size:cover;*/}

div#DvContAct2{width:1280px; height:720px;	position: absolute; top:0px; left:0px; /*background-image: url("../assets/images/06.jpg"); background-size:cover;*/}
/*-- activity containers : ends --*/


/*-- ---*/

div#DvPopupBg{width:1280px; height:720px;	position: absolute; top:0px; left:0px; background: rgba(255,255,255,0.5);}
.ClsPopupBg{
	width:500px; height:300px; position: absolute; top:210px; left:390px; background-color: #c4a684; border: 5px solid #a04c1e;
	border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px;	
}

div#DvPopupMsgS{
	width:100%; height:150px; position: absolute; top:30px; left:0px; font-size: 36px; text-align: center; color: #ffffff;
	text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-webkit-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-moz-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-ms-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
	-o-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
}
div#DvPopupMsgF{
	width:100%; height:150px; position: absolute; top:30px; left:0px; font-size: 60px; text-align: center; color: #ffffff;
	text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-webkit-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-moz-text-shadow: 0px 4px 2px rgba(127,55,43,0.75); 
	-ms-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
	-o-text-shadow: 0px 4px 2px rgba(127,55,43,0.75);
}

.ClsPopupBtn{
	width: 192px; height: 65px; position: absolute; top: 180px; left: 154px; background-image: url("../assets/images/btnSubmit.png"); 
	text-align: center; font-size: 24px; color: #ffffff; line-height: 65px; cursor: pointer;
}

/*-- Screen 2 : Ends --*/


/*-- Screen 1 : Ends --*/

#copyright {
    position: absolute;
    width: 200px;
    height: 30px;
    bottom: -5px;
    left: 530px;
    left: 530px;
    font-size: 20px;
    z-index: 9;
	color:white;
}
