/* !!! GLOBAL */
/*#region*/
@font-face
{
    font-family: "Mulish";
    font-weight: 400 700;
    font-style:  italic;
    src: url("../fonts/Mulish-Italic-VariableFont_wght.ttf") format("truetype");
}

@font-face
{
    font-family: "Mulish";
    font-weight: 400 700;
    font-style:  normal;
    src: url("../fonts/Mulish-VariableFont_wght.ttf") format("truetype");
}

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: "Mulish", "Open Sans", sans-serif; }

body { width: 100%; height: 100%; border: 0; margin: 0; background-color: #f7f7f7; font-size: 100%; overflow: hidden;
    
    -webkit-touch-callout:    none;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust:     none;

    -webkit-user-select:      none;
    -moz-user-select:         none;
    -ms-user-select:          none;
     user-select:             none;     
}

.Shadow    { box-shadow: 5px 5px 5px -2px rgba(46,74,117,0.25); }
.GrayScale { -webkit-filter: grayscale(100%); filter: grayscale(100%); }
.Rounded   { border-radius: 4px; }
.BtnFix    { outline: none; border: none; background: none; }
.BgImg     { background-size: contain; background-repeat:no-repeat; background-position: center; background-image: url(''); overflow: hidden; }
.Click     { cursor: pointer; }

.LeftSide  { position: absolute; height: 79%; width: 50%; top:15%; left: 0;   }
.RightSide { position: absolute; height: 79%; width: 50%; top:15%; left: 50%; }

/* Hide scrollbar for Chrome, Safari and Opera */
.NoScollbar::-webkit-scrollbar { display: none; }
/* Hide scrollbar for IE, Edge and Firefox */
.NoScollbar { -ms-overflow-style: none; scrollbar-width: none; }

.HeaderDiv { position: absolute; height: 15%; width: 100%; overflow: hidden; }
.HeaderImg { position: absolute; height: 90%; width: 40%; top: 0; left: 30%; }
.HeadLBtn  { position: relative; float:left;  height: 100%; width: 10%; }
.HeadRBtn  { position: relative; float:right; height: 95%;  width: 10%; }
.FooterDiv { position: absolute; height: 6%; width: 100%; bottom: 0; overflow: hidden; }

.BackBtn:active { opacity: 0.4; }

.View         { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: white; background-size: 100vw 100vh; }

.ViewBg0      { background-image: url('../images/backgrounds/index0.png'); }
.ViewBg1      { background-image: url('../images/backgrounds/index1.png'); }
.ViewBg2      { background-image: url('../images/backgrounds/index2.png'); }
.ViewBg3      { background-image: url('../images/backgrounds/index3.png'); }

#LoginView    { display: none; }
#UserListView { display: none; }
#ProjectsView { display: none; }
#AppStartView { display: none; }
#LoadView     { display: block; }

/* LOAD IMAGE */
.LoadingBg  { position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: 0; border: 0; background-color: white; overflow: hidden; z-index: 1000; }
.LoadingImg { position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: 0; border: 0;
              background-repeat:no-repeat; background-position: center; background-size: 12%; background-image: url('../images/load/diamond.png'); overflow: hidden; z-index: 1001;
              -webkit-animation: Spin 8s linear infinite;
}
@-moz-keyframes    Spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes Spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes         Spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

@-moz-keyframes    SpinReset { 100% { -moz-transform: rotate(0); } }
@-webkit-keyframes SpinReset { 100% { -webkit-transform: rotate(0deg); } }
@keyframes         SpinReset { 100% { -webkit-transform: rotate(0deg); transform:rotate(0deg); } }
/*#endregion*/

/* !!! TimedInfoView */
/*#region*/
#TimedInfoView { display: flex; align-items: center; justify-content: center; }

#TimedInfoWin
{
    display: none;
    position: absolute; top: 39.5%; left: 50%; transform: translateX(-50%) translateY(-50%);
    padding: 2%; background-color: #4f5d73;
    color: white; font-size: 2.8vmin; font-weight: bold;
}
/*#endregion*/

/* APP VIEW - CREATE A DEFAULT VIEW CLASS */
#AppView     { display: block; }

