/* FONTS */ @font-face { font-family: "LocalOpenSans"; font-style: normal; font-weight: 400; src: url("../fonts/OpenSans-Regular.ttf") format("truetype"); } @font-face { font-family: "LocalOpenSans"; font-style: italic; font-weight: 400; src: url("../fonts/OpenSans-Italic.ttf") format("truetype"); } @font-face { font-family: "LocalOpenSans"; font-style: normal; font-weight: 700; src: url("../fonts/OpenSans-Bold.ttf") format("truetype"); } @font-face { font-family: "LocalOpenSans"; font-style: italic; font-weight: 700; src: url("../fonts/OpenSans-BoldItalic.ttf") format("truetype"); } @font-face { font-family: "LocalNunito"; font-style: normal; font-weight: 400; src: url("../fonts/Nunito-Regular.ttf") format("truetype"); } @font-face { font-family: "LocalNunito"; font-style: italic; font-weight: 400; src: url("../fonts/Nunito-Italic.ttf") format("truetype"); } @font-face { font-family: "LocalNunito"; font-style: normal; font-weight: 700; src: url("../fonts/Nunito-Bold.ttf") format("truetype"); } @font-face { font-family: "LocalNunito"; font-style: italic; font-weight: 700; src: url("../fonts/Nunito-BoldItalic.ttf") format("truetype"); } @font-face { font-family: "LocalMulish"; font-style: normal; font-weight: 400; src: url("../fonts/Muli-Regular.ttf") format("truetype"); } @font-face { font-family: "LocalMulish"; font-style: italic; font-weight: 400; src: url("../fonts/Muli-Italic.ttf") format("truetype"); } @font-face { font-family: "LocalMulish"; font-style: normal; font-weight: 700; src: url("../fonts/Muli-Bold.ttf") format("truetype"); } @font-face { font-family: "LocalMulish"; font-style: italic; font-weight: 700; src: url("../fonts/Muli-BoldItalic.ttf") format("truetype"); } @font-face { font-family: "LocalSourceSansPro"; font-style: normal; font-weight: 400; src: url("../fonts/SourceSansPro-Regular.ttf") format("truetype"); } @font-face { font-family: "LocalSourceSansPro"; font-style: italic; font-weight: 400; src: url("../fonts/SourceSansPro-Italic.ttf") format("truetype"); } @font-face { font-family: "LocalSourceSansPro"; font-style: normal; font-weight: 700; src: url("../fonts/SourceSansPro-Bold.ttf") format("truetype"); } @font-face { font-family: "LocalSourceSansPro"; font-style: italic; font-weight: 700; src: url("../fonts/SourceSansPro-BoldItalic.ttf") format("truetype"); } @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"); } * { font-family: "Mulish", "Open Sans", sans-serif; } /* Contacts key input */ .KeyInput { position: absolute; height: 1px; width: 1px; top: 0; right: 0; border: none; margin: 0; padding: 0; font-size: 1px; caret-color: transparent; background-color: transparent; } /*#region*/ body { width: 100%; height: 100%; border: 0; margin: 0; padding: 0; background-color: #f8f8f8; 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; } canvas { background-color: #dcd3d1; touch-action: none; border: 0; margin: 0; padding: 0; } textarea:focus, input:focus { outline: none; } input[type="file"] { display: none; } .Shadow { box-shadow: 5px 5px 5px -2px rgba(46,74,117,0.25); } .CursorPointer { cursor: pointer; } .NoSelect { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .TxtSelect { -moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text; } #FadePageBg { position: absolute; width: 90%; height: 90%; top: 10%; left: 10%; background-color: #f7f7f7; z-index: 199; opacity: 0; transition:opacity 0.5s; } .BgImg { background-repeat: no-repeat; background-size: contain; background-position: center; overflow: hidden; } .BtnTxt { border: none; border-style: none; outline: none; background-color: transparent; overflow: hidden; } .GreyScale { -webkit-filter: grayscale(100%); filter: grayscale(100%); } /*#endregion*/ /* LOAD IMAGE */ #LoadingBg { position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: 0; border: 0; background-color: #f8f8f8; 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/editor/buttons/loadingbtn.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); } } /* BACK IMAGE */ #BackBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; left: 0%; background-repeat: no-repeat; background-size: contain; cursor: pointer; } .BackBtn0 { background-image: url('../images/editor/buttons/backbtn0.png?v=2'); opacity: 1.00; background-position: center center; } .BackBtn1 { background-image: url('../images/editor/buttons/backbtn1.png?v=2'); opacity: 0.75; background-position: left top; } #HelpBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; left: 10vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/helpbtn.png'); background-position: center center; } #PreviewBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; left: 20vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/previewbtn0.png'); background-position: center center; } #FixBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; left: 30vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/allbtn.png'); background-position: center center; } #QuickTestBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; right: 30vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/multitest/listbtn.png'); background-position: center center; } #SettingsBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; right: 20vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/settingsbtn.png'); background-position: center center; } #PagesBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; right: 10vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/pagesbtn.png'); background-position: center center; } #SaveBtn { position: absolute; height: 10vh; width: 10vh; top: 0%; right: 00vh; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/savebtn0.png'); background-position: center center; } /* PAGES BTN */ #NextPageBtn { position: absolute; top: 46vh; right: 0%; z-index: 90; opacity: 0.75; background-repeat:no-repeat; background-size: contain; background-position: right center; background-image: url('../images/editor/buttons/pagerightbtn.png'); visibility: hidden; } #PrevPageBtn { position: absolute; top: 46vh; left: 0%; z-index: 90; opacity: 0.75; background-repeat:no-repeat; background-size: contain; background-position: left center; background-image: url('../images/editor/buttons/pageleftbtn.png'); visibility: hidden; } .PageBtn0 { height: 8vh; width: 8vh; top: 46vh; } .PageBtn1 { height: 10vh; width: 10vh; top: 45vh; } /* PAGE Index */ .PageIndexBg { position: absolute; height: 3.1%; width: 60%; top: 87%; left: 20%; text-align: center; background-color: rgba(248 ,248 ,248 ,1.00); z-index: 101; } .PageIndexSel0 { position: relative; height: 80%; width: 9%; top: 10%; display: inline-block; background-color: rgba(170 ,170 ,170 ,0.60); border-radius: 2px; } .PageIndexSel1 { position: relative; height: 80%; width: 9%; top: 10%; display: inline-block; background-color: rgba(79 ,93 ,115 ,1.00); border-radius: 2px; } /* TOP MAIN MENU */ #TypeMenuBg { position: absolute; height: 15%; width: 100%; top: 50%; left: 0%; background-color: rgba(173,216,230,0.9); overflow: hidden; z-index: 100; } #TypeMenuBtn { position: relative; float:left; height: 100%; width: 22%; top: 0%; z-index: 101; } .TypeBtn { position: relative; float:left; height: 80%; width: 10%; top: 10%; z-index: 101; } /* Quick menus */ .LQuickMenuBg { position: absolute; height: 78%; width: 15%; top: 11%; left: 0%; min-width: 5%; overflow: hidden; z-index: 100; display: none; } .RQuickMenuBg { position: absolute; height: 78%; width: 15%; top: 11%; right: 0%; min-width: 5%; overflow: hidden; z-index: 100; display: none; } .QuickMenuBtn { position: relative; height: 15.0%; width: 100%; margin-top: 3vh; background-repeat:no-repeat; background-size: contain; cursor: pointer; z-index: 101; } .QuickMenuBtn:active { opacity: 0.4; } /* Image Tools - IT */ /*#region*/ .ITWinBg0 { position: absolute; width: 60%; height: 8%; left: 20%; top: 70%; background: rgba(52,122,120,0.5); border: 1px solid #c3c7c7; border-radius: 6px; overflow: hidden; z-index: 100; } .ITWinBg1 { position: absolute; width: 60%; height: 8%; left: 20%; top: 70%; background: none; border: none; overflow: hidden; z-index: 100; } .ITBtn { position: absolute; width: 7.69%; height: 100%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url(''); } /*#endregion*/ /* Sort Tools - ST */ /*#region*/ .STWinBg { position: absolute; width: 54%; height: 8%; left: 22.5%; top: 10.0%; background: rgba(248,248,248,1); border: 0; outline: 0; overflow: hidden; z-index: 100; display: none; } .STBtn { position: relative; display: inline-block; width: 9.09%; height: 100%; background-repeat:no-repeat; background-size: 60%; background-position: center; background-image: url(''); } #STModeBtn { float:right; } /*#endregion*/ .PopupHelpC { position: absolute; top: 4%; left: 5%; padding: 4px; background-color: #666566; color: white; white-space: nowrap; border-radius: 3px; visibility: hidden; z-index: 300; } .PopupHelpTxt { color: white; font-size: 2.2em; font-weight: bold; } /* TRANSLATE VIEW */ /*#region*/ #TranslateBG { position: absolute; padding: 1%; width: 60%; height: 50%; left: 20%; top: 25%; margin: 0; padding: 0; background-color:white; border: 1px solid grey; z-index: 200; } .TranslateRow { height: 12%; width: 50%; background-color:white; border: 1px solid grey; cursor: pointer; } .TranslateImg { float: left; height: 100%; width: 12%; margin-left: 1%; background-repeat:no-repeat; background-size: contain; background-position: center; cursor: pointer; } .TranslateTxt { float: left; height: 100%; width: 70%; margin-left: 1%; background-color:transparent; border: none; outline: none; font-size: 3.0vmin; font-weight: bold; text-align: left; cursor: pointer; } .TranslateLog { position: absolute; width: 49%; height: 100%; left: 51%; top: 0; font-size: 1.2vmin; color: black; font-weight: bold; text-align: left; background-color:white; border: 1px solid grey; overflow-x: scroll; overflow-y: scroll; } /*#endregion*/ /* RECORD VIEW - RV. */ /*#region*/ #RVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.65); z-index: 200; } #RVWinBg { position: absolute; width: 50%; height: 40%; left: 25%; top: 25%; background-color: #ededed; overflow: hidden; } #RVHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #RVTitleTxt { position: absolute; width: 80%; height: 15%; left: 10%; top: 0%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.0vmin; font-weight: bold; text-align: center; } #RVBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #RVInfoBtn { position: absolute; width: 10%; height: 15%; left: 90%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } #RVOKBtn { position: absolute; width: 10%; height: 15%; right: 0%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } #RVUploadForm { position: absolute; width: 90%; height: 75%; left: 5%; top: 20%; visibility:hidden; } #RVRecordBtn { position: absolute; width: 25%; height: 100%; left: 0%; top: 00%; color:black; background-color: white; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; border-radius: 0.5em; } #RVRecordBtnTxt { position: absolute; width: 100%; height: 20%; left: 0%; top: 00%; background-color: transparent; border: none; outline: none; color: #767171; font-size: 2vmin; font-weight: bold; } .RVRecordBtnImg0 { position: absolute; width: 100%; height: 80%; left: 0%; top: 20%; background-color: transparent; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/recordbtn.png'); } .RVRecordBtnImg1 { position: absolute; width: 100%; height: 80%; left: 0%; top: 20%; background-color: transparent; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/stoprecordingbtn.png'); } #RVTextInputBtn { position: absolute; width: 70%; height: 25%; left: 30%; top: 0%; background-color: white; border: none; outline: none; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; overflow: hidden; } #RVTextInputBtnImg { position: absolute; width: 20%; height: 100%; left: 0%; top: 0%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/typebuttons/textbtn1.png'); } #RVTextInputBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 0%; background-color: white; border: none; outline: none; color: black; text-align: left; font-size: 2vmin; font-weight: bold; } #RVImageBtn { position: absolute; width: 70%; height: 25%; left: 30%; top: 30%; background-color: white; border: none; outline: none; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; } #RVImageBtnImg { position: absolute; width: 20%; height: 100%; left: 0%; top: 0%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/typebuttons/imagebtn1.png'); } #RVImageBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 0%; background-color: white; border: none; outline: none; color: #767171; text-align: left; font-size: 2vmin; font-weight: bold; } .RVPlayBtn0 { position: absolute; width: 20%; height: 40%; left: 30%; top: 60%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: 60%;background-position: center; background-image: url('../images/editor/buttons/playbtn0.png'); } .RVPlayBtn1 { position: absolute; width: 20%; height: 40%; left: 30%; top: 60%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: 60%;background-position: center; background-image: url('../images/editor/buttons/playbtn1.png'); } .RVPlayBtn2 { position: absolute; width: 20%; height: 40%; left: 30%; top: 60%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: 60%;background-position: center; background-image: url('../images/editor/buttons/stoprecordingbtn.png'); } #RVInfoLbl { position: absolute; width: 20%; height: 40%; left: 55%; top: 60%; background-color: #a6a6a6; border: none; outline: none; color: white; font-size: 2vmin; font-weight: bold; border-radius: 0.5em; } .RVUploadBtn0 { position: absolute; width: 20%; height: 40%; left: 80%; top: 60%; background-color: #a6a6a6; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } .RVUploadBtn1 { position: absolute; width: 20%; height: 40%; left: 80%; top: 60%; background-color: #5fb062; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } /*#endregion*/ /* VIDEOREC VIEW - VRV. */ /*#region*/ #VRVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.65); z-index: 200; } #VRVWinBg { position: absolute; width: 80%; height: 60%; left: 10%; top: 15%; background-color: #ededed; overflow: hidden; } #VRVHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #VRVTitleTxt { position: absolute; width: 80%; height: 15%; left: 10%; top: 0%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.0vmin; font-weight: bold; text-align: center; } #VRVBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #VRVInfoBtn { position: absolute; width: 10%; height: 15%; left: 90%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } #VRVOKBtn { position: absolute; width: 10%; height: 15%; right: 0%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } #VRVUploadForm { position: absolute; width: 90%; height: 75%; left: 5%; top: 20%; visibility:hidden; } #VRVRecVideo { position: absolute; width: 25%; height: 45%; left: 0; top: 0; background-color: #a6a6a6; outline: none; border-radius: 0.5em; } #VRVPlayVideo { position: absolute; width: 25%; height: 45%; left: 0; top: 50%; background-color: #a6a6a6; outline: none; border-radius: 0.5em; } #VRVTextInputBtn { position: absolute; width: 70%; height: 20%; left: 30%; top: 0%; background-color: white; border: none; outline: none; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; overflow: hidden; } #VRVTextInputBtnImg { position: absolute; width: 20%; height: 100%; left: 0%; top: 0%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/typebuttons/textbtn1.png'); } #VRVTextInputBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 0%; background-color: white; border: none; outline: none; color: black; text-align: left; font-size: 2vmin; font-weight: bold; } #VRVImageBtn { position: absolute; width: 70%; height: 20%; left: 30%; top: 25%; background-color: white; border: none; outline: none; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; } #VRVImageBtnImg { position: absolute; width: 20%; height: 100%; left: 0%; top: 0%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/typebuttons/imagebtn1.png'); } #VRVImageBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 0%; background-color: white; border: none; outline: none; color: #767171; text-align: left; font-size: 2vmin; font-weight: bold; } .VRVRecordBtn0 { position: absolute; width: 23%; height: 20%; left: 30%; top: 50%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: auto 80%; background-position: center; background-image: url('../images/editor/buttons/recordview/recordbtn.png'); border-radius: 0.5em; } .VRVRecordBtn1 { position: absolute; width: 23%; height: 20%; left: 30%; top: 50%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: auto 80%; background-position: center; background-image: url('../images/editor/buttons/recordview/stopbtn.png'); border-radius: 0.5em; } /*#VRVRecordBtn { position: absolute; width: 20%; height: 25%; left: 30%; top: 50%; color:black; background-color: white; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; border-radius: 0.5em; } #VRVRecordBtnTxt { position: absolute; width: 100%; height: 40%; left: 0; top: 0; background-color: transparent; border: none; outline: none; color: #767171; font-size: 2vmin; font-weight: bold; } .VRVRecordBtnImg0 { position: absolute; width: 100%; height: 60%; left: 0; top: 40%; background-color: transparent; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/recordview/recordbtn.png'); } .VRVRecordBtnImg1 { position: absolute; width: 100%; height: 60%; left: 0; top: 40%; background-color: transparent; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/recordview/stopbtn.png'); }*/ .VRVPlayBtn0 { position: absolute; width: 23%; height: 20%; left: 55%; top: 50%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: auto 80%; background-position: center; background-image: url('../images/editor/buttons/recordview/playbtn.png'); border-radius: 0.5em; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .VRVPlayBtn1 { position: absolute; width: 23%; height: 20%; left: 55%; top: 50%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: auto 80%; background-position: center; background-image: url('../images/editor/buttons/recordview/playbtn.png'); border-radius: 0.5em; } .VRVPlayBtn2 { position: absolute; width: 23%; height: 20%; left: 55%; top: 50%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: auto 80%; background-position: center; background-image: url('../images/editor/buttons/recordview/stopbtn.png'); border-radius: 0.5em; } #VRVInfoLbl { position: absolute; width: 48%; height: 20%; left: 30%; top: 75%; border: none; outline: none; color: white; font-size: 2vmin; font-weight: bold; border-radius: 0.5em; background-image: linear-gradient(to right, #00ff00 0%, #a6a6a6 0%); } .VRVUploadBtn0 { position: absolute; width: 20%; height: 20%; left: 80%; top: 75%; background-color: #a6a6a6; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } .VRVUploadBtn1 { position: absolute; width: 20%; height: 20%; left: 80%; top: 75%; background-color: #5fb062; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } /*#endregion*/ /* UPLOAD VIEW - UV. A - Image, B - Audio, C - Record audio */ /*#region*/ #UVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.65); z-index: 200; } #UVWinBg { position: absolute; width: 60%; height: 50%; left: 20%; top: 20%; background-color: #ededed; overflow: hidden; } #UVHeadBg { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #UVTitleTxt { position: absolute; width: 80%; height: 20%; left: 10%; top: 0%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #UVBackBtn { position: absolute; width: 10%; height: 20%; left: 0%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #UVInfoBtn { position: absolute; width: 10%; height: 20%; left: 90%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } #UVOKBtn { position: absolute; width: 10%; height: 20%; right: 0%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } #UVUploadForm { position: absolute; width: 86%; height: 70%; left: 07%; top: 25%; visibility:hidden; } #UVFileInputLbl { position: absolute; width: 48%; height: 48%; left: 0%; top: 0%; color:black; background-color: gainsboro; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; } #UVFileInputImgA { position: absolute; width: 40%; height: 100%; left: 0%; top: 0%; background-color: white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/imagebtn.png'); } #UVFileInputImgB { position: absolute; width: 40%; height: 100%; left: 0%; top: 0%; background-color: white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/audiobtn.png'); } #UVFileInputTxt { position: absolute; width: 60%; height: 100%; left: 40%; top: 0%; background-color: white; border: none; outline: none; color: #767171; font-size: 2vmin; font-weight: bold; text-align:left; } #UVTextInput { position: absolute; width: 47%; height: 22%; left: 52%; top: 0%; background-color: white; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold; padding-left: 1%; } #UVImageBtn { position: absolute; width: 48%; height: 48%; left: 0%; top: 52%; background-color: white; border: none; outline: none; display: inline-block; cursor: pointer; text-align:center; vertical-align:middle; } #UVImageBtnImg { position: absolute; width: 40%; height: 100%; left: 0%; top: 0%; background-color: white; border: none; outline: none; background-repeat:no-repeat; background-size: 80%; background-position: center; background-image: url('../images/editor/buttons/imagebtn.png'); } #UVImageBtnTxt { position: absolute; width: 60%; height: 100%; left: 40%; top: 0%; background-color: white; border: none; outline: none; color: #767171; font-size: 2vmin; font-weight: bold; text-align:left; } .UVInfoLbl0 { position: absolute; width: 48%; height: 22%; left: 52%; top: 25%; background-color: #a6a6a6; border: none; outline: none; color: white; font-size: 2vmin; font-weight: bold; text-align: center; border-radius: 0.5em; } .UVInfoLbl1 { position: absolute; width: 48%; height: 22%; left: 52%; top: 25%; background-color: #c85e5c; border: none; outline: none; color: white; font-size: 2vmin; font-weight: bold; text-align: center; border-radius: 0.5em; } .UVUploadBtn0 { position: absolute; width: 25%; height: 40%; left: 75%; top: 60%; background-color: #a6a6a6; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } .UVUploadBtn1 { position: absolute; width: 25%; height: 40%; left: 75%; top: 60%; background-color: #5fb062; border: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); border-radius: 0.5em; } .UVUploadBtn1:hover { background-color: #a4d0a5; } /*#endregion*/ /* CONTENT VIEW - CV */ /*#region*/ #CVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #CVWinBg { position: absolute; width: 80%; height: 70%; left: 10%; top: 15%; background-color: #ededed; overflow: hidden; } #CVHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #CVTitleTxt { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #CVLeftTitleTxt { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; color: #767171; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #CVBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #CVHelpBtn { position: absolute; width: 10%; height: 15%; right: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } #CVTopBgUser { position: absolute; width: 33%; height: 15%; left: 10%; top: 15%; background-color: transparent; overflow: hidden; } #CVTopBgApp { position: absolute; width: 33%; height: 15%; left: 57%; top: 15%; background-color: transparent; overflow: hidden; } #CVFolderBgUser { position: absolute; width: 10%; height: 55%; left: 00%; top: 30%; background-color: transparent; overflow: hidden; } #CVFolderBgApp { position: absolute; width: 10%; height: 55%; left: 90%; top: 30%; background-color: transparent; overflow: hidden; } #CVFileBgUser { position: absolute; width: 33%; height: 55%; left: 10%; top: 30%; background-color: white; overflow-y: scroll; overflow-x: hidden; } #CVFileBgApp { position: absolute; width: 33%; height: 55%; left: 57%; top: 30%; background-color: white; overflow-y: scroll; overflow-x: hidden; } #CVHelpVidBtn { position: absolute; width: 33%; height: 55%; left: 57%; top: 30%; background-color:white; color: #767171; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #CVFuncBgUser { position: absolute; width: 33%; height: 15%; left: 10%; top: 85%; background-color: none; overflow: hidden; } #CVFuncBgApp { position: absolute; width: 33%; height: 15%; left: 57%; top: 85%; background-color: none; overflow: hidden; } #CVDelBtn { position: absolute; width: 15%; height: 100%; left: 00%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pagedelbtn.png'); } #CVArchiveBtn { position: absolute; width: 15%; height: 100%; left: 85%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/source/archivebtn.png'); } #CVUploadBtn { position: absolute; width: 15%; height: 100%; left: 70%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/source/uploadbtn.png'); } #CVFolderIconABtn { position: absolute; width: 15%; height: 100%; left: 55%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/foldericonbtn.png'); } #CVFolderIconBBtn { position: absolute; width: 15%; height: 100%; left: 70%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/foldericonbtn.png'); } #CVFolderIconDelBtn { position: absolute; width: 15%; height: 100%; left: 35%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/foldericondelbtn.png'); } #CVCopyFileBtn { position: absolute; width: 15%; height: 100%; left: 00%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/copyfilebtn.png'); } #CVAllFilesBtn { position: absolute; width: 15%; height: 100%; left: 85%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/contentallbtn.png'); } .CatBtn { position: relative; float:left; width: 25%; height: 100%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn0 { position: absolute; height: 16.6%; top: 00.0%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn1 { position: absolute; height: 16.6%; top: 16.6%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn2 { position: absolute; height: 16.6%; top: 33.2%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn3 { position: absolute; height: 16.6%; top: 49.8%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn4 { position: absolute; height: 16.6%; top: 66.4%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderBtn5 { position: absolute; height: 16.6%; top: 83.0%; width: 100%; left: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } .FolderImage0 { position: relative; float:left; width: 25%; height: 20%; background-color: white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/loading.png'); } .FolderImage1 { position: relative; float:left; width: 25%; height: 20%; background-color: #f5cf87; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/loading.png'); } /*#endregion*/ /* SOURCE VIEW - SV */ /*#region*/ #SVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #SVWinBg { position: absolute; width: 80%; height: 60%; left: 10%; top: 20%; background-color: #83c3ea; overflow: hidden; } #SVHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #SVBodyBg { position: absolute; width: 100%; height: 85%; left: 00%; top: 15%; background-color: none; overflow: hidden; } #SVTitleTxt { position: absolute; width: 30%; height: 15%; left: 35%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #SVBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #SVArchiveBtn { position: absolute; width: 30%; height: 60%; left: 2.5%; top: 10%; border: none; border-style: none; outline: none; background-color:white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/source/archivebtn.png'); } #SVContentBtn { position: absolute; width: 30%; height: 60%; left: 35%; top: 10%; border: none; border-style: none; outline: none; background-color:white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/source/contentbtn.png'); } #SVUploadBtn { position: absolute; width: 30%; height: 60%; left: 67.5%; top: 10%; border: none; border-style: none; outline: none; background-color:white; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/source/uploadbtn.png'); } #SVArchiveTxt { position: absolute; width: 30%; height: 20%; left: 2.5%; top: 70%; border: none; border-style: none; outline: none; background-color:white; } #SVContentTxt { position: absolute; width: 30%; height: 20%; left: 35%; top: 70%; border: none; border-style: none; outline: none; background-color:white; } #SVUploadTxt { position: absolute; width: 30%; height: 20%; left: 67.5%; top: 70%; border: none; border-style: none; outline: none; background-color:white; } /*#endregion*/ /* TEXTVIEW - TV */ /*#region*/ #TVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #TVWinBg { position: absolute; width: 70%; height: 60%; left: 15%; top: 20%; background-color: #83c3ea; overflow: hidden; } #TVNameBg { position: absolute; width: 40%; left: 10%; height: 15%; overflow:hidden; text-align: center; } #TVSizeBg { position: absolute; width: 40%; left: 50%; height: 15%; overflow:hidden; text-align: center; } #TVColorBg { position: absolute; width: 10%; height: 85%; left: 90%; top: 15%; } #TVStyleBg { position: absolute; width: 10%; height: 85%; left: 00%; top: 15%; } #TVOKBtn { position: absolute; width: 10%; height: 15%; right: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } #TVBackBtn { position: absolute; width: 10%; height: 15%; left: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #TVTextArea { position: absolute; width: 80%; height: 82.5%; left: 10%; top: 15%; color: black; background-color: white; border:none; resize:none; wrap:soft; } .TVBtn { font-size: 5vmin; font-weight: bold; background-color: white; border: none; outline: none; padding: 0; } .TVColorBtn { position: relative; width: 50%; height: 10%; margin-top: 7%; margin-left: 15%; border: 1vh solid #d1d1d1; } .TVTTSBtn0 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn0.png'); } .TVTTSBtn1 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn1.png'); } .TVTTSBtn2 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn2.png'); } .TVTTSBtn3 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn3.png'); } .TVTTSBtn4 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn4.png'); } .TVTTSBtn5 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn5.png'); } .TVTTSBtn6 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn6.png'); } .TVTTSBtn7 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn7.png'); } .TVTTSBtn8 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn8.png'); } .TVTTSBtn9 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn9.png'); } .TVTTSBtn10 { position: absolute; width: 70%; height: 15%; bottom: 3%; left: 15%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/ttsbtn10.png'); } .TVStyleBtn { position: relative; width: 90%; height: 16.0%; margin-top: 7%; margin-left: 5%; font-size: 4vmin; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url(''); } .TVSizeBtn { position: relative; float: left; width: 26%; height: 80%; margin-top: 2%; margin-left: 5%; color:white; background-color: #345c6d; } .TVNameBtn { position: relative; float: left; width: 20%; height: 80%; margin-top: 2%; margin-left: 3%; } /*#endregion*/ /* SETTINGS VIEW - SET */ /*#region*/ #SETBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.65); z-index: 200; } #SETWinBg { position: absolute; width: 40%; height: 60%; left: 30%; top: 15%; background-color: #ededed; overflow: hidden; } #SETHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #SETTitleTxt { position: absolute; width: 70%; height: 15%; left: 15%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #SETBackBtn { position: absolute; width: 15%; height: 15%; left: 02%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #SETHelpBtn { position: absolute; width: 15%; height: 15%; left: 85%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); } #SETBtnBg { position: absolute; width: 90%; height: 75%; left: 05%; top: 20%; background-color: white; } .SETBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 00%; color: #404040; text-align: left; font-size: 2.5vmin; font-weight: bold; background-color: transparent; border: none; outline: none; } .SETBtnImg { position: absolute; width: 20%; height: 100%; left: 00%; top: 00%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: 50%; background-position: center; background-image: url('../images/editor/buttons/settings/checkbtn0.png'); } /*#SETImageMenuBtn { position: absolute; width: 50%; height: 20%; left: 00%; top: 00%; } #SETAudioMenuBtn { position: absolute; width: 50%; height: 20%; left: 50%; top: 00%; }*/ #SETGridBtn { position: absolute; width: 50%; height: 20%; left: 00%; top: 00%; } #SETAudioIconBtn { position: absolute; width: 50%; height: 20%; left: 50%; top: 20%; } #SETAllToolsBtn { position: absolute; width: 50%; height: 20%; left: 00%; top: 20%; } /*#SETMenuTextBtn { position: absolute; width: 50%; height: 20%; left: 50%; top: 20%; }*/ #SETPageIndexBtn { position: absolute; width: 50%; height: 20%; left: 50%; top: 00%; } #SETSnapBtn { position: absolute; width: 50%; height: 20%; left: 50%; top: 40%; display: none; } /*#endregion*/ /* PAGEVIEW - PV */ /*#region*/ #PVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.65); z-index: 200; } #PVWinBg { position: absolute; width: 40%; height: 75%; right: 2%; top: 12%; background-color: #83c3ea; overflow: hidden; } #PVHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #PVTitleTxt { position: absolute; width: 75%; height: 15%; left: 25%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #PVBackBtn { position: absolute; width: 23%; height: 15%; left: 2%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } .PVList0 { position: absolute; width: 45%; height: 72%; left: 3%; top: 18%; background-color: white; border: none; outline: none; overflow-y: auto; box-sizing: border-box; font-size: 4vmin;} .PVList1 { position: absolute; width: 40%; height: 72%; left: 8%; top: 18%; background-color: white; border: none; outline: none; overflow-y: auto; box-sizing: border-box; font-size: 4vmin;} .PVListOpt:not(:checked) { background-color: white; color: #404040; text-align: center; font-size: 4vmin; } .PVListOpt:checked { background-color: #4f5d73; color: white; text-align: center; font-size: 4vmin; } .PVRndList0 { position: absolute; width: 5%; height: 72%; left: 3%; top: 18%; background-color: white; border: none; outline: none; overflow:hidden; box-sizing: border-box; font-size: 4vmin; display: none; } .PVRndList1 { position: absolute; width: 5%; height: 72%; left: 3%; top: 18%; background-color: white; border: none; outline: none; overflow:hidden; box-sizing: border-box; font-size: 4vmin;} .PVRndListOpt:not(:checked) { background-color: white; color: white; font-size: 4vmin; } .PVRndListOpt:checked { background-color: white; color: white; font-size: 4vmin; } #PVBtnBg { position: absolute; width: 45%; height: 72%; left: 51%; top: 18%; } #PVAddBtn { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; background-color: white; } #PVAddBtnTxt { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; text-align: center; font-size: 2vmin; font-weight: bold; } #PVAddBtnImg { position: absolute; width: 100%; height: 80%; left: 00%; top: 20%; border: none; border-style: none; outline: none; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pageaddbtn.png'); } #PVUpBtn { position: absolute; width: 100%; height: 19%; left: 00%; top: 21%; background-color: white; } #PVUpBtnTxt { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; text-align: center; font-size: 2vmin; font-weight: bold; } #PVUpBtnImg { position: absolute; width: 100%; height: 80%; left: 00%; top: 20%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pageupbtn.png'); } #PVDownBtn { position: absolute; width: 100%; height: 19%; left: 00%; top: 41%; background-color: white; } #PVDownBtnTxt { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; text-align: center; font-size: 2vmin; font-weight: bold; } #PVDownBtnImg { position: absolute; width: 100%; height: 80%; left: 00%; top: 20%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pagedownbtn.png'); } #PVCopyBtn { position: absolute; width: 100%; height: 19%; left: 00%; top: 61%; background-color: white; } #PVCopyBtnTxt { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; text-align: center; font-size: 2vmin; font-weight: bold; } #PVCopyBtnImg { position: absolute; width: 100%; height: 80%; left: 00%; top: 20%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pagecopybtn.png'); } #PVDelBtn { position: absolute; width: 100%; height: 19%; left: 00%; top: 81%; background-color: white; } #PVDelBtnTxt { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; text-align: center; font-size: 2vmin; font-weight: bold; } #PVDelBtnImg { position: absolute; width: 100%; height: 80%; left: 00%; top: 20%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/pagedelbtn.png'); } #PVRndBtn { position: absolute; width: 45%; height: 8%; left: 3%; top: 91%; background-color: white; } #PVRndBtnTxt { position: absolute; width: 80%; height: 100%; left: 20%; top: 00%; text-align: left; font-size: 2vmin; font-weight: bold; background: none; border: none; outline: none; } .PVRndBtnImg0 { position: absolute; width: 20%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/settings/checkbtn0.png'); } .PVRndBtnImg1 { position: absolute; width: 20%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/settings/checkbtn1.png'); } .PVRndSel0 { position: absolute; width: 45%; height: 8%; left: 51%; top: 91%; background-color: white; font-size: 2vmin; font-weight: bold; display: none; } .PVRndSel1 { position: absolute; width: 45%; height: 8%; left: 51%; top: 91%; background-color: white; font-size: 2vmin; font-weight: bold; } /*#endregion*/ /* ARCHIVEVIEW - AV */ /*#region*/ #AVBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #AVWinBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #AVTitleTxt { position: absolute; width: 58%; height: 10%; left: 21%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #AVSearchInput { position: absolute; width: 20%; height: 06%; right: 01%; top: 02%; background-color: white; border: none; border-radius: 0.5em; outline: none; color: black; font-size: 2vmin; font-weight: bold; padding-left: 1%; } #AVBackBtn { position: absolute; width: 10%; height: 10%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-image: url('../images/editor/buttons/backbtn0.png'); cursor: pointer; } #AVTextBtn { position: absolute; width: 10%; height: 10%; left: 10%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/showtextbtn.png'); visibility: hidden; } #AVImageList { position: absolute; width: 100%; height: 80%; top: 10%; background-color: #f8f8f8; overflow-y: scroll; } .AVListItem0 { position: relative; float:left; width: 15.5%; height: 20%; background-color: white; margin-top: 1%; margin-left: 0.5%; margin-right: 0.5%; cursor: pointer; } .AVListItem1 { position: relative; float:left; width: 15.5%; height: 20%; background-color: #f5cf87; margin-top: 1%; margin-left: 0.5%; margin-right: 0.5%; cursor: pointer; } #AVUploadBtn { position: absolute; width: 10%; height: 10%; left: 00%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/uploadbtn.png'); cursor: pointer; } #AVDelBtn { position: absolute; width: 10%; height: 10%; left: 10%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/imagedelbtn.png'); cursor: pointer; } #AVAudioRecBtn { position: absolute; width: 10%; height: 10%; left: 20%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/whiterecordbtn.png'); cursor: pointer; } #AVVideoRecBtn { position: absolute; width: 10%; height: 10%; left: 00%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/videorecwbtn.png'); cursor: pointer; } #AVSourceBtn { position: absolute; width: 05%; height: 10%; left: 10%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/teckensprakbtn.png'); cursor: pointer; } #AVOKBtn { position: absolute; width: 10%; height: 10%; right: 00%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); cursor: pointer; } #AVAllBtn { position: absolute; width: 10%; height: 10%; right: 10%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/allbtn.png'); cursor: pointer; } #AVBgAllBtn { position: absolute; width: 10%; height: 10%; right: 10%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/allbtn.png'); cursor: pointer; } #AVPlayBtn { position: absolute; width: 10%; height: 10%; right: 20%; top: 90%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/playbtn.png'); cursor: pointer; } .AVImgItem { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/archivebtn.png'); } .AVImgTxtItem { position: absolute; width: 100%; height: 75%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/archivebtn.png'); } .AVTxtItem { position: absolute; width: 100%; height: 25%; left: 00%; top: 75%; text-align: center; font-size: 2vmin; font-weight: bold; } .AVLinkItem { position: absolute; width: 100%; height: 25%; left: 00%; top: 75%; text-align: center; text-decoration: underline; color:dodgerblue; font-size: 2vmin; font-weight: bold; } /*#endregion*/ /* INPUTBOX - IB */ /*#region*/ #IBBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 1100; } #IBWinBg { position: absolute; width: 36%; height: 25%; left: 32%; top: 20%; background-color: #ededed; overflow: hidden; } #IBHeadBg { position: absolute; width: 100%; height: 40%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #IBTitleTxt { position: absolute; width: 100%; height: 40%; left: 00%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 2.5vmin; font-weight: bold; text-align: left; white-space: normal; } #IBTextInput { position: absolute; width: 90%; height: 20%; left: 5%; top: 45%; background-color: white; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold; visibility:hidden; } #IBBackBtn { position: absolute; width: 30%; height: 40%; right: 5%; top: 50%; background-color: #c75c5c; color: white; text-align: center; outline: none; border: 0px white; border-radius: 0.5em; font-size: 3vmin; font-weight: bold; visibility:hidden; } #IBBackBtn:hover { background-color: #d98f8f; } #IBOKBtn { position: absolute; width: 30%; height: 40%; left: 5%; top: 50%; background-color: #65af67; color: white; text-align: center; outline: none; border: 3px solid #546f70; border-radius: 0.5em; font-size: 3vmin; font-weight: bold; visibility:hidden; } #IBOKBtn:hover { background-color: #a4d0a5; } /*#endregion*/ /* TEST SELECT MENU - TS */ /*#region*/ #TSBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #TSWinBg { position: absolute; width: 80%; height: 60%; left: 10%; top: 20%; background-color: #83c3ea; overflow: hidden; } #TSHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #TSListBg { position: absolute; width: 100%; height: 85%; left: 00%; top: 15%; background-color: transparent; overflow: hidden; } #TSTitleTxt { position: absolute; width: 80%; height: 15%; left: 10%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 3.5vmin; font-weight: bold; text-align: center; } #TSBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); cursor: pointer; } #TSHelpBtn { position: absolute; width: 10%; height: 15%; right: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/infobtn.png'); cursor: pointer; } .TSTestItem { position: relative; float:left; width: 47%; height: 26%; background-color: white; margin-top: 2%; margin-left: 2%; border-radius: 0.3em; overflow: hidden; cursor: pointer; } .TSTestItem0 { position: relative; float:left; width: 47%; height: 26%; background-color: lightgray; margin-top: 2%; margin-left: 2%; border-radius: 0.3em; overflow: hidden; cursor: pointer; } .TSImgItem { position: absolute; width: 20%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: 80%; background-position: center; background-image: url(''); } .TSTitleItem { position: absolute; width: 60%; height: 28%; left: 20%; top: 02%; color: black; background-color:transparent; border: none; outline: none; font-size: 2.6vmin; font-weight: bold; text-align: left; overflow: hidden; } .TSLinkItem { position: absolute; width: 20%; height: 30%; left: 80%; top: 00%; color: #4f5d73; background-color:transparent; border: none; outline: none; font-size: 2vmin; font-weight: bold; text-align: center; overflow: hidden; cursor: pointer; } .TSTxtItem { position: absolute; width: 79%; height: 70%; left: 20%; top: 30%; color: black; background-color:transparent; border: none; outline: none; font-size: 1.9vmin; text-align: left; overflow: hidden; } .GrayScale { -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); } /*#endregion*/ /* Test Quick selection */ /*#region*/ #QuickTestBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } .QuickTestWin { position: absolute; width: 80%; height: 80%; left: 10%; top: 10%; overflow: hidden; } .QuickTestHead { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } .QuickTestExitBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } .QuickTestTitleTxt { position: absolute; width: 30%; height: 15%; left: 35%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 4.0vmin; font-weight: bolder; text-align: center; } .QuickTestBody { position: absolute; width: 100%; height: 85%; left: 00%; top: 15%; background-color: #83c3ea; overflow-y: auto; overflow-x: hidden; } .QuickTestRow { position: relative; width: 96%; height: 10%; float:left; margin-left: 2%; margin-top: 2%; background-color: white; overflow: hidden; border-radius: 6px; } .QuickTestTxtCol { position: absolute; width: 8%; height: 94%; left: 00%; top: 03%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/test1btn.png'); } .QuickTestImgCol { position: absolute; width: 8%; height: 94%; left: 00%; top: 03%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/test2btn.png'); } .QuickTestPageCol { position: absolute; width: 20%; height: 100%; left: 08%; top: 00%; color: #4f5d73; background-color: white; overflow: hidden; border: none; outline: none; font-size: 3.0vmin; font-weight: bolder; text-align: center; } .QuickTestTitleCol { position: absolute; width: 70%; height: 100%; left: 28%; top: 00%; color: #4f5d73; background-color: white; overflow: hidden; border: none; outline: none; font-size: 2.5vmin; font-weight: bold; text-align: left; } /*#endregion*/ /* Test multi view - TM TestView */ /*#region*/ #TMBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 200; } #TMWinBg { position: absolute; width: 80%; height: 80%; left: 10%; top: 10%; background-color: #83c3ea; overflow: hidden; } #TMHeadBg { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } #TMTextBg { position: absolute; width: 100%; height: 10%; left: 00%; top: 16%; background-color: none; overflow: hidden; } #TMListBg { position: absolute; width: 90%; height: 70%; left: 00%; top: 26%; background-color: none; overflow: auto; } #TMBtnBg { position: absolute; width: 10%; height: 58%; left: 90%; top: 25%; background-color: none; } #TMTitleTxt { position: absolute; width: 60%; height: 15%; left: 20%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 4.0vmin; font-weight: bolder; text-align: center; } #TMBackBtn { position: absolute; width: 10%; height: 15%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } #TMListBtn { position: absolute; width: 10%; height: 15%; left: 10%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/listbtn.png'); visibility: hidden; } #TMOKBtn { position: absolute; width: 10%; height: 15%; left: 90%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } #TMOptBtn { position: absolute; width: 10%; height: 15%; left: 79%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/settingsbtn.png'); } #TMTextInput { position: absolute; width: 69.5%; height: 90%; left: 01%; top: 05%; background-color: white; border: none; border-radius: 0.5em; outline: none; color: black; font-size: 2vmin; font-weight: bold; /*border-radius: 8px;*/ padding-left: 1%; } #TMStartAudioBtn { position: absolute; width: 16%; height: 92%; left: 72.5%; top: 05%; background-color: white; border-radius:0.5em; border: none; outline: none; } .TMStartAudioBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMStartAudioBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn0.png'); } .TMStartAudioBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn1.png'); } .TMStartAudioBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn2.png'); } .TMStartAudioBtnImg3 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn3.png'); } .TMStartAudioBtnImg4 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn4.png'); } .TMStartAudioBtnImg5 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn5.png'); } #TMStartSyntBtn { position: absolute; width: 16%; height: 92%; left: 72.5%; top: 05%; background-color: white; border-radius:0.5em; border: none; outline: none; } .TMStartSyntBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} #TMButtons { position: absolute; width: 98%; height: 90%; left: 1%; top: 5%; background-color: none; border-radius:0.5em; } #TMUpBtn { position: absolute; width: 98%; height: 20.00%; left: 1%; top: 04.00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/upbtn.png'); } #TMDownBtn { position: absolute; width: 98%; height: 20.00%; left: 1%; top: 28.00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/downbtn.png'); } #TMAddBtn { position: absolute; width: 98%; height: 20.00%; left: 1%; top: 52.00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/addbtn.png'); } #TMDelBtn { position: absolute; width: 98%; height: 20.00%; left: 1%; top: 76.00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/delbtn.png'); } /*#endregion*/ /* TestView options */ /*#region*/ #TMOptBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; display: none; z-index: 500; } #TMOptHead { position: absolute; width: 100%; height: 15%; left: 00%; top: 00%; } #TMOptBody { position: absolute; width: 100%; height: 85%; left: 00%; top: 15%; background-color: #83c3ea; } .TMOptExitBtn { position: absolute; width: 10%; height: 100%; right: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } .TMOptTitleTxt { position: absolute; width: 60%; height: 100%; left: 20%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 4.0vmin; font-weight: bolder; text-align: center; } .TMOptBtn { position: relative; float: left; width: 28%; height: 15%; margin-left: 4%; margin-top: 3%; background-color:white; border-radius:5px; cursor:pointer; overflow: hidden; } .TMMultiCorrectBtn { } .TMMultiCorrectBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMMultiCorrectBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/multibtn0.png'); } .TMMultiCorrectBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/multibtn1.png'); } /*.TMRespBtn { top: 05%; left: 21%; } .TMRespBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMRespBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/respbtn0.png'); } .TMRespBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/respbtn1.png'); }*/ .TMChangeBtn { } .TMChangeBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMChangeBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/changebtn0.png'); } .TMChangeBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/changebtn1.png'); } .TMRndPosBtn { } .TMRndPosBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMRndPosBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/changebtn0.png'); } .TMRndPosBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/changebtn1.png'); } .TMSoundBtn { } .TMSoundBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMSoundBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn0.png'); } .TMSoundBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn1.png'); } .TMSoundBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn2.png'); } .TMSoundBtnImg3 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn3.png'); } .TMSoundBtnImg4 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn4.png'); } .TMSoundBtnImg5 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/soundbtn5.png'); } .TMShowImgBtn { } .TMShowImgBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMShowImgBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/imagebtn0.png'); } .TMShowImgBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/imagebtn1.png'); } .TMSizesBtn { } .TMSizesBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMSizesBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn0.png'); } .TMSizesBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn1.png'); } .TMSizesBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn2.png'); } .TMSizesBtnImg3 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn3.png'); } .TMSizesBtnImg4 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn4.png'); } .TMSizesBtnImg5 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn5.png'); } .TMSizesBtnImg6 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn6.png'); } .TMSizesBtnImg7 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn7.png'); } .TMSizesBtnImg8 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn8.png'); } .TMSizesBtnImg9 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn9.png'); } .TMSizesBtnImg10 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn10.png'); } .TMSizesBtnImg11 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn11.png'); } .TMSizesBtnImg12 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn12.png'); } .TMSizesBtnImg13 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn13.png'); } .TMSizesBtnImg14 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn14.png'); } .TMSizesBtnImg15 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn15.png'); } .TMSizesBtnImg16 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn16.png'); } .TMSizesBtnImg17 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn17.png'); } .TMSizesBtnImg18 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn18.png'); } .TMSizesBtnImg19 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/sizes/sizebtn19.png'); } .TMColorsBtn { } .TMColorsBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMColorsBtnImg { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; } .TMColorsTxtBtnImg0 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn0.png'); } .TMColorsTxtBtnImg1 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn1.png'); } .TMColorsTxtBtnImg2 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn2.png'); } .TMColorsTxtBtnImg3 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn3.png'); } .TMColorsTxtBtnImg4 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn4.png'); } .TMColorsTxtBtnImg5 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn5.png'); } .TMColorsTxtBtnImg6 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn6.png'); } .TMColorsTxtBtnImg7 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn7.png'); } .TMColorsTxtBtnImg8 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn8.png'); } .TMColorsTxtBtnImg9 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn9.png'); } .TMColorsTxtBtnImg10 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn10.png'); } .TMColorsTxtBtnImg11 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn11.png'); } .TMColorsTxtBtnImg12 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn12.png'); } .TMColorsTxtBtnImg13 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn13.png'); } .TMColorsTxtBtnImg14 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn14.png'); } .TMColorsTxtBtnImg15 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn15.png'); } .TMColorsTxtBtnImg16 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn16.png'); } .TMColorsTxtBtnImg17 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn17.png'); } .TMColorsTxtBtnImg18 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn18.png'); } .TMColorsTxtBtnImg19 { background-image: url('../images/editor/buttons/multitest/colors/txtcolorbtn19.png'); } .TMColorsImgBtnImg0 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn0.png'); } .TMColorsImgBtnImg1 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn1.png'); } .TMColorsImgBtnImg2 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn2.png'); } .TMColorsImgBtnImg3 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn3.png'); } .TMColorsImgBtnImg4 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn4.png'); } .TMColorsImgBtnImg5 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn5.png'); } .TMColorsImgBtnImg6 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn6.png'); } .TMColorsImgBtnImg7 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn7.png'); } .TMColorsImgBtnImg8 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn8.png'); } .TMColorsImgBtnImg9 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn9.png'); } .TMColorsImgBtnImg10 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn10.png'); } .TMColorsImgBtnImg11 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn11.png'); } .TMColorsImgBtnImg12 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn12.png'); } .TMColorsImgBtnImg13 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn13.png'); } .TMColorsImgBtnImg14 { background-image: url('../images/editor/buttons/multitest/colors/imgcolorbtn14.png'); } .TMResBgImgBtn { } .TMResBgImgBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMResBgImgBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/speechbtn0.png'); } .TMResBgImgBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/speechbtn1.png'); } .TMTextAlignBtn { } .TMTextAlignBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMTextAlignBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/alignbtn0.png'); } .TMTextAlignBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/alignbtn1.png'); } .TMTextAlignBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/alignbtn2.png'); } .TMSpeakAnsBtn { } .TMSpeakAnsBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMSpeakAnsBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/speechbtn0.png'); } .TMSpeakAnsBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/speechbtn1.png'); } .TMSpeakAnsBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/speechbtn1.png'); } .TMPageDelayBtn { } .TMPageDelayBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMPageDelayBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/imagebuttons/nextbtn1.png'); } .TMPageDelayBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/imagebuttons/nextbtn1.png'); } .TMPageDelayBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/imagebuttons/nextbtn1.png'); } .TMPageDelayBtnImg3 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/imagebuttons/nextbtn1.png'); } .TMPageDelayBtnImg4 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/imagebuttons/nextbtn1.png'); } .TMApplyAllBtn { position: absolute; bottom: 4%; right: 4%; background-color: #4f5d73; } .TMApplyAllBtnTxt { position: absolute; width: 70%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: white; font-size: 2vmin; font-weight: bold;} .TMApplyAllBtnImg0 { position: absolute; width: 30%; height: 100%; left: 70%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/okbtn.png'); } /*#endregion*/ /*Layout popup window */ /*#region*/ .TMLayoutBg { position: absolute; height: 100%; width: 100%; top: 0%; left: 0%; background-color: rgba(100, 100, 100, 0.8); z-index: 2000; } .TMLayoutWin { position: absolute; height: 60%; width: 80%; top: 10%; left: 10%; background-color: white; border: 0.25em solid gainsboro; border-radius: 0.5em; overflow-y: auto; } .TMLayoutWinGrey { background-color: gainsboro; } .TMLayoutWinWhite { background-color: white; } .TMLayoutItem { position: relative; float: left; width: 18%; height: 30%; margin: 1%; background-repeat:no-repeat; background-size: contain; background-position: center; cursor: pointer; } .TMLayoutSel { background-color: #595959; } /*#endregion*/ /*List start */ /*#region*/ .TMItem0 { position:relative; float:left; width:98%; height:15%; background-color:none; margin-top:1%; margin-left:1%; } .TMItem1 { position:relative; float:left; width:98%; height:15%; background-color:#4f5d73; margin-top:1%; margin-left:1%; } .TMItemTxt0 { position: absolute; width: 40%; height: 76%; left: 01%; top: 10%; background-color: white; border: none; border-radius: 0.5em; outline: none; color: black; font-size: 2vmin; font-weight: bold; padding-left: 1%; } .TMItemTxt1 { position: absolute; width: 21%; height: 76%; left: 01%; top: 10%; background-color: white; border: none; border-radius: 0.5em; outline: none; color: black; font-size: 2vmin; font-weight: bold; padding-left: 1%; } .TMAnsBtn { position: absolute; width: 18%; height: 80%; left: 43%; top: 10%; background-color: white; border-radius:0.5em; } .TMAnsBtnTxt0 { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: #c65859; font-size: 2vmin; font-weight: bold;} .TMAnsBtnTxt1 { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: #78cb7b; font-size: 2vmin; font-weight: bold;} .TMImgABtn { position: absolute; width: 18%; height: 80%; left: 24%; top: 10%; background-color: white; border-radius:0.5em; } .TMImgBBtn { position: absolute; width: 18%; height: 80%; left: 62%; top: 10%; background-color: white; border-radius:0.5em; } .TMImgBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMImgBtnImg { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/typebuttons/imagebtn1.png'); } .TMAudioBtn { position: absolute; width: 18%; height: 80%; left: 81%; top: 10%; background-color: white; border-radius:0.5em; } .TMAudioBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMAudioBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audiobtn0.png'); } .TMAudioBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audiobtn1.png'); } .TMSyntBtn { position: absolute; width: 18%; height: 80%; left: 81%; top: 10%; background-color: white; border-radius:0.5em; } .TMSyntBtnTxt { position: absolute; width: 60%; height: 100%; left: 00%; top: 00%; text-align:center; background-color:transparent; border: none; outline: none; color: black; font-size: 2vmin; font-weight: bold;} .TMSyntBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn0.png'); } .TMSyntBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn1.png'); } .TMSyntBtnImg2 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn2.png'); } .TMSyntBtnImg3 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn3.png'); } .TMSyntBtnImg4 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn4.png'); } .TMSyntBtnImg5 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn5.png'); } .TMSyntBtnImg6 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn6.png'); } .TMSyntBtnImg7 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/audio/audiobtn7.png'); } .TMAnsBtnImg0 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/correctbtn0.png'); } .TMAnsBtnImg1 { position: absolute; width: 40%; height: 100%; left: 60%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/multitest/correctbtn1.png'); } /*#endregion*/ /* TEST ITEM in Editor - TST Text */ /*#region*/ .TSTWinBg { position: absolute; width: 1%; height: 1%; left: 1%; top: 1%; overflow: hidden; visibility:hidden; margin: 0; padding: 0; } .TSTTitleBg { position: relative; width: 90%; height: 25%; left: 05%; top: 0%; background-color: none; overflow: hidden; } .TSTTitleTxt { position: absolute; width: 100%; height: 80%; left: 00%; top: 10%; background-color:transparent; border: none; font-family: 'LocalMulish'; font-size: calc(0.8vw + 0.8vh + 0.8vmin); padding: 0%; margin: 0%; font-weight: bold; text-align: left; overflow: hidden; } .TSTTitleTTSBtn { position: absolute; width: 20%; height: 90%; right: 1.9%; top: 5%; background-color:transparent; border: none; } .TSTListBgTitle { position: relative; width: 90%; left: 05%; top: 0%; background-color: none; overflow: hidden; } .TSTListBgNoTitle { position: relative; width: 90%; left: 05%; top: 0%; background-color: none; overflow: hidden; } .TSTItemTxt { font-family: 'LocalMulish'; } .TSTContactsBg { position: absolute; width: 10%; height: 10%; right: 0%; top: 1%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/contactsbuttons/indexbtn0.png'); } .TSTItemResBgImg0 { background-image: url('../images/editor/buttons/multitest/wrongicon.png'); background-position: right top; } .TSTItemResBgImg1 { background-image: url('../images/editor/buttons/multitest/correcticon.png'); background-position: right top; } /*#endregion*/ /* TEXT COLOR SKINS. Default, Correct, Wrong */ /*#region*/ .TST0ItemC { background-color: #4f9435; } .TST0ItemW { background-color: #c34341; } /* TXT A */ .TST0WinBg0 { background-color: rgba(255, 255, 255, 1.0); border-radius: 8px; } .TST0TitleTxt0 { color: black; } .TST0ItemTxt0 { color: white; } .TST0ItemD0 { background-color: rgba(67, 79, 95, 1); } .TST0WinBg1 { background-color: rgba(255, 255, 255, 1.0); border-radius: 8px; } .TST0TitleTxt1 { color: black; } .TST0ItemTxt1 { color: white; } .TST0ItemD1 { background-color: rgba(69, 119, 178, 1); } .TST0WinBg2 { background-color: rgba(255, 255, 255, 1.0); border-radius: 8px; } .TST0TitleTxt2 { color: black; } .TST0ItemTxt2 { color: white; } .TST0ItemD2 { background-color: rgba(45, 84, 44, 1); } .TST0WinBg3 { background-color: rgba(255, 255, 255, 1.0); border-radius: 8px; } .TST0TitleTxt3 { color: black; } .TST0ItemTxt3 { color: white; } .TST0ItemD3 { background-color: rgba(0, 0, 0, 1); } .TST0WinBg4 { background-color: rgba(255, 255, 255, 1.0); border-radius: 8px; } .TST0TitleTxt4 { color: black; } .TST0ItemTxt4 { color: white; } .TST0ItemD4 { background-color: rgba(104, 100, 99, 1); } /* TXT B */ .TST0WinBg5 { background-color: white; border-radius: 8px; } .TST0TitleTxt5 { color: black; } .TST0ItemTxt5 { color: black; } .TST0ItemD5 { background-color: rgba(131, 195, 234, 1); } .TST0WinBg6 { background-color: white; border-radius: 8px; } .TST0TitleTxt6 { color: black; } .TST0ItemTxt6 { color: black; } .TST0ItemD6 { background-color: rgba(69, 119, 178, 1); } .TST0WinBg7 { background-color: white; border-radius: 8px; } .TST0TitleTxt7 { color: black; } .TST0ItemTxt7 { color: black; } .TST0ItemD7 { background-color: rgba(79, 149, 53, 1); } .TST0WinBg8 { background-color: white; border-radius: 8px; } .TST0TitleTxt8 { color: black; } .TST0ItemTxt8 { color: black; } .TST0ItemD8 { background-color: rgba(148, 172, 114, 1); } .TST0WinBg9 { background-color: white; border-radius: 8px; } .TST0TitleTxt9 { color: black; } .TST0ItemTxt9 { color: black; } .TST0ItemD9 { background-color: rgba(255, 255, 255, 1); } /* TXT C */ .TST0WinBg10 { background-color: none; } .TST0TitleTxt10 { color: #282828; } .TST0ItemTxt10 { color: white; } .TST0ItemD10 { background-color: rgba(67, 79, 95, 1); } .TST0WinBg11 { background-color: none; } .TST0TitleTxt11 { color: #282828; } .TST0ItemTxt11 { color: white; } .TST0ItemD11 { background-color: rgba(69, 119, 178, 1); } .TST0WinBg12 { background-color: none; } .TST0TitleTxt12 { color: white; } .TST0ItemTxt12 { color: white; } .TST0ItemD12 { background-color: rgba(45, 84, 44, 1); } .TST0WinBg13 { background-color: none; } .TST0TitleTxt13 { color: #282828; } .TST0ItemTxt13 { color: white; } .TST0ItemD13 { background-color: rgba(0, 0, 0, 1); } .TST0WinBg14 { background-color: none; } .TST0TitleTxt14 { color: #282828; } .TST0ItemTxt14 { color: white; } .TST0ItemD14 { background-color: rgba(104, 100, 99, 1); } /* TXT D*/ .TST0WinBg15 { background-color: none; } .TST0TitleTxt15 { color: white; } .TST0ItemTxt15 { color: black; } .TST0ItemD15 { background-color: rgba(131, 195, 234, 1); } .TST0WinBg16 { background-color: none; } .TST0TitleTxt16 { color: white; } .TST0ItemTxt16 { color: black; } .TST0ItemD16 { background-color: rgba(69, 119, 178, 1); } .TST0WinBg17 { background-color: none; } .TST0TitleTxt17 { color: white; } .TST0ItemTxt17 { color: black; } .TST0ItemD17 { background-color: rgba(79, 149, 53, 1); } .TST0WinBg18 { background-color: none; } .TST0TitleTxt18 { color: white; } .TST0ItemTxt18 { color: black; } .TST0ItemD18 { background-color: rgba(148, 172, 114, 1); } .TST0WinBg19 { background-color: none; } .TST0TitleTxt19 { color: white; } .TST0ItemTxt19 { color: black; } .TST0ItemD19 { background-color: rgba(255, 255, 255, 1); } /*#endregion*/ /* IMAGES A - COLORED BG + WHITE TITLE + WHITE ITEMS */ /*#region*/ .TST1ItemC { /*background-color: #548235; border: 8px solid #548235; border-radius: 8px; */ } .TST1ItemW { /*background-color: #c75c5c; border: 8px solid #c75c5c; border-radius: 8px; */ } /* IMG A */ .TST1WinBg0 { background-color: white; } .TST1TitleTxt0 { color: black; } .TST1ItemD0 { background-color: rgba(131, 195, 234, 1); } .TST1WinBg1 { background-color: white; } .TST1TitleTxt1 { color: black; } .TST1ItemD1 { background-color: rgba(69, 119, 178, 1); } .TST1WinBg2 { background-color: white; } .TST1TitleTxt2 { color: black; } .TST1ItemD2 { background-color: rgba(79, 149, 53, 1); } .TST1WinBg3 { background-color: white; } .TST1TitleTxt3 { color: black; } .TST1ItemD3 { background-color: rgba(148, 172, 114, 1); } .TST1WinBg4 { background-color: white; } .TST1TitleTxt4 { color: black; } .TST1ItemD4 { background-color: rgba(246, 210, 74, 1); } /* IMG B */ .TST1WinBg5 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt5 { color: black; } .TST1ItemD5 { background-color: rgba(131, 195, 234, 1); } .TST1WinBg6 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt6 { color: black; } .TST1ItemD6 { background-color: rgba(69, 119, 178, 1); } .TST1WinBg7 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt7 { color: black; } .TST1ItemD7 { background-color: rgba(79, 149, 53, 1); } .TST1WinBg8 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt8 { color: black; } .TST1ItemD8 { background-color: rgba(148, 172, 114, 1); } .TST1WinBg9 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt9 { color: black; } .TST1ItemD9 { background-color: rgba(246, 210, 74, 1); } /* IMG C */ .TST1WinBg10 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt10 { color: black; } .TST1ItemD10 { background-color: white; } .TST1WinBg11 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt11 { color: rgba(67, 79, 95, 1); } .TST1ItemD11 { background-color: white; } .TST1WinBg12 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt12 { color: white; } .TST1ItemD12 { background-color: white; } .TST1WinBg13 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt13 { color: rgba(107, 104, 106, 1); } .TST1ItemD13 { background-color: white; } .TST1WinBg14 { background-color: transparent; border-radius: 8px; } .TST1TitleTxt14 { color: rgba(31, 51, 31, 1); } .TST1ItemD14 { background-color: white; } /*#endregion*/ .TST1ItemImgD { position: absolute; height: 100%; width: 100%; top: 0%; left: 0%; border: 6px solid rgba(0, 0, 0, 0); background-clip: padding-box; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background-repeat: no-repeat; background-position: center; background-size: contain; } .TST1ItemImg1 { position: absolute; height: 100%; width: 100%; top: 0%; left: 0%; border: 6px solid rgba(84, 130, 53, 1); background-clip: padding-box; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background-repeat: no-repeat; background-position: center; background-size: contain; } .TST1ItemImg0 { position: absolute; height: 100%; width: 100%; top: 0%; left: 0%; border: 6px solid rgba(199, 92, 92, 1); background-clip: padding-box; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; background-repeat: no-repeat; background-position: center; background-size: contain; } .TST1ItemImg:active { filter: brightness(120%); } .TST1ItemRes0 { position: absolute; height: 40%; width: 20%; top: 6px; right: 6px; background-position: right top; background-image: url('../images/editor/buttons/multitest/wrongicon2.png'); } .TST1ItemRes1 { position: absolute; height: 40%; width: 20%; top: 6px; right: 6px; background-position: right top; background-image: url('../images/editor/buttons/multitest/correcticon2.png');} /* TEST sizes for column 1-10. With and without small image */ /*#region*/ .TSTResetImg { position: absolute; width: 23%; height: 23%; right: 0%; top: 0%; border: none; outline: none; background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: right; background-image: url('../images/editor/buttons/multitest/resetbtn.png'); } .TSTLockImg { position: absolute; width: 23%; height: 23%; right: 0%; top: 0%; border: none; outline: none; background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: right; background-image: url('../images/editor/buttons/multitest/lockbtn.png'); } .TSTLargeImg { position: absolute; width: 100%; height: 100%; left: 0%; top: 0%; background-repeat:no-repeat; background-size: contain; background-position: center; background-color: white; background-image: url(''); visibility: hidden; } .TSTItemRowImg0Cols1 { position: relative; float:left; width: 100%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols1 { position: relative; float:left; width: 80%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols1 { position: relative; float:left; width: 17%; margin-right: 1%; } .TSTItemRowImg0Cols2 { position: relative; float:left; width: 46%; margin: 0 2% 0 2%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols2 { position: relative; float:left; width: 39%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols2 { position: relative; float:left; width: 8%; margin-right: 0.25%; } .TSTItemRowImg0Cols3 { position: relative; float:left; width: 30.3%; margin: 0 1.5% 0 1.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols3 { position: relative; float:left; width: 24%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols3 { position: relative; float:left; width: 7%; margin-right: 1.25%; } .TSTItemRowImg0Cols4 { position: relative; float:left; width: 23.5%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols4 { position: relative; float:left; width: 16%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols4 { position: relative; float:left; width: 7.5%; margin-right: 0.5%; } .TSTItemRowImg0Cols5 { position: relative; float:left; width: 19%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols5 { position: relative; float:left; width: 12%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols5 { position: relative; float:left; width: 6.5%; margin-right: 0.5%; } .TSTItemRowImg0Cols6 { position: relative; float:left; width: 15.6%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols6 { position: relative; float:left; width: 8.3%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols6 { position: relative; float:left; width: 6.5%; margin-right: 0.5%; background-position-y: center; } .TSTItemRowImg0Cols7 { position: relative; float:left; width: 13.2%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols7 { position: relative; float:left; width: 7.4%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols7 { position: relative; float:left; width: 5%; margin-right: 0.5%; background-position-y: center; } .TSTItemRowImg0Cols8 { position: relative; float:left; width: 11.5%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols8 { position: relative; float:left; width: 5.6%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols8 { position: relative; float:left; width: 5%; margin-right: 0.5%; background-position-y: center; } .TSTItemRowImg0Cols9 { position: relative; float:left; width: 10.1%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols9 { position: relative; float:left; width: 5.2%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols9 { position: relative; float:left; width: 4%; margin-right: 0.5%; background-position-y: center; } .TSTItemRowImg0Cols10 { position: relative; float:left; width: 9%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } .TSTItemRowImg1Cols10 { position: relative; float:left; width: 4.7%; margin: 0 0.5% 0 0.5%; border-radius: 8px; background-position: right; background-repeat:no-repeat; } /* Room for image */ .TSTItemImgCols10 { position: relative; float:left; width: 3.5%; margin-right: 0.5%; background-position-y: center; } .TSTItemRowImg0Txt { position: absolute; height: 100%; width: 100%; background-color:transparent; border: none; outline:none; font-size: 3vmin; font-weight: bold; text-align: left; } .TSTItemRowImg1Txt { position: absolute; height: 100%; width: 80%; background-color:transparent; border: none; outline:none; font-size: 3vmin; font-weight: bold; text-align: left; } /*#endregion*/ /* Quick Pick Image View - QPickImgView */ /*#region*/ #QPickImgBg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 101; overflow: hidden; } .QPickImgWin { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #f8f8f8; overflow: hidden; } .QPickImgHead { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } .QPickImgExitBtn { position: absolute; width: 10%; height: 100%; left: 00%; top: 00%; background-image: url('../images/editor/buttons/qpickimg/closebtn.png'); background-position-x: left; } .QPickImgTypeBtn { position: absolute; width: 08%; height: 100%; right: 01%; top: 00%; background-image: url(''); background-position-x: right; } .QPickImgContactsBtn { position: absolute; width: 08%; height: 100%; right: 11%; top: 00%; background-image: url('../images/editor/contactsbuttons/contactbtn0.png'); background-position-x: right; } .QPickImgTitleTxt { position: absolute; width: 80%; height: 90%; left: 10%; top: 00%; color: white; font-size: 4.0vmin; font-weight: bolder; text-align: center; overflow: hidden; } .QPickImgSaveBtn { position: absolute; width: 24%; height: 80%; right: 01%; top: 10%; border-radius: 8px; background-color: #65af67; } .QPickImgSaveBtnTxt { position: absolute; width: 78%; height: 90%; left: 01%; top: 05%; font-size: 2.5vmin; font-weight: bold; text-align: left; color: white; overflow: hidden; } .QPickImgSaveBtnImg { position: absolute; width: 18%; height: 98%; right: 01%; top: 01%; background-image: url('../images/editor/buttons/qpickimg/savebtn.png'); } .QPickImgSaveBtn:hover{ background-color: #77c77a; } .QPickListC { position: absolute; width: 48%; height: 80%; left: 01%; top: 10%; } .QPickItemsTitle { position: absolute; width: 100%; height: 10%; left: 0; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QPickItemsList { position: absolute; width: 100%; height: 80%; left: 0; top: 10%; background-color: white; border-radius: 6px; overflow-y: auto; overflow-x: hidden; border: none; } .QPickImgNewBtn { position: absolute; width: 80%; height: 20%; left: 10%; top: 40%; color: #595959; font-size: 3.0vmin; font-weight: bolder; cursor: pointer; } .QPickListBtnC { position: absolute; width: 100%; height: 10%; left: 0; top: 90%; } .QPickItemsTxtInput { position: absolute; width: 50%; height: 40%; left: 00%; top: 20%; font-size: 3.0vmin; font-weight: bolder; text-align: left; padding: 1%; resize: none; border: none; border-radius: 6px; } .QPickItemsTxtOKBtn { position: absolute; width: 10%; height: 60%; left: 55%; top: 20%; background-image: url('../images/editor/buttons/qpickimg/savebtn.png'); border-radius: 8px; background-color: #65af67; cursor: pointer; } .QPickImgAddBtn { position: absolute; width: 10%; height: 08%; right: 01%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/qpickimg/insertbtn.png'); cursor: pointer; } .QPickImgDelBtn { position: absolute; width: 10%; height: 08%; right: 12%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/qpickimg/removebtn.png'); cursor: pointer; } .QPickSkinC { position: absolute; width: 22%; height: 30%; left: 50%; top: 10%; cursor: pointer; } .QPickSkinTitle { position: absolute; width: 100%; height: 25%; left: 0; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QPickSkinBtn { position: absolute; width: 90%; height: 60%; left: 0; top: 26.5%; background-image: url('../images/editor/buttons/addbtn.png'); background-color: white; border-radius: 6px; } .QPickSkinDlgC { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-color: #f8f8f8; } .QPickSkinDlgTitle { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; padding: 0; font-size: 3.0vmin; font-weight: bolder; color: white; background-color: #4f5d73; overflow: hidden; } .QPickSkinDlgList { position: absolute; width: 100%; height: 90%; left: 00%; top: 10%; overflow-y: auto; overflow-x: hidden; } .QPickDlgItem { position: relative; float:left; height: 25%; width: 23%; background-color: transparent; margin-top: 2vh; margin-left: 1vw; } .QPickDlgItemImg { position: absolute; height: 78%; width: 98%; left: 01%; top: 01%; } .QPickDlgItemTxt { position: absolute; height: 20%; width: 98%; left: 01%; top: 80%; color: #595959; font-size: 2.0vmin; font-weight: bolder; } .QPickNumberC { position: absolute; width: 26%; height: 30%; left: 72%; top: 10%; } .QPickNumberTitle { position: absolute; width: 100%; height: 25%; left: 00%; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QPickNumberBtn { position: absolute; width: 22%; height: 20%; top: 26.5%; padding: 0; font-size: 4.5vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QPickNumber2Btn { left: 00%; } .QPickNumber3Btn { left: 25%; } .QPickNumber4Btn { left: 50%; } .QPickNumber6Btn { left: 75%; } .QPickNumberBtn1 { color: white; background-color: #83c3ea; } .QPickTextC { position: absolute; width: 50%; height: 20%; left: 50%; top: 40%; } .QPickTextTitle { position: absolute; width: 100%; height: 20%; left: 00%; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QPickTextInput { position: absolute; width: 300px; height: 75%; left: 00%; top: 22%; wrap:soft; font-size: 18px; font-weight: bolder; text-align: left; padding: 1%; resize: none; border: none; border-radius: 6px; } .QPickRewardC { position: absolute; width: 50%; height: 30%; left: 50%; top: 65%; } .QPickRewardTitle { position: absolute; width: 100%; height: 25%; left: 00%; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QPickRewardBtn { position: absolute; width: 13%; height: 20%; top: 26.5%; padding: 0; margin: 0; font-size: 4.5vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QPickReward0Btn { left: 00%; } .QPickReward1Btn { left: 15%; } .QPickReward2Btn { left: 30%; } .QPickReward3Btn { left: 45%; } .QPickReward4Btn { left: 60%; } .QPickRewardBtnOn { color: white; background-color: #83c3ea; } .QPickItem0 { position: relative; float:left; width: 19%; height: 20%; background-color: #f7f7f7; margin-top: 1%; margin-left: 0.5%; margin-right: 0.5%; border-radius: 6px; overflow: hidden; } .QPickItem1 { position: relative; float:left; width: 19%; height: 20%; background-color: #f5cf87; margin-top: 1%; margin-left: 0.5%; margin-right: 0.5%; border-radius: 6px; overflow: hidden; } .QPickItemImg { position: absolute; width: 100%; height: 75%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/archivebtn.png'); } .QPickItemTxt { position: absolute; width: 100%; height: 25%; left: 00%; top: 75%; text-align: center; font-size: 2vmin; font-weight: bold; } .QPickImgFoot { position: absolute; width: 100%; height: 10%; left: 00%; top: 90%; background-color: #4f5d73; overflow: hidden; } /*#endregion*/ /* Quick Build View - QBuildView */ /*#region*/ .QBuildShowTextC { position: absolute; width: 25%; height: 15%; top: 60%; left: 50%; } .QBuildShowTextTitle { position: absolute; width: 100%; height: 40%; top: 00%; left: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QBuildShowTextBtn0 { position: absolute; width: 25%; height: 45%; top: 42%; left: 00%; padding: 0; margin: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QBuildShowTextBtn1 { position: absolute; width: 25%; height: 45%; top: 42%; left: 32%; padding: 0; margin: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QBuildShowTextBtnOn { color: white; background-color: #83c3ea; } .QBuildCapitalC { position: absolute; width: 25%; height: 15%; top: 60%; left: 75%; } .QBuildCapitalTitle { position: absolute; width: 100%; height: 40%; top: 00%; left: 0; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QBuildCapitalBtn0 { position: absolute; width: 25%; height: 45%; top: 42%; left: 0; padding: 0; margin: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QBuildCapitalBtn1 { position: absolute; width: 25%; height: 45%; top: 42%; left: 32%; padding: 0; margin: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QBuildCapitalBtnOn { color: white; background-color: #83c3ea; } .QBuildRewardC { position: absolute; width: 50%; height: 15%; top: 75%; left: 50%; } .QBuildRewardTitle { position: absolute; width: 100%; height: 40%; top: 0; left: 0; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QBuildRewardBtn { position: absolute; width: 13%; height: 45%; top: 42%; padding: 0; margin: 0; border: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QBuildRewardBtnOn { color: white; background-color: #83c3ea; } /*#endregion*/ /* Quick Sort view - QSort */ /*#region*/ #QSortImgBg { position: absolute; width: 100%; height: 100%; top: 00%; left: 00%; margin: 0%; background-color:rgba(255,255,255,0.75); z-index: 101; } .QSortImgWin { position: absolute; width: 100%; height: 100%; top: 00%; left: 00%; left: 00%; top: 00%; background-color: #f8f8f8; overflow: hidden; } .QSortImgHead { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } .QSortImgExitBtn { position: absolute; width: 10%; height: 100%; left: 00%; top: 00%; background-image: url('../images/editor/buttons/qpickimg/closebtn.png'); background-position-x: left; } .QSortTypeBtn { position: absolute; width: 08%; height: 100%; right: 01%; top: 00%; background-image: url('../images/editor/projects/type4.png'); background-position-x: right; } .QSortImgTitleTxt { position: absolute; width: 80%; height: 90%; left: 10%; top: 00%; color: white; font-size: 4.0vmin; font-weight: bolder; text-align: center; overflow: hidden; } .QSortImgSaveBtn { position: absolute; width: 24%; height: 80%; right: 01%; top: 10%; border-radius: 8px; background-color: #65af67; } .QSortImgSaveBtnTxt { position: absolute; width: 78%; height: 90%; left: 01%; top: 05%; font-size: 2.5vmin; font-weight: bold; text-align: left; color: white; overflow: hidden; } .QSortImgSaveBtnImg { position: absolute; width: 18%; height: 98%; right: 01%; top: 01%; background-image: url('../images/editor/buttons/qpickimg/savebtn.png'); } .QSortImgSaveBtn:hover{ background-color: #77c77a; } .QSortListC0 { position: absolute; width: 32%; height: 39%; left: 01%; top: 10%; } .QSortListC1 { position: absolute; width: 32%; height: 39%; left: 34%; top: 10%; } .QSortListC2 { position: absolute; width: 32%; height: 39%; left: 01%; top: 50%; } .QSortListC3 { position: absolute; width: 32%; height: 39%; left: 34%; top: 50%; } .QSortItemsTitle { position: absolute; width: 55%; height: 28%; left: 20%; top: 02%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; overflow: hidden; } .QSortItemsList { position: absolute; width: 100%; height: 70%; left: 0; top: 30%; background-color: white; border-radius: 6px; overflow-y: auto; overflow-x: hidden; border: none; } .QSortImgNewBtn { position: absolute; width: 100%; height: 70%; left: 0%; top: 30%; color: #595959; font-size: 2.0vmin; font-weight: normal; padding: 1%; cursor: pointer; text-align: center; } .QSortListBtnC { position: absolute; width: 100%; height: 10%; left: 0; top: 90%; } .QSortItemsTxtInput { position: absolute; width: 50%; height: 40%; left: 00%; top: 20%; font-size: 3.0vmin; font-weight: bolder; text-align: left; padding: 1%; resize: none; border: none; border-radius: 6px; } .QSortItemsTxtOKBtn { position: absolute; width: 10%; height: 60%; left: 55%; top: 20%; background-image: url('../images/editor/buttons/qpickimg/savebtn.png'); border-radius: 8px; background-color: #65af67; cursor: pointer; } .QSortImgBoxBtn0 { position: absolute; width: 15%; height: 27%; left: 1%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/sortbuttons/sortboxbtn0.png'); cursor: pointer; } .QSortImgBoxBtn1 { position: absolute; width: 15%; height: 27%; left: 1%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/sortbuttons/sortboxbtn1.png'); cursor: pointer; } .QSortImgBoxBtn2 { position: absolute; width: 15%; height: 27%; left: 1%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/sortbuttons/sortboxbtn2.png'); cursor: pointer; } .QSortImgBoxBtn3 { position: absolute; width: 15%; height: 27%; left: 1%; top: 01%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/sortbuttons/sortboxbtn3.png'); cursor: pointer; } .QSortImgDelBtn { position: absolute; width: 10%; height: 28%; right: 13%; top: 1%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/qpickimg/removebtn.png'); cursor: pointer; } .QSortImgAddBtn { position: absolute; width: 10%; height: 28%; right: 01%; top: 1%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/qpickimg/insertbtn.png'); cursor: pointer; } .QSortSkinC { position: absolute; width: 30%; height: 23%; right: 01%; top: 10%; cursor: pointer; } .QSortSkinTitle { position: absolute; width: 100%; height: 40%; left: 0; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QSortSkinBtn { position: absolute; width: 70%; height: 60%; left: 0; top: 40%; background-image: url('../images/editor/buttons/addbtn.png'); background-color: white; border-radius: 6px; } .QSortSkinDlgC { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-color: #f8f8f8; } .QSortSkinDlgTitle { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; padding: 0; font-size: 3.0vmin; font-weight: bolder; color: white; background-color: #4f5d73; overflow: hidden; } .QSortSkinDlgList { position: absolute; width: 100%; height: 90%; left: 00%; top: 10%; overflow-y: auto; overflow-x: hidden; } .QSortDlgItem { position: relative; float:left; height: 25%; width: 23%; background-color: transparent; margin-top: 2vh; margin-left: 1vw; } .QSortDlgItemImg { position: absolute; height: 78%; width: 98%; left: 01%; top: 01%; } .QSortDlgItemTxt { position: absolute; height: 20%; width: 98%; left: 01%; top: 80%; color: #595959; font-size: 2.0vmin; font-weight: bolder; } .QSortSpeechC { position: absolute; width: 30%; height: 15%; right: 01%; top: 36%; } .QSortSpeechTitle { position: absolute; width: 100%; height: 40%; top: 00%; left: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QSortSpeechBtn1 { position: absolute; width: 30%; height: 45%; top: 42%; left: 00%; padding: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QSortSpeechBtn0 { position: absolute; width: 30%; height: 45%; top: 42%; left: 32%; padding: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QSortNumberBtnOn { color: white; background-color: #83c3ea; } .QSortTextC { position: absolute; width: 30%; height: 15%; right: 01%; top: 54%; } .QSortTextTitle { position: absolute; width: 100%; height: 40%; left: 00%; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QSortTextInput { position: absolute; width: 300px; height: 55%; left: 00%; top: 40%; wrap:soft; font-size: 2.25vmin; font-weight: bolder; text-align: left; padding: 1%; resize: none; border: none; border-radius: 6px; } .QSortRewardC { position: absolute; width: 30%; height: 15%; right: 01%; top: 72%; } .QSortRewardTitle { position: absolute; width: 100%; height: 40%; left: 00%; top: 00%; padding: 0; color: #595959; font-size: 3.0vmin; font-weight: bolder; text-align: left; } .QSortRewardBtn { position: absolute; width: 18%; height: 45%; top: 40%; padding: 0; margin: 0; font-size: 4.0vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QSortReward0Btn { left: 00%; } .QSortReward1Btn { left: 20%; } .QSortReward2Btn { left: 40%; } .QSortReward3Btn { left: 60%; } .QSortReward4Btn { left: 80%; } .QSortRewardBtnOn { color: white; background-color: #83c3ea; } .QSortItem0 { position: relative; float:left; width: 24%; height: 30%; background-color: #f7f7f7; margin-top: 1.5%; margin-left: 0.5%; margin-right: 0.5%; border-radius: 6px; overflow: hidden; } .QSortItem1 { position: relative; float:left; width: 24%; height: 30%; background-color: #f5cf87; margin-top: 1.5%; margin-left: 0.5%; margin-right: 0.5%; border-radius: 6px; overflow: hidden; } .QSortItemImg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/archivebtn.png'); } .QSortItemTxt { position: absolute; width: 100%; height: 25%; left: 00%; top: 75%; text-align: center; font-size: 2vmin; font-weight: bold; } .QSortImgFoot { position: absolute; width: 100%; height: 10%; left: 00%; top: 90%; background-color: #4f5d73; overflow: hidden; } .QSortPageTitle { position: relative; float:left; width: 10%; height: 100%; top: 00%; margin-right: 1%; color: white; font-size: 3.0vmin; font-weight: bolder; text-align: center; } .QSortPageBtn { position: relative; float:left; width: 06%; height: 60%; top: 20%; margin-right: 1%; padding: 0; font-size: 4.5vmin; font-weight: bolder; text-align: center; background-color: white; border-radius: 0.2em; cursor: pointer; } .QSortPageBtnOn { color: white; background-color: #83c3ea; } /*#endregion*/ /* CTS - Contacts view */ /*#region*/ #CTSBg { position: absolute; width: 100%; height: 100%; top: 00%; left: 00%; left: 00%; top: 00%; background-color: #f8f8f8; overflow: hidden; z-index: 101; } .CTSHead { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } .CTSExitBtn { position: absolute; width: 10%; height: 100%; left: 00%; top: 00%; background-image: url('../images/editor/buttons/qpickimg/closebtn.png'); background-position-x: left; } .CTSTitle { position: absolute; width: 80%; height: 90%; left: 10%; top: 00%; color: white; font-size: 4.0vmin; font-weight: bolder; text-align: center; overflow: hidden; } .CTSBody { position: absolute; width: 100%; height: 80%; left: 00%; top: 10%; background-color: none; overflow: hidden; } .CTSLbl { position: absolute; height: 20%; width: 100%; top: 0%; left: 0%; text-align: left; font-size: 2.8vmin; font-weight: bold; color: #595959; } .CTSBtn0 { width: 35%; height: 50%; margin-right: 2%; font-size: 0.6vw; border-radius: 8px; color: black; background-color: white; cursor: pointer; } .CTSBtn1 { width: 35%; height: 50%; margin-right: 2%; font-size: 0.6vw; border-radius: 8px; color: white; background-color: #83c3ea; cursor: pointer; } .CTSNumC { position: absolute; height: 25%; width: 30%; top: 03%; left: 01%; } .CTSNumBtn { position: relative; top: 30%; font-size: 2.6vmin; font-weight: bold; } .CTSActivateC { position: absolute; height: 25%; width: 30%; top: 03%; left: 32%; } .CTSActivateBtn { position: relative; top: 30%; font-size: 2.2vmin; font-weight: bold; } .CTSMarkerC { position: absolute; height: 25%; width: 30%; top: 30%; left: 01%; } .CTSMarkerColBtn0 { position: absolute; height: 50%; width: 30%; top: 30%; left: 01%; border-radius: 8px; background-color: black; } .CTSMarkerColTxt { position: absolute; height: 20%; width: 30%; top: 80%; left: 01%; } .CTSMarkerTypeBtn { position: absolute; height: 50%; width: 30%; top: 30%; left: 34%; border-radius: 8px; background-color: white; } .CTSMarkerTypeBtn0 { background-image: url('../images/editor/contactsbuttons/typebtn0.png'); } .CTSMarkerTypeBtn1 { background-image: url('../images/editor/contactsbuttons/typebtn1.png'); } .CTSMarkerTypeBtn2 { background-image: url('../images/editor/contactsbuttons/typebtn2.png'); } .CTSMarkerTypeBtn3 { background-image: url('../images/editor/contactsbuttons/typebtn3.png'); } .CTSMarkerTypeTxt { position: absolute; height: 20%; width: 30%; top: 80%; left: 34%; } .CTSAudioC { position: absolute; height: 25%; width: 30%; top: 30%; left: 32%; } .CTSAudioBtn { position: relative; top: 30%; font-size: 2.2vmin; font-weight: bold; } .CTSGuardC { position: absolute; height: 25%; width: 36%; top: 03%; left: 63%; } .CTSGuardTxt { position: absolute; height: 35%; width: 70%; top: 30%; left: 00%; background-color: white; color: #595959; font-size: 2.2vmin; font-weight: bold; } .CTSGuardBtn { position: absolute; height: 35%; width: 30%; top: 30%; left: 70%; background-color: #4f5d73; color: white; font-size: 2.2vmin; font-weight: bold; } .CTSOneC { position: absolute; height: 32%; width: 61%; top: 57%; left: 01%; } .CTSStartTxt { position: absolute; height: 30%; width: 80%; top: 25%; left: 00%; background-color: white; text-align: left; color: #595959; font-size: 2.2vmin; font-weight: bold; } .CTSStartBtn { position: absolute; height: 30%; width: 20%; top: 25%; left: 80%; background-color: #4f5d73; color: white; font-size: 2.2vmin; font-weight: bold; } .CTSScanTxt { position: absolute; height: 30%; width: 80%; top: 63%; left: 00%; background-color: white; text-align: left; color: #595959; font-size: 2.2vmin; font-weight: bold; } .CTSScanBtn { position: absolute; height: 30%; width: 20%; top: 63%; left: 80%; background-color: #4f5d73; color: white; font-size: 2.2vmin; font-weight: bold; } .CTSFooter { position: absolute; width: 100%; height: 10%; left: 00%; bottom: 00%; background-color: #4f5d73; overflow: hidden; } .CTSSaveBtn { position: absolute; height: 80%; width: 20%; top: 10%; right: 01%; border-radius: 8px; background-color: #65af67; color: white; font-size: 2.8vmin; font-weight: bold; cursor: pointer; } .CTSSaveBtn:hover { background-color: #77c77a; } .CTSSaveAsBtn { position: absolute; height: 80%; width: 20%; top: 10%; right: 23%; border-radius: 8px; background-color: #65af67; color: white; font-size: 2.8vmin; font-weight: bold; cursor: pointer; } .CTSSaveAsBtn:hover { background-color: #77c77a; } .CTSLoadBtn { position: absolute; height: 80%; width: 20%; top: 10%; left: 01%; border-radius: 8px; background-color: #83c3ea; color: white; font-size: 2.8vmin; font-weight: bold; cursor: pointer; } .CTSLoadBtn:hover { background-color: #77c77a; } .CTSOptBody { background-color: #f8f8f8; } /*#endregion*/ /* Fix view */ /*#region*/ #FixBg { position: absolute; width: 100%; height: 100%; left: 00%; top: 00%; margin: 0; background-color:rgba(255,255,255,0.75); } .FixWin { position: absolute; width: 80%; height: 80%; left: 10%; top: 10%; background-color: grey; overflow: hidden; } .FixHead { position: absolute; width: 100%; height: 10%; left: 00%; top: 00%; background-color: #4f5d73; overflow: hidden; } .FixExitBtn { position: absolute; width: 10%; height: 10%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/backbtn0.png'); } .FixTitleTxt { position: absolute; width: 70%; height: 10%; left: 15%; top: 00%; color: white; background-color:transparent; border: none; outline: none; font-size: 2.0vmin; font-weight: bolder; text-align: center; } .FixCheckBtn { position: absolute; width: 5%; height: 10%; right: 10%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/allbtn.png'); } .FixCorrectBtn { position: absolute; width: 5%; height: 10%; right: 05%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/settingsbtn.png'); } .FixSaveBtn { position: absolute; width: 5%; height: 10%; right: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/savebtn0.png'); } .FixList { position: absolute; width: 98%; height: 87%; left: 01%; top: 11%; background-color: white; border-radius: 8px; overflow-y: auto; overflow-x: hidden; border: 1px solid white; } .FixItem { position: relative; float:left; width: 99%; height: 10%; background-color: white; border-radius: 8px; margin: 0.5%; } .FixItemOK { background-color: lightgreen; } .FixItemErr { background-color: lightcoral; } .FixItemImg { position: absolute; width: 5%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/imagebtn.png'); } .FixItemSnd { position: absolute; width: 5%; height: 100%; left: 00%; top: 00%; background-repeat:no-repeat; background-size: contain; background-position: center; background-image: url('../images/editor/buttons/audiobtn.png'); } .FixItemTxt { position: absolute; width: 95%; height: 100%; left: 05%; top: 00%; text-align: left; font-size: 0.9vw; outline: none; background: none; border: none; } /*#endregion*/ /* Video item */ #VideoBg { position: absolute; width: 1%; height: 1%; left: 1%; top: 1%; overflow: visible; visibility:hidden; margin: 0; padding: 0; } .VideoSel0 { border: 1px solid transparent; border-radius: 0; } .VideoSel1 { border: 1px solid black; border-radius: 0; } .VideoEl { position: absolute; width: 100%; height: 80%; left: 0; top: 0; } .VideoTxt { position: absolute; width: 100%; height: 20%; left: 0; top: 80%; font-size: 1.5vmax; text-align: center; }