* {margin:0; padding:0;}p{margin:14px 0;line-height:130%; }ul{margin-left:17px; list-style:circle;}ol{margin-left:17px;}li{margin:8px 0 8px 17px;}.vam{vertical-align:middle;}.fl {float:left;}.fr {float:right;}form{margin:0;}img,a img{border:none;}.bd {border:1px solid red;}b,strong {font-weight:700;}em {font-style:italic} .imgLeft {margin:0 15px 5px 0; float:left;}.imgRight {margin:0 0 5px 15px; float:right;}.imgFullWidth {width:100%}.cb {clear:both;}.cr {clear:right;}.cl {clear:left;}.c {text-align:center;}.l {text-align:left;}.r {text-align:right;}.contain::after {content: ""; clear: both; display: table;}sup { vertical-align: top; font-size: 0.7em; position: relative; top: -0.1em;} @media screen and (max-width:475px){ } html {height:100%;}*,:after,:before { box-sizing: border-box } body {font-family: "Helvetica Neue",Helvetica; margin:0; background:#F8F8F8; height:100%;}a {color:#003A79;}.dn {display:none;}.nav {display:flex; justify-content: space-between; padding:8px 18px; position:fixed; top:0; width:100%; background:#fff; border-bottom:1px solid #e9e9e9; z-index:10;}.nav span {text-align:center;}.nav button {font-size: 20px; color:#007AFF; border:none; background:none; cursor:pointer;}.navRight {justify-content: flex-end;}.spacer {height:50px; width:100%;}#addReport {grid-column-start:3; grid-column-end:3; justify-self:end; cursor:pointer; text-align:right;}#cancelReport {grid-column-start:1; grid-column-end:1; cursor:pointer;}#saveReport {grid-column-start:3; grid-column-end:3; justify-self:end; cursor:pointer; text-align:right;} h1 {margin:0 0 10px 18px;}#content {background:url(/assets/images/app-logo-background.svg) 50% 30% no-repeat; background-size:45%; height:100%;}#reportList { padding:0 0 80px 0; }#reportList ul {background: #fff; margin:0; padding:0px 0 0px 18px; list-style:none;}#reportList ul li {background: #fff; border-bottom:1px solid #C8C7CC; padding:15px 0; cursor:pointer; margin:0;}#reportList ul li:last-child {border-bottom:none;}#reportList ul li {color:#000; width:100%; display:inline-block; background:#fff url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwIiB5PSIwIiB3aWR0aD0iMjYuNSIgaGVpZ2h0PSIxNC4xNDIiIHZpZXdCb3g9IjAsIDAsIDI2LjUsIDE0LjE0MiI+ICA8ZyBpZD0iQmFja2dyb3VuZCI+ICAgIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIyNi41IiBoZWlnaHQ9IjE0LjE0MiIgZmlsbD0iIzAwMDAwMCIgZmlsbC1vcGFjaXR5PSIwIi8+ICA8L2c+ICA8ZyBpZD0iTGF5ZXJfMSI+ICAgIDxwYXRoIGQ9Ik0wLDEyLjcyOCBMNS42NTcsNy4wNzEgTDAsMS40MTQgTDEuNDE0LC0wIEw4LjQ4NSw3LjA3MSBMMS40MTQsMTQuMTQyIHoiIGZpbGw9IiNEMUQxRDYiLz4gIDwvZz48L3N2Zz4=) right center no-repeat;}/*#reportList ul li a:link {text-decoration: none;}#reportList ul li a:visited {text-decoration: none;}#reportList ul li a:hover {text-decoration: none;}*/#reportList-chevron {padding-right:32px; background:#fff url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNC4xNDIiIGhlaWdodD0iMTQuMTQyIiB2aWV3Qm94PSIwIDAgMTQuMTQyIDE0LjE0MiI+PHBhdGggZD0iTTgsMTBWMkgwVjBIMTBWMTBaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3LjA3MSkgcm90YXRlKDQ1KSIgZmlsbD0iI2QxZDFkNiIvPjwvc3ZnPg==) right center no-repeat;} .preview {font-size:20px; margin:25px 18px;}  .compose {padding-bottom:80px; overflow: auto;}.compose ol {margin:0; padding:0;} .compose li {font-size:15px; border-bottom:1px solid #D3D3D3; font-family:"Helvetica Neue",Arial; color:#707070; padding:16px 80px 16px 15px; margin:0; list-style-position: inside; position: relative; min-height:34px; } .compose li::marker {display:inline} .compose .question {} .compose li:first-child {border-top:1px solid #D3D3D3;} .compose li .numberInput {position: absolute; top:13px; right: 15px; width:50px; font-size:18px; color:#000;} .radioInputYes {position: absolute; top:5px; right: 15px; font-size:15px; color:#707070;}.radioInputNo {position: absolute; top:26px; right: 15px; font-size:15px; color:#707070;} .nonGrid {margin-top:10px}#attachFilesBtn {border:none; background:#444; padding:6px 15px 4px 15px; color:#fff; font-size:16px; border-radius:7px; cursor:pointer; display:block;}#attachFilesBtn img {vertical-align: middle; width:23px;}.warningBox {background:#F1B93C url(/assets/images/icon-warning.svg) 8px center no-repeat; padding:8px 8px 8px 48px; font-size:16px; color:#fff; max-width:280px;}#totalSizeImages {font-size:15px; font-family:Asap,Arial,sans-serif; color:#444;} .fileUpload {display:inline-block; margin:0 15px 15px 0; font-size:13px; color:#666; position:relative;}.fileUpload .photo {max-width:120px; max-height:120px; padding:3px; background:#fff; -webkit-box-shadow: 1px 1px 3px 1px rgba(140,140,140,0.18); -moz-box-shadow: 1px 1px 3px 1px rgba(140,140,140,0.18); box-shadow: 1px 1px 3px 1px rgba(140,140,140,0.18);}.fileUpload .close {display:inline-block; float:right; margin:2px; cursor:pointer;}.fileUpload .size {display:inline-block; }.fileUpload .progress {position: absolute; top:36%; left:36%; font:bold 15px Asap,Arial,sans-serif; color:#fff;}#photoThumbnails {margin:15px 15px 10px 15px;}.fileUploadFields b img {height: 22px; width:22px; vertical-align: middle; cursor: pointer;}#fileUploadFields {display:none;}  #viewReportsList {background:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjAiIHk9IjAiIHdpZHRoPSIxMyIgaGVpZ2h0PSIyMSIgdmlld0JveD0iMCwgMCwgMTMsIDIxIj4KICA8ZyBpZD0iTGF5ZXJfMSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEuNSwgLTMuNSkiPgogICAgPHBhdGggZD0iTTEuNSwxNCBMMTIuMzUsMy41IEwxNC41LDUuNTggTDUuOCwxNCBMMTQuNSwyMi40MiBMMTIuMzUsMjQuNSB6IiBmaWxsPSIjMDA3QUZGIi8+CiAgPC9nPgo8L3N2Zz4=) left center no-repeat;} #loginScreen,.resetPassword {display:block; background:#2E5966 url(../../images/dark-exa.png); background-size:center/cover; position:absolute; top:0; right:0; bottom:0; left:0; text-align:center; padding:30px 0 150px 0;}#loginScreen .appLogo,.resetPassword .appLogo {grid-row-start:1; display:block; margin:0 auto 20px auto;}#loginScreen .appLogoTitle,.resetPassword .appLogoTitle {grid-row-start:2; display:block; margin:0 auto 20px auto;}#loginScreen .instruct,.resetPassword .instruct {color:#fff; font-size: 20px; margin:50px auto;}#loginScreen #username,#loginScreen #password,.loginField {border:none; padding:8px; font-size:22px; color:#444; display:block; margin:0 auto; width:300px;}#loginScreen #username {border-bottom:1px solid #ccc;}#loginScreen form button.submitButton,.resetPassword button {background:#B5896F; color:#fff; border:none; padding:8px 10px; width:316px; font-size:20px; margin:15px 0; }#loginScreen form p {color:#fff;font-size:16px; margin:0;}#resetPasswordLink {background:none; border:none; font-size:16px; color:#003A79; cursor:pointer; text-decoration: underline;} .resetPassword .instruct {max-width:600px}#searchAccount {border:none; padding:8px; font-size:22px; color:#444; display:block; margin:0 auto; width:300px;}.installP {margin-top:30px !important;}.installPWA {padding:6px 12px;}.installPWA svg {vertical-align: middle;} footer {border-top:1px solid #E8E8E8; display:flex; justify-content:space-between; position:fixed; width:100%; bottom:0; background:#F3F2F3; height:50px; color:#939393;}footer figure {text-align:center; font-size:12px; margin:6px 18px 0 18px; cursor:pointer;} .back {display:flex; align-items: center; color:#0081F9;}.back img {margin-right:8px;} :root { --primary-color: #000; --secondary-color: #fff; } .container { display: flex; align-items: center; justify-content: center }.tabs { display: flex; position: relative; background-color: #ECEDEE; padding: .2rem; border-radius: 8px }.tabs * { z-index: 2 }.tabs input[type=radio] { display: none }.tab { display: flex; align-items: center; justify-content: center; height: 32px; width: 100px; font-size: 13px; border-radius: 8px; cursor: pointer; transition: color .15s ease-in }.notification { display: flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; margin-left: .75rem; border-radius: 50%; background-color: var(--secondary-color); transition: .15s ease-in }.tabs input[type=radio]:checked + label { color: var(--primary-color) }.tabs input[type=radio]:checked + label > .notification { background-color: var(--primary-color); color: #fff }.tabs input[id=radio-1]:checked ~ .glider { transform: translateX(0) }.tabs input[id=radio-2]:checked ~ .glider { transform: translateX(100%) }.tabs input[id=radio-3]:checked ~ .glider { transform: translateX(200%) }.glider { position: absolute; display: flex; height: 32px; width: 100px; background-color: var(--secondary-color); z-index: 1; border-radius: 8px; transition: .25s ease-out }.courseList { background: #fff }.courseList ul { list-style-type: none; padding: 0; margin: 10px 0 0; }.courseList li { display: flex; align-items: center; padding: 10px 15px 10px 0; margin: 0 0 0 17px; border-bottom: 1px solid #e0e0e0; font-family: -apple-system,BlinkMacSystemFont,"Arial",Roboto,sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 40px; max-width: 100%; position:relative;} .listItemDownload li::after { content: ""; background: url(/assets/images/icon-download.svg) no-repeat center; background-size: contain; width: 17px; height: 18px; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); } .listItemNewTab li::after { content: ""; background: url(/assets/images/icon-new-tab.svg) no-repeat center; background-size: contain; width: 16px; height: 16px; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); } .courseList li b { color: #000; font-size: 17px; margin-right: 10px; font-weight:normal;}.courseList li span { color: #8e8e93; font-size: 15px }.courseList li a:hover { text-decoration: underline } .posRelative {position:relative;} .notificationDot,.notificationDot2,.notificationDot3 { position: absolute; top:-5px; right:0; width: 10px; height: 10px; background: red; border-radius: 50%; box-shadow: 0 0 2px rgba(0,0,0,0.2); z-index: 2; }.notificationDot2 {right:5px;}.notificationDot3 {right:12px; top:-2px;}/** * Mcx Dialog Mobile v0.1.0 * Copyright (C) 2018 mcx * https://github.com/code-mcx/mcx-dialog-mobile */.dialog-mobile-bg { position: fixed; top: 0; left: 0; z-index: 10000; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}.dialog-mobile { position: fixed; top: 50%; left: 0; z-index: 10001; width: 20em; border-radius: 5px; background-color: #FFFFFF; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}.dialog-mobile .dialog-content { padding: 2.5em 1em; text-align: center; color: #333333; border-radius: 5px 5px 0 0; position: relative;}.dialog-mobile .dialog-content:after{ content: ""; position: absolute; z-index: 10002; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #CCCCCC; -webkit-transform: scaleY(.5); transform: scaleY(.5);}.dialog-mobile .dialog-button { height: 3em; line-height: 3em; text-align: center; border-radius: 0 0 5px 5px; color: #000000; background: #EEEEEE; cursor:default;}.dialog-mobile .dialog-sure-button,.dialog-mobile .dialog-cancel-button { float: left; height: 3em; width: 50%; line-height: 3em; text-align: center; background: #EEEEEE; cursor:default;}.dialog-mobile .dialog-sure-button { color: #1C86EE; border-radius: 0 0 5px 0; position: relative; cursor:default;}.dialog-mobile .dialog-sure-button:after { content: ""; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background-color: #CCCCCC; -webkit-transform: scaleX(.5); transform: scaleX(.5);}.dialog-mobile .dialog-cancel-button { color: #000000; border-radius: 0 0 0 5px; cursor:default;}.dialog-mobile-bottom { position: fixed; left: 0; bottom: 0; z-index: 10001; width: 100%; color: #333333; background-color: #EEEEEE;}.dialog-mobile-bottom .bottom-btn-item { text-align: center;}.bottom-btn-item .dialog-item-btn { background: #FFFFFF; padding: 0.5em 0; border-bottom: 1px solid #EEEEEE; cursor:default;}.bottom-btn-item .dialog-item-btn:last-child { border-bottom: none;}.dialog-mobile-bottom .dialog-cancel-btn { margin-top: 0.6em; text-align: center; background: #FFFFFF; padding: 0.5em 0; cursor:default;}.dialog-mobile-toast { position: fixed; bottom: 5em;}.dialog-mobile-toast .toast-content { padding: 0.5em 1em; color: #FFFFFF; border-radius: 2px; background-color: #333333;}.mobile-loading-bg { position: fixed; top: 0; left: 0; z-index: 10000; width: 100%; height: 100%; background-color: rgba(0,0,0,0.3); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}.mobile-loading { position: fixed; top: 0; left: 0; z-index: 10001; min-width: 2em; min-height: 2em; padding: 0.8em 1.6em; text-align: center; border-radius: 2px; color: #FFFFF0; background-color: #0A0A0A; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}.animation-zoom-in,.animation-zoom-out,.animation-bottom-in,.animation-bottom-out,.animation-bg-fadeIn { -webkit-animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-duration: 0.3s; animation-fill-mode: both;}.animation-fade-in,.animation-fade-out { -webkit-animation-duration: 1s; -webkit-animation-timing-function: ease-out; -webkit-animation-fill-mode: both; animation-duration: 1s; animation-timing-function: ease-out; animation-fill-mode: both;}.animation-zoom-in { -webkit-animation-name: zoomIn; animation-name: zoomIn;}.animation-zoom-out { -webkit-animation-name: zoomOut; animation-name: zoomOut;}.animation-fade-in { -webkit-animation-name: fadeIn; animation-name: fadeIn;}.animation-fade-out { -webkit-animation-name: fadeOut; animation-name: fadeOut;}.animation-bottom-in { -webkit-animation-name: bottomIn; animation-name: bottomIn;}.animation-bottom-out { -webkit-animation-name: bottomOut; animation-name: bottomOut;}.animation-bg-fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn;} @-webkit-keyframes zoomIn { from{ opacity: 0; -webkit-transform: scale(0,0); } to{ opacity: 1; -webkit-transform: scale(1,1); }}@-webkit-keyframes zoomOut { from{ opacity: 1; -webkit-transform: scale(1,1); } 90%{ -webkit-transform: scale(0.3,0.3); } to{ opacity: 0; -webkit-transform: scale(0,0); }}@keyframes zoomIn { from{ opacity: 0; transform: scale(0,0); } to{ opacity: 1; transform: scale(1,1); }}@keyframes zoomOut { from{ opacity: 1; transform: scale(1,1); } 90%{ transform: scale(0.3,0.3); } to{ opacity: 0; transform: scale(0,0); }}@-webkit-keyframes fadeIn { from{ opacity: 0; } to{ opacity: 1; }}@-webkit-keyframes fadeOut { from{ opacity: 1; } 30%{ opacity: 0.3; } to{ opacity: 0; }}@keyframes fadeIn { from{ opacity: 0; } to{ opacity: 1; }}@keyframes fadeOut { from{ opacity: 1; } 30%{ opacity: 0.3; } to{ opacity: 0; }}@-webkit-keyframes bottomIn { from{ bottom: -1000px; } to{ bottom: 0; }}@-webkit-keyframes bottomOut { from{ bottom: 0; } to{ bottom: -1000px; }}@keyframes bottomIn { from{ bottom: -1000px; } to{ bottom: 0; }}@keyframes bottomOut { from{ bottom: 0; } to{ bottom: -1000px; }}