/* !!! START VIEW */
/*#region*/
#StartView     { display: none; text-align: center; }


#SVLoginBtn    { position: relative; float: right; margin-right: 5%; top: 20%; height: 70%; width: 60%; cursor: pointer; }
/* #SVLoginBtn   { position: relative; float: right; margin-right: 5%; top: 20%; height: 70%; width: 70%; cursor: pointer; } IPAD */
#SVLoginImg    { position: absolute; top: 0;   left:  0; height: 80%; width: 100%; background-image: url('../images/buttons/loginbtn.png'); }
#SVLoginTxt    { position: absolute; top: 80%; left:  0; height: 20%; width: 100%; font-size: 3vmin; font-weight: bolder; text-align: center; }

#SVTrialBtn    { position: relative; float: left; margin-left: 5%;  top: 20%; height: 70%; width: 60%; cursor: pointer; } 
/* #SVTrialBtn   { position: relative; float: left; margin-left: 5%;  top: 20%; height: 70%; width: 70%; cursor: pointer; } IPAD */
#SVTrialImg    { position: absolute; top: 0;   left:  0; height: 80%; width: 100%; background-image: url('../images/buttons/trialbtn.png'); }
#SVTrialTxt    { position: absolute; top: 80%; left:  0; height: 20%; width: 100%; font-size: 3vmin; font-weight: bolder; text-align: center; }

.SVSkolonBtn   { position: absolute; bottom: 2%; left:  0;  height: 8vh; width: 16vh; background-image: url('../images/buttons/skolonloginbtn.png'); display: none; }
.SVSpaCatBtn   { position: absolute; top:    4%; right: 2%; height: 90%; width: 10%;  background-image: url('../images/buttons/catalanbtn.png');     display: none; }
.SVRedeemBtn   { position: absolute; text-align: center; height: 4%; width: 30%; left:  35%; bottom: 0; color: white; font-size: 2.6vmin; }
.SVVersionTxt  { position: absolute; text-align: right;  height: 4%; width: 20%; right: 0;   bottom: 0; color: white; }

.SVRedeemDiv   { position: absolute; top: 20%; left: 20%; height: 40%; width: 60%; background-color: white; border: 1px solid black; display: none; }
.SVRedeemTxt   { font-size: 2.0vmin; font-weight: bolder; text-align: left; }
.SVRedeemTitle { position: absolute; top: 0;   left:   0; height: 20%; width: 100%; text-align: left; color: white; font-size: 3vmin; font-weight: bolder; background-color: #63b4e6; }
.SVRedeemClose { position: absolute; top: 0;   left: 90%; height: 20%; width: 10%;  background-image: url('../images/buttons/logoutbtn.png'); }
.SVRedeemTxt1  { position: absolute; top: 22%; left:  1%; height: 13%; width: 98%; }
.SVRedeemCode  { position: absolute; top: 35%; left:  2%; height: 13%; width: 96%; padding: 1%; border: 1px solid gray; }
.SVRedeemTxt2  { position: absolute; top: 52%; left:  1%; height: 13%; width: 98%; }
.SVRedeemMail  { position: absolute; top: 65%; left:  2%; height: 13%; width: 96%; padding: 1%;  border: 1px solid gray; }
.SVRedeemOKBtn { position: absolute; top: 82%; right: 2%; height: 15%; width: 20%; text-align: center; color: white; background-color: #63b4e6; }


#SVLoginBtn:active { opacity: 0.4; }
#SVTrialBtn:active { opacity: 0.4; }
/*#endregion*/

/* !!! LOGIN VIEW */
/*#region*/
#LoginView      { display: none; }

#LVBackBtn      { background-image: url('../images/buttons/backbtn.png'); }
#LVHelpImg      { background-image: url('../images/buttons/helpbtn.png'); }

#LVFrame        { position: absolute; top: 30%; left: 25%; height: 35%; width: 50%; background-color: #eeeeee; }

#LVUserTxt      { position: absolute; top: 4%;  left: 05%; height: 8%; width: 90%; font-size: 3vmin; }
#LVUserInput    { position: absolute; top: 15%; left: 05%; height: 14%; width: 90%; }

#LVPassTxt      { position: absolute; top: 35%; left: 05%; height: 8%; width: 90%; font-size: 3vmin; }
#LVPassInput    { position: absolute; top: 46%; left: 05%; height: 14%; width: 90%; }

#LVOKBtn        { position: absolute; bottom: 16%; left: 05%; height: 20%; width: 35%; font-size: 3vmin; font-weight: bolder; color: white; border:none; background-color: #335a6c; border-radius: 0.3em; }
#LVTermsTxt      { position: absolute; bottom: 0; left: 05%; height: 10%; width: 90%; font-size: 1.6vmin; text-align: left; }

input           { background-color: white; border: 1px solid white; font-size: 3vmin; font-weight: bolder; }

#LVBackBtn:active  { opacity: 0.4; }
#LVHelpImg:active  { opacity: 0.4; }
#LVOKBtn:active    { opacity: 0.4; }
/*#endregion*/

/* !!! USERLIST VIEW */
/*#region*/
#UserListView    { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: white; background-size: 100vw 100vh; display: none; }

#ULBackBtn       { background-image: url('../images/buttons/backbtn.png');                          }
#ULSkolonBtn     { position: absolute; top: 0; left: 1%; height: 15vh; width: 15vh; background-image: url('../images/buttons/skolonbackbtn.png'); display: none; }
#ULProfileBtn    { background-image: url('../images/profiles/index0/profile00.png'); display: none; }
#ULResetBtn      { background-image: url('../images/buttons/resetbtn.png'); display: block;         }

/*#ULContactsWin  { display: none; }*/
/*#ULContactsHead { position: absolute; top: 0;   height: 15%;  left: 0; width: 100%; background-color: none;  display: block; }*/
#ULContactsWin { position: absolute; top: 15%; height: 85%;  left: 0; width: 100%; background-color: white; display: none; }

#ULContactsTitle { position: absolute; height: 16%; width: 100%; top: 0; left: 0; font-size: 4.5vmin; font-weight: bolder; }   

#ULOneContactBtn { position: relative; float: left; margin-left: 5%; height: 70%; width: 50%; top:16%; cursor: pointer; }
#ULOneContactImg { position: absolute; top: 0;   left:  0; height: 80%; width: 100%; background-image: url('../images/buttons/contactbtn0.png?v=2'); }
#ULOneContactTxt { position: absolute; top: 80%; left:  0; height: 20%; width: 100%; font-size: 3vmin; font-weight: bolder; text-align: center; }

#ULTwoContactBtn { position: relative; float: right;  margin-right: 5%; height: 70%; width: 50%; top:16%; cursor: pointer; }
#ULTwoContactImg { position: absolute; top: 0;   left:  0; height: 80%; width: 100%; background-image: url('../images/buttons/contactbtn1.png'); }
#ULTwoContactTxt { position: absolute; top: 80%; left:  0; height: 20%; width: 100%; font-size: 3vmin; font-weight: bolder; text-align: center; }

#ULLoginTxt
{
    position: absolute;
    height: 20%;
    width: 80%;
    top: 40%;
    left: 10%;
    outline: 0;
    border: none;
    background-color: white;
    text-align: center;
    color: #595959;
    font-size: 4.5vmin;
    font-weight: bolder;
}

#ULList         { position: absolute; top: 15%; height: 77.5%; width: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; }

.ULItem         { position: relative; float:left; height: 36%; width: 18.5%; margin: 1% 0 0 1%; background-color: none; }
.ULItemImg      { position: absolute; height:  80%; top: 0; left: 0; width: 80%;   background-size: contain; background-repeat: no-repeat; background-position: center; }
/*#endregion*/

/* !!! MODE MENU */
#ULOptionsMenu     { position: absolute; top: 15%; left: 0; height: 85%;  width: 100%; background-color: #f7f7f7; }

/* !!! OPTIONS */
/*#region*/

.ULOptBtn { position: relative; float:left; height: 13%; width: 44%; margin-left: 4%; margin-top: 2%; background-color: white ;}
.ULOptImg { position: absolute; height: 96%; top: 02%; left: 02%; width: 18%; background-size: contain; background-repeat: no-repeat; background-position: center; }
.ULOptTxt { position: absolute; height: 96%; top: 02%; left: 23%; width: 75%; background: none; outline: none; border: none; text-align: left; font-size: 3vmin; font-weight: bold; color: #285d6c; }
.ULOptKey { background-image: url('../images/app/adminbtn.png'); background-size: auto 30%; background-repeat: no-repeat; background-position: top right; }

#ULAddBtnImg           { background-image: url('../images/buttons/addbtn.png');     }
#ULDelBtnImg           { background-image: url('../images/buttons/delbtn.png');     }
#ULDelProjectsImg      { background-image: url('../images/buttons/delbtn.png');     }
#ULDelAllBtnImg        { background-image: url('../images/buttons/delbtn.png');     }
#ULVisibleBtnImg       { background-image: url('../images/buttons/visiblebtn.png'); }
#ULIconBtnImg          { background-image: url('../images/buttons/addstudentbtn.png'); }
#ULShowLibBtnImg       { background-image: url('../images/buttons/checkbtn0.png');  }
#ULSavePassBtnImg      { background-image: url('../images/buttons/checkbtn0.png');  }
#ULShowTeachersBtnImg  { background-image: url('../images/buttons/checkbtn0.png');  }
#ULShowTypeBtnImg      { background-image: url('../images/buttons/checkbtn0.png');  }
#ULOptionsPassBtnImg   { background-image: url('../images/buttons/checkbtn0.png');  }
#ULContactsBtnImg      { background-image: url('../images/buttons/checkbtn0.png');  }

#ULBackBtn:active    { opacity: 0.4; }
#ULProfileBtn:active { opacity: 0.4; }
#ULResetBtn:active   { opacity: 0.4; }

#ULAddBtnImg:active         { opacity: 0.4; }
#ULDelBtnImg:active         { opacity: 0.4; }
#ULDelAllBtnImg:active      { opacity: 0.4; }
#ULVisibleBtnImg:active     { opacity: 0.4; }
#ULIconBtnImg:active        { opacity: 0.4; }
#ULShowLibBtnImg:active     { opacity: 0.4; }
#ULSavePassImg:active       { opacity: 0.4; }
#ULShowTeachersImg:active   { opacity: 0.4; }
#ULOptionsPassBtnImg:active { opacity: 0.4; }
#ULContactsBtnImg:active    { opacity: 0.4; }
/*#endregion*/

/* !!! PROJECTS VIEW */
/*#region*/
#ProjectsView       { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-size: 100vw 100vh; display: none; }

#PSHeaderDiv        { position: absolute; height: 15%; width: 100%; overflow: hidden; }
.PSLevelBtn         { float: left; position: relative; height: 100%; color: white; font-size: 2.8vmin; font-weight: bold; text-align: left; margin-left: 1%; padding: 0; display: none; }
.PSLevelHomeBg      { width: 5.5vh; margin-left:  1%; background-image: url('../images/buttons/librarybtn.png?v=1'); }
.PSLicenceTxt       { float: right; margin-right: 1%; font-size: 2.4vmin; display: block; }

.PSBtnImg           { position: absolute; height: 80%; top: 0; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: bottom; }

#PSBackBtn          { background-image: url('../images/buttons/backbtn.png');   display: none;}
#PSNewBtn           { background-image: url('../images/buttons/newbtn.png');    display: none; }
#PSLogoutBtn        { background-image: url('../images/buttons/logoutbtn.png'); display: none; }
#PSHelpBtn          { background-image: url('../images/buttons/helpbtn.png'); }

#PSInfoFrame        { position: absolute; top: 17%; height: 82%; left: 50%; width: 47%; background-color: white; display: none; }
#PSInfoTitle        { position: absolute; top: 0; height: 10%; left: 0;  width: 100%; font-weight: bold; text-align: left; }
#PSInfoTxt          { position: absolute; top: 10%; height: 90%; left: 4%;  width: 92%; }
#PSInfoCloseBtn     { position: absolute; top: 0; height: 10%;   right: 0; width: 10%; background-image: url('../images/buttons/closebtn.png'); background-size: contain; background-repeat: no-repeat; background-position: center; background-color: none; }

#PSAppInfoFrame     { position: absolute; top: 17%; height: 81%; left: 3%;  width: 94%; background-color: white; overflow-y: scroll; display: none; }
#PSAppInfoTxt       { position: absolute; top: 0;  height: 80%; left: 1%;  width: 98%; padding: 1%; }

#PSLoadingWin       { position: absolute; top: 0;   height: 100%;  left: 0; width: 100%; background-color: none;  display: block; }
#PSLoadingHead      { position: absolute; top: 0;   height: 15%;   left: 0; width: 100%; background-color: none;  display: block; }
#PSLoadingBody      { position: absolute; top: 15%; height: 77.5%; left: 0; width: 100%; background-color: white; display: block; }

.PSListFrame        { position: absolute; top:   15%; height: 77.5%; left:  0;  width: 100%; overflow:   hidden; }
.PSList             { position: absolute; top:     0; height:  100%; left:  0;  width: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0; margin: 0; text-align: center; vertical-align: middle; }
#PSListLoadBtn      { position: absolute; bottom: 1%; height:    6%; left: 37%; width:  30%; overflow:   hidden; background-color:#83c3ea; color: white; font-weight: bold; display: none; }

.ItemTop            { position: relative; display:inline-block; width: 34%; height: 48%; margin-top: 1%; opacity: 0.90; }
.ItemTop1           { position: absolute; width: 35%; height: 48%; top: 1%;  left: 15%; background-position-x: right; border: 1px solid black;  }
.ItemTop2           { position: absolute; width: 35%; height: 48%; top: 1%;  left: 50%; background-position-x: left; }
.ItemTop3           { position: absolute; width: 35%; height: 48%; top: 50%; left: 15%; background-position-x: right;  }
.ItemTop4           { position: absolute; width: 35%; height: 48%; top: 50%; left: 50%; background-position-x: left;  }

.ItemSub            { position: relative; float: left; width: 20%; height: 28%; margin: 1% 0 1% 4%; }

.ItemIcon           { position: absolute; height: 80%; width: 100%; top:    0; left: 0; }
.ItemTitleSub       { position: absolute; height: 20%; width: 100%; bottom: 0; left: 0; background: none; border: none; outline: none; color: #595959; font-size: 2.0vmin; font-weight: bold; text-align: center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ItemTitleTop       { position: absolute; height: 20%; width: 100%; bottom: 0; left: 0; background: none; border: none; outline: none; color: #595959; font-size: 2.8vmin; font-weight: bold; text-align: center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

#PSBackBtn:active   { opacity: 0.4; }
#PSNewBtn:active    { opacity: 0.4; }
#PSLogoutBtn:active { opacity: 0.4; }
#PSHelpBtn:active   { opacity: 0.4; }

#PSNewView    { position: absolute; height: 100%; width: 100%; top: 0; left: 0;  background-color: #f7f7f7; display: none; }
#PSNewHead    { position: absolute; height: 15%;  width: 100%; top: 0; left: 0;  background-color: #83c3ea; }
/*#PSNewTitle   { position: absolute; height: 98%;  width: 80%;  top: 01%; left: 10%; background-color:transparent;  color: white; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; }*/
#PSNewBody    { position: absolute; height: 85%;  width: 100%; top: 15%; left: 0; }

#PSNewQPickImgListenBtn { top: 4%; } 
#PSNewQPickImgReadBtn   { top: 28%; } 
#PSNewQSortBtn          { top: 52%; }
#PSNewQBuildBtn         { top: 76%; }

.PSNewItemBtnL { position: absolute; height: 20%;  width: 80%;  top: 10%; left: 10%; background-color: white; border-radius: 0.3em; overflow: hidden; cursor: pointer; }
.PSNewItemBtnR { position: absolute; height: 40%;  width: 40%;  top: 10%; left: 55%; background-color: white; border-radius: 0.3em; overflow: hidden; cursor: pointer; }
.PSNewItemImg  { position: absolute; height: 80%;  width: 20%;  top: 10%; left: 0; }
.PSNewItemLbl  { position: absolute; height: 25%;  width: 78%;  top: 0; left: 21%; color: black; font-size: 2.0vw; font-weight: bold; text-align: left; padding: 0; }
.PSNewItemTxt  { position: absolute; height: 74%;  width: 78%;  top: 25%; left: 21%; font-size: 1.5vw; text-align: left; }

.PSNewQPickImgListen { background-image: url('../images/projects/type2.png'); }
.PSNewQPickImgRead   { background-image: url('../images/projects/type3.png'); }
.PSNewQSortImg       { background-image: url('../images/projects/type4.png'); }
.PSNewQBuildImg      { background-image: url('../images/projects/type5.png'); }

#PSMetaView     { position: absolute; height: 100%; width: 100%; top: 0; left: 0;  background-color: #f7f7f7; display: none; }
#PSMetaHead     { position: absolute; height: 15%;  width: 100%; top: 0; left: 0;  background-color: #83c3ea; }
#PSMetaBody     { position: absolute; height: 85%;  width: 100%; top: 10%; left: 0;  }
#PSMetaForm     { position: absolute; height: 60%;  width:  80%; top: 20%; left: 10%; background-color: #83c3ea; }

#PSMetaIconLbl  { position: absolute; height: 12%;  width:  35%; top: 04%; left: 02%;  }
#PSMetaIcon     { position: absolute; height: 70%;  width:  35%; top: 17%; left: 02%; background-color: white; background-image: url('../images/buttons/newlistenbtn.png'); }
#PSMetaTitleLbl { position: absolute; height: 12%;  width:  58%; top: 04%; right: 02%; }
#PSMetaTitle    { position: absolute; height: 15%;  width:  58%; top: 17%; right: 02%; }
#PSMetaTextLbl  { position: absolute; height: 12%;  width:  58%; top: 38%; right: 02%; }
#PSMetaText     { position: absolute; height: 15%;  width:  58%; top: 51%; right: 02%; }
#PSMetaOKBtn    { position: absolute; height: 20%;  width:  20%; bottom: 03%; right: 02%; background-color: #65af67; text-align: center; }

.PSMetaLbl    { font-size: 2.5vw; font-weight: bolder; color: white; text-align: left; margin: 0; padding: 0; }
.PSMetaTxt    { background-color: white; color: black; padding: 1%; }
/*#endregion*/

/* !!! INPUT VIEW */
/*#region*/
#InputView        { position: absolute; top: 0; left: 0; height: 100%; width: 100%;   background-color: grey;  background-color: rgba(100, 100, 100, 0.6); display: none; }
#INHeaderWin      { position: absolute; height: 50%; width: 80%; top: 20%; left: 10%; background-color: white; border-radius: 0.3em; box-shadow: 5px 5px 5px -2px rgba(46,74,117,0.25); overflow: hidden; }

#INTitleTxt       { position: absolute; height: 50%; width: 90%; top: 5%; left: 5%; background: none; outline: none; border: none; text-align: left; font-size: 4vmin; font-weight: bold; color: #335a6c; overflow-wrap:normal; }

#INCheckTxt       { position: absolute; height: 15%; width: 80%; top: 55%; right: 5%; background: none; outline: none; border: none; text-align: left; font-size: 3vmin; font-weight: bold; color: #335a6c; overflow-wrap:normal; }
#INCheckImg       { position: absolute; height: 15%; width: 10%; top: 55%; left:  5%; background-size: contain; background-repeat: no-repeat; background-position: center; }

.INCheckImg0      { background-image: url('../images/buttons/checkbtn0.png'); }
.INCheckImg1      { background-image: url('../images/buttons/checkbtn1.png'); }

#INOKBtn          { position: absolute; bottom: 5%; left:  5%; height: 15%; width: 20%; font-size: 4vmin; font-weight: bolder; color: white; border:none; background-color: #335a6c; border-radius: 0.3em; }
#INStopBtn        { position: absolute; bottom: 5%; right: 5%; height: 15%; width: 20%; font-size: 4vmin; font-weight: bolder; color: white; border:none; background-color: #c75c5c; border-radius: 0.3em; }

#INOKBtn:active   { opacity: 0.4; }
#INStopBtn:active { opacity: 0.4; }

/*#endregion*/

/* !!! EDITOR STARTVIEW */
#EditorStartView { position: absolute; top: 0; left: 0; height: 100%; width: 100%; margin: 0; padding:0; overflow: hidden; display: none; }