*{ box-sizing:border-box; }

@font-face {
	font-family:regularFont;
	src: url('../../fonts/titillium-web/TitilliumWeb-Regular.ttf');
}

@font-face {
	font-family:TitilliumWebSemibold;
	src: url('../../fonts/titillium-web/TitilliumWeb-SemiBold.ttf');
}

@font-face {
	font-family: 'fontello';
	src: url('../../fonts/fontello/fontello.eot?99475861');
	src: url('../../fonts/fontello/fontello.eot?99475861#iefix') format('embedded-opentype'),
	url('../../fonts/fontello/fontello.woff2?99475861') format('woff2'),
	url('../../fonts/fontello/fontello.woff?99475861') format('woff'),
	url('../../fonts/fontello/fontello.ttf?99475861') format('truetype'),
	url('../../fonts/fontello/fontello.svg?99475861#fontello') format('svg');
	font-weight: normal;
	font-style: normal;
}

.bMargin40 { margin-bottom: 40px; }

html, body {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	height: 100%; 
	font-family:regularFont;
}

body { 
	font-size: 17px;
	color: #41505F;
	background-color:#DFDFE7; 
}

.is-hidden { display: none; }
.right{ text-align: right; }
.center { text-align: center; }
.password-icon {
	position: absolute;
	bottom: 13px;
	right:19px;
	color:#C2C2CE;
	font-weight: 600;
	color:#41505f; 
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 19px auto;
}

.pw-eye-off {
	background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAhCAYAAABeD2IVAAAAAXNSR0IArs4c6QAABItJREFUWAm9Vz1600AQXckNVJgToDIVUTq6KB1dnAOQmBPEOUGcE+CUVLbhAFFOEOUE2F1K0VHGHQ1e3tNq7JG8awNfwhTa+d+3s7MrKTIBynr9rjH2MjJmYI0ZFfn0IuD65Oo4nHE5ISDaOWa9D/2w79NagqAABJXSFH9C9RKteS4+CMqaeKgndSDtWOuei8dcYcp6p8PIRJfawxp7VeRfhtShcmkU/XpF3pooiYwtK952FkU+mZH/F9oKigmPeqdIHu3r5Gj8AoGZ1vl4+gFubkx8C5Clz8en2wmKfYQKcNVVRXxJ/kRXAYzspLj5Mt3lvxMUE/DkRSYeB5ItUA21VVEKv+ACAK5E5T+ickUgn/GCcnfU8hy9cyWB6K8c/XUsMkfdX1qP+F5klgNMfqj1mge4Eezoz8mj1pPfAMXmxXRjGFJrlhdF/hXBVVN360ZeVQGJkTA6gLnLhre28133Tl1hxq9imEsI8TPEH7WBNUDVgO6g7DKwnpRBCK6AZQB2Rz5EqN4tGrsvEzEnYgr4h4CVAHYiczBvhw9SGxB1APcCw7vyYf6ZcvkwK5O9/dfYxneU2wRA19jyPvx+ig38j2Tv7U/EvBedHusCvE/2DqYSV1UKgFAZ+w1CogOEb/eO75qg710+rfJJnB4RU2CZh1qneb2V9Y1e9VCinTSPVV66Sjotbvs+OJy6NSFpuZbWHOISSljYhGOIsJrUmOWQ9hhBOCmmR2ELLfSek8chGGp/5Eg0cNogcwfGzq+Ta38fj8WfIyZDpewnn0NT5+4hN4mz8FS6ptae9ubo5PSYGgfQ8tBklKXxyW+n5SDmCrc7NawpJlNVjfuwrraxymWj/Kh3ZnHi2KOpjnZ9ozWbPGNYqftNU1ODl60c55LbAWAJPbh62BRIasPUBunzBPAibn+i+ByZjFsHECUqgMpIn1TACl4FvjjqZItlISG/Wo/c8TDGREx6tcOZ5owP+I4AMsNtPaDsiN9edi5Sc4xHTv6VNfWbEg8PF47t42r5fRRKKsH23PnytWPneEHzSzR1Om5j3BdPGbEVj+BnTo4vRe8bsdipvNIqUHRC0mwbMF2d2vce/mOEVoQV8pq4EJkjYrq8e9zHokm0rcnbOd8EokPcmtg3eLsXSLe/1jY5NDbfUzm17mei8ygydbtubvo0yc65SORgVStqgKKGwLC6CS6y6r5xbs0nSj3AyrzN7RZmS0TIiW0GK8lt2bpCYtoAJQY2MvpmCNmbHP1SYvtGvk9dAMNbwt5ILs+4wFZjYV8nHhu3PUxInrAnULWzsJezAGSOH9YT8UMf4ZRG5yLLyOpgIQC03i6xybgVlDgpcD3ovJWjb7Pfqv6coT/fSJ7a5wCAoA/TH4HS4dwaVC9DYNr+FEG1HqHjpCVj4JvydaPj4QNAm1+b2uevQelg4V0lTUIZgAqOQoF/x2sclIH4tMcnAdVO2pZ91wS2mp/ZRduX8ury9BmfSlff9gudD/fhUMua/y+g2GOoTF9PjFOYa1nzqx8HrXwOHj8FD/iBWKBfXqJyF+ipSWie35RX3veDRqiRAAAAAElFTkSuQmCC');
}
.pw-eye-off:hover {
	background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAhCAYAAABeD2IVAAAAAXNSR0IArs4c6QAABFhJREFUWAnNV01SU0EQ7skPBW6MG6uIC3MD4wkIJxAWSLkynsBwAsIJkBOAK4uwIJzAeALiDXBBqHIj2RCKJI799WTem5nMe8EqsOyqZPpv+vXrv5lHlAWnvyp0PNinzkDLmqX3CPxCps3x6IgUtUSOtXPVzNR9YEG2U0QV/1m/9+nLVc3nPQ6V7ZRSbf+RqkJFfejzHodSuWaPL9uk1K6no/Uebb9oC6/zs040fSq4phqn+0JwKg7p7fO+wf/+P98p2Du+7LNjrwLTPaYbAS9G9pjZpak6o3erFzGFGG+xU6ijosZbm4jErNyP1yOtjmh79fMi9cVOwYJ0XmY9DVnDTRWnNOcFNKe4oD7Q1mqP9aIQdwozanL7kTfuJbs6gy7jbxIaiFtfruB4sDEbJ2su28M1faKllT3afHbt8ZmYd0qKd3zIojpLd2ir+kk2wdHx6IJxJ436mqaF11QsVqTgp/TDqx0TYex39oi12R+XRfnJeuiY75Rx6Cs7xA8B8EOpvJ500slVg6PD8lw4o/JKM3mQ2Jz0eEfcMaRTlTaTZ7BiOqfmHMKD4RyiNgNTBweWjKwH9La6kTgEBYwGRe2IrmEpqpGenBIyMQMTKTDuRue8uWYF3hrWTnxMsANVP/Kukc6gx+Say/LxNJUmUnejw0yHsBMDVCI5M6PKTcbQdSkgDTFIjiYeB7nANTwetaFS4BsAOmUjVx8OuBM6lhJE2XUcBpEBezSVl7sLngHxR+K6RaT276HcFx0n77OuPPP2ojZOLt8IDw6Ob9AUDaEjrS/88E/rViE3beGGyW1dImv56DI3jVK0qit3MJqcc97rVtWscjL4rHmqjkh9m+eHHG3aeYL25clu6wRvr9Si1DvGQicdkUU19ThS4RXFSt2VjSF1cqiqYVInUFk8JkyK7Yu4ZufxIf1W7YIYRcsvgrtRQ1QUHw+ok5NBK9lSXmnzUP2e0C6iFPSJirPacmUhjnnGL470kdyPsozajYo7A4BjB7qaG8R2m6RRxoTVnq18IpSW+0JovRsIfVLTZ3ukGacgXnqCIyT+tmZ7Gh3oSi06096MiR2jav/5RMDskcsij4wswHO3q00rVhaRVSb7TS9yqUvVNG2yga4wcOBqjoalwVw4uVNTgsEhvKQzMnynoAXH8CUTXlMgS6HFR8pBSjqY2X/BHNOxjmgORcqcCFn5vFNWgkLWcpDGjcvpzkUfu+qaU+LUmoqsQ55h/GKrRxEZj848QBsXdJu13uepiUzzXXy7upnodQboOtMcCZMRRGdppeWmyxUDz3fKaqfObTArHjnouvVm0thn7kuIUii99s7RVJBg93MqUWfEpKbBWJ1/a/xzgIseN1H75SIjA8eNC+kVxeW6+N875e62OCJZopqQ4QdB7NuRCJfBlt0erg/jVGg1pGNjQqn1rC+adHiGhh6Snqomm+OOc0BzA2XAv3EKNaap6fmguFv/C8DsQyrRLDnwB6Mljd5bExrgAAAAAElFTkSuQmCC');
}
.pw-eye-on { 
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAbCAYAAAAOEM1uAAAAAXNSR0IArs4c6QAAA7JJREFUWAmdV+1Z2zAQlkT/kw3wBs0GmAkwAwDpBLAB6QRJJ2goAySdADMBYYN0gzAAvr4n+SxFkWWDnie5032+upMURasvjour63MiXSqlpwgxwWeqHVWk1B7zLT6gtNWa6uf10wvmnx6IOX6U1axEwlt4VAJmrHcLeoMF/ao3KwY/aowC2AJ7gHE5KuqAEcDWAPoTQEHzIwsQwCao2HoIGCn6izSoCu1cOl2AouX60s3T3wDKFf0BoPu0BbR9irZqDA4gk+MdwJb15s88qW2FZXUzB9B7TE9Tdq71+qqvmkmAZXU908r8TgV0MnojZcrcykNf7oRWTY16fA/lIU+qQSWfVqGM+SOAQ+C4nahaFQcCiELrjzOWE528A/w2trmobmqkPI/lMk+BNKJkOgQOqf8pZWahj+ebmSJT80crei2r22e3TbwFqo6FcYz04K4xhlDbAeRg+bYiNMD1t9VswsBoDeIRQPqE7MsxQruYdyD5OnPDAuT2IP1ahGlKb0hQp3VWOknp4qq4GPSWsvUyWjtM6JcT0gIrTiYQJ+y9lfBp2qB9fcMskLCLPxTLYaEFRzOutSoTXJKebIWDzzRMiKvkDlfJnehj6hJ+BDl8rNhW5vCpGNs3tDZznYg5rv6D9jb4qdMPOAg1LHAh56vvoujCUfvdLTaQJVhaGAQvEpohkfWBLw7CGHD2PislKB8W4XMUsacG++ExZyQ6lLsQHnQX8KNYsr+/zjSK1evP2HBIzBwW771WXlF49vBK8fIchzvSj8KzvRwwmblBuXdAuuw16xT+lMIHe4heOtUgQy/xHh5yYUyMzV4z7gd/6G7Sl+HJxYV7jyRjKo9HhbW1mFyM/CuHFy+PkPYehEiZEhF6E2LDFko1DMoOriIpflH3/3Sxjm1cxVtHxHCxZB5T9jGVSGHrB1aHK4NqSE691HPY6Hucx4vDhDjK9vWjZ+4hYAHztlnFr5M2/quPeMSh2ocLOgDI5l8FeZQqEnBcVPQZCSeRSqZH4FjRtVishlrnEvAjYNa1QXz7aHl1c5sHl9oKLtpRBSUJAGClzQq/GJciiynfbfjHtiQyfEr3oZ79tW74nx/vuTLUhTzfdajTfewvNr0AxYArhdfwEvvrTGQpymBDeQ6Us7OHgYFtQr+YHwQoDjgIqAT/t8gDFft+ysD4jnvCoofHaIASyu09+1ioIEuedrENKA4AoVJmM1SxwMeynwYYBgDYQqmPElUFtUPozk35b+hJDVDt3Ek/8/0fjk5/Wi2rsc8AAAAASUVORK5CYII=');
}
.pw-eye-on:hover {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAbCAYAAAAOEM1uAAAAAXNSR0IArs4c6QAAA8NJREFUWAmdV0FW2zAQHZmE17Ah3fQ96ILcoLkB7gkIC+jrinCC5gbQE0BPQLrqIyygJ8A5AekNyKLJe92UbKCPBKt/JCuRbMtOmPfskUYzo2+NRiMLei31xrskKKRYNsHrROAkwJnkA9oDkvRAgeIRHW719dhqb7GS+tU4JBkfwaa1ALOsBwZNN0TVb3T4brCs1XIAFTB5Aqfhso5L9CIS4isdbEUleghOEV3/rdP06RoqYZEaxn6SlAMSwb3Sk3EDAJpo76m+7yWxouu1Y9p/y6ubS36AOpwAZ/ZVxn4CUOf06f1pZsQWXP4+BdgORJu2eNFG6EWw71vNfIC9cRsb/WLhJNWS8hetb4RFX+5YcCSeHzmsHxy50xHHSKSuI0InC7AMHIfzcLuVdkQ/xg1aox0tX5vkJkJvFGF8V+vkvbMgA0etHNyQqrW2Y2M6QQy5jPQzu6Pe6JZ4m9hUrfGHDW2R20bUFIaFdAFQOSsIK9sI0faGVVRvFm5VC0eSvHUm5GRgH4UEDNaHaYAcHhkjIQqI913RsSBe6vnWqVVhH+yriBgLYwJpgIE8w/J4Jkg8BaKbtPKZlBw+D8VnxIliqMwXY1GYGCAvp+DKUEYoWYZ6f5rOhL3RFwzx4yFMOP1nzWH58lgoTMBWQS29yMnlrJkdXjlt0XR2gkSIkBRNKNezBikJH96GKm8GKACm5+cyPgsAruHX8I0IYxOWbg3jQgjoJlRQOYyK5qIZ4Mbx3RV6esmm1aPy3qPlF0s+ghJyfBlhDge2gGJxiqFJzrArqlgrnT1SXN28XhBEc7Htay7MNCaMLaDPW/eqpmbGUwI7S/V1qZ/SKOr2nSPK9uWz4joPbPqY4YJfejbhZmIfFVTpwHf5yisdpauhsA9Zcssh6ptLiAbIplz8iybkZHp+ZFCa1CpWQnSGiSSPYQw69gWVfRQnJpfTlnEmTENxPt9oFqG96cjnHb4VVz86E/KYruFttPgiwIDvkd3dzO1E+7/DuI8QEfeDXIBs9lqQvimNXPmd3hYcSxlwbLoIsXFUGjouiZjocjQPgzH18svxkbLxl9PsVkicZVfQzMKbefrURXfPiHJ4RALZVtnoZ245bD973CWpbtNhjq0W8Tm8Xutk7BMDP0DjkVdK0Dm6O0bk4VFKHqb66e4Q2dyhT9s36QG7Xw7QaF+NOsphOVBj4eND9cEH2/zRpbQ8QONK7z1eVd6Dnmw3ynOOHyz+J8ZTsmJzi6SxOkDbA9fUNQpx2W1osUh4Uqv5N/SFIlWttMLK7//0aFjATKDHqwAAAABJRU5ErkJggg==');
}

input[type="password"]{
	font-family: "fontello";
	font-style: normal;
	font-weight: normal;
	speak: none;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	letter-spacing:2px;
	font-size: 10px;
	color:#41505F;
	font-weight: 400;
	padding-right: 50px;
}

::-webkit-input-placeholder {
	font-size: 17px;
	color:#C2C2CE;
	vertical-align: middle;
	font-family: regularFont;
}

:-ms-input-placeholder {
	font-size: 17px;
	color:#C2C2CE;
	vertical-align: middle;
	font-family: regularFont;
}

::-ms-input-placeholder {
	font-size: 17px;
	color:#C2C2CE;
	vertical-align: middle;
 
	font-family: regularFont;
}
::placeholder {
	font-size: 17px;
	color:#C2C2CE;
	vertical-align: middle;
	font-family: regularFont;
}

.login-page {
	position: relative;
	min-height: 100vh;
	background-color:#ffffff; 
}

.login-form-container {
	position: absolute;
	top:50%;
	left:50%;
	width: 400px;
	min-height: 450px;
	padding: 48px 40px 18px;
	background-color: #ffffff;   
	transform:translate(-50%, -50% );    
	border-radius: 8px;
}

.logo-container {
	margin-bottom: 38px; 
	position: absolute;
	top: 37px;
	left: 44px;
}

.img-logo {
	display: inline-block;
	max-width: 195px;
	height: auto;
}

.login-group {
	position: relative;
	margin-bottom:30px;  
}

.login-label { 
	display: block; 
	line-height: 1;
	margin-bottom: 10px;
	font-weight: 500;
	font-size: 17px;
}

.login-input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: block; 
	box-sizing: border-box;
	width: 100%;
	height: 45px;
	padding: 14px 20px;
	outline: none;
	font-size: 17px;
	border: 1px solid #DFDFE7;
	font-weight: 400;
	line-height: 1;
	color: #41505F;
	background-color: #ffffff;
}

.login-input[name="username"]{
	background-size: auto 16px;
	padding-right: 50px;
	background-position: 94.2% center;
	background-repeat:no-repeat;
	background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAYCAYAAAGNTO3gAAAACXBIWXMAAAsSAAALEgHS3X78AAABbUlEQVQ4ja1Vy1XDMBAcBwowHcQ3H50KiCpAqcCUECpIqAA6cFQBogJBB+4gpoL4xhHeOmueLG8c5ZE55KOdnbX2ZxCULh/pe4YjKvpM+LT709PSmdLlGsCBuC8dj03E61ScNQkkkOKPaGGJbf+71/xjk+bslOcIYiDRffCggtezs2Y78Fa6dILQZhTGWaMAtAFxMQitdPkGQE9c5m46bR4odB1DDG+dAqCiNs6anUjk4mx8o19nP7kDEjtXElHCPJb4LhEXAal11ryeERoj4ZQcJjjWWbO6yfLi+4xYnuXFV2zrVtE9Hkus5VE8lnTN1UoDU8udL6ZuJKh0SVXbRz5R5qxp/APpKpVwdgojbvyiiIQkuKJ5iXBvmDvAVFFSXqzaKwwVxAJ4ctaEC6VDONEFC9zzEU3Lh7Om9uxLAA9s/+SWrgeCvOuWl2VrBAqsaKj2/oD/Ew0V5VpihPnV2+aWtje/FcMRuxQtgN0v2Jlpa6SMfEYAAAAASUVORK5CYII=');
}

.forgot-password {
	position: absolute;
	left: 0;
	font-size: 15px;
	font-weight: bold;
	top:5px;
	cursor:pointer;
}

.forgot-password:hover { color: #00AAE6; }

.warning-text {
	font-size: 15px;
	color: #D91E18;
	line-height: 1.5;
	padding: 0;
	margin: -10px 0 0;
	position: absolute;
}

.login-button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: inline-block;
	background-color: #41505F;
	border: 2px solid #41505F;
	text-transform: uppercase;
	text-align: center;
	color: #ffffff;
	font-weight: 500;
	min-width: 108px;
	padding: 9px 25px;
	font-size: 15px;
	outline: none;
	cursor: pointer;
}

.login-button:hover {
	background-color: #00AAE6;
	border: 2px solid #00AAE6;
}

@media all and (max-width:568px){ 
	.login-form-container{ width: 90%; }
}

.login-subform { width: 350px; }
@media all and (min-width:910px) {
	.login-form-container.course { width:900px !important; }
	.login-subform { float: left; }

	.login-subform-separator {
		width:120px;
		float:left;
	}

	.login-subform-separator-bar {
		width:60px;
		border-right:#cccccc 1px solid;
		height:248px;
	}

	.login-subform-separator-bar-or { display: none; }
}

@media all and (max-width:909px) {
	.login-form-container.course {
		width:90%;
		max-width: 400px;
		transform:translate(-50%, 0% );
		top: 20px;
	}

	.login-subform { width: 100%; }

	.login-subform-separator {
		width:100%;
		padding:0px 0px 40px 0px;
	}

	.login-subform-separator-bar {
		width:100%;
		border-bottom:#cccccc 1px solid;
		height:14px;
		text-align: center;
	}

	.login-subform-separator-bar-or {
		padding:7px;
		background-color: #ffffff;
		font-weight: bolder;
	}
}

/*PLO SYSTEM*/
.loglevel-container {
	background-size: auto 100%;    
	background-position: center;
	background-repeat: no-repeat;
	background-color: #b7d6e3;
}

.img-background-left{
	display: block;
	height: 100%;
	max-height: 100vh;
	width: 100%;
	object-fit: cover;
	background-position: 50% 100%;
}

.login-page { display: flex; }
.loglevel-container {
	position: relative;
	width: 40%;
	min-width: 650px;
	min-height:100%;
}

.customer-container{
	position:relative;
	width: 60%;
	min-height: 100vh;
	background-color:#ffffff;
	display: flex;
	flex-direction: column;
}

.top-container {
	width: 100%;
	display: grid;
	grid-template-columns: 70% 30%;
	min-height: 100px;
	padding: 30px 30px 0;
}

.customer-logo-container {
	display: block;
	width: 179px;
	height: 100px;
}

.content-container {
	margin-top:150px;
}

.login-group { 
	display: flow-root;
	position: relative;
	margin-bottom: 41px;
	width: 80%;
	padding-top: 48px;
}

.login-group .big-btn {
	min-width: 150px;
	margin-bottom: 20px;
	float: left;
	margin-right: 20px;
	font-weight: normal;
	background-color:#5145cd;
	border:none;
	text-align: center;
	color:#ffffff;
	padding:10px 20px;
	font-size:14px;
	line-height: 1;
	border-radius:4px;
	cursor: pointer;
	transition: all 0.2s ease;
}

.login-group .big-btn:hover, .login-group .big-btn:focus{
		background-color:#362f78;
}

.test-login-container {
	position: relative;
	text-align: right;
}

.test-login-dropdown { 
	display: none;
	position: absolute;
	top: 26px;
	right: 10px;
	z-index: 9999;
	min-width: 250px;
	background-color: #ffffff;
	border: 1px solid #BCC1CA;
	border-radius: 6px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05); 
}

.test-login-container.open .test-login-dropdown { display: block; }

.dropdownBtn {
	border:none;
	background-color: transparent;
	color:#1a1a40;
	margin-right: 10px;
	font-weight: 500;
	font-size: 15px;
	background-repeat: no-repeat;
	background-size: auto 7px;
	background-position: right center;
	padding-right: 27px;
	cursor: pointer;
	letter-spacing: 0.1px;
	font-family:regularFont;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAAYCAYAAAEQQeRoAAAACXBIWXMAABYlAAAWJQFJUiTwAAABrUlEQVRIibWVvWHCMBBGn5iAtFdlBDJBlA3CBskEWYFMQjbBmQA2CJVa2IAU6IwQ+rMNX2WJ09OzzclQiog9pa77iatJEbuICTPgS8RufcFcxJ6MH6yBBbBwrjNGxD4Df8DOue4lITMHDsDRBJNr4EMXBUU41xkAkyDpor4o3qYYEWtnwOHmoVwXnYBNP0gVJ+fjyXhs4uJwfHND1e2UGPyQfAG1hM8e2Iev+SOoa4JHMOB8a/G9N8FzML1OPrAcvAYrQgvwIqwJmoIX/w7RIttU2MAwIvYAaCM9OdcdR8C2nA8IZgEMzo1X7dIcDG7/8Jom0xgG/IQn0iBoCuZc91ls8hw0B4P0MViElmBJYAlag2WBGeiuBisCM9AirArMQLOwJmAELcJ6oIh9B9ZcuqYDlmPacEp8l264vKs9sDT+oNhk1u2At0fLJuSukvt8xXmIbE3O57v2OYxzF9lGufzJ4yEPkR0qpxn9ufZpkh0r1yQZbDJKdqrcIMlg0yZZfz1ZTjNIUtMgW0qznGaUpGag7GA5zSRJTUV2tJzmLpIaEbsCXv3w17ludQ/uP7zOEz9BpQwAAAAAAElFTkSuQmCC);
}

.login-dropdown-item {  
	padding: 5px 16px;
	color: #1a1a40;
	cursor: pointer;
	position: relative;
	display: block;
	border: none;
	background-color: transparent;
	width:100%;
	font-size: 15px;
	text-align: left;
	font-family:regularFont;
}

.login-dropdown-item:hover{
	background-color: #EAF3FF;
	color: #1a1a40;
	cursor: pointer;
}

.login-title h1 { font-size:27px; }

.login-welcome {
	padding-top: 15px;
	font-size: 18px;
}

.login-section {
	min-height: 30vh;
	padding-left: 30px;
	padding-right: 30px;
}

.introduction-section {
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 20px;
	background-color:#ffffff;
	width: 100%;
}

.border-separator {
	padding-top: 30px;
	border-top: 1.5px solid #dde1e4;
}

.video-container {
	width: 100%;
	max-width: 750px;
	position: relative;
}

video {
	width: 100%;
	display: block;
}

.controls {
	background-color: rgb(55 79 89 / 86%);
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 10px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 9999;
}

.btn {
	background: none;
	border: none;
	color: white;
	font-size: 16px;
	margin: 0 10px;
	cursor: pointer;
}

.progress {
	flex: 1;
	height: 6px;
	background: #444;
	margin: 0 10px;
	cursor: pointer;
	border-radius: 4px;
	position: relative;
}

.progress-filled {
	width: 0%;
	height: 100%;
	background-color:rgb(255 255 255 / 75%);
	border-radius: 4px;
}

.unmute {
	width: 20px;
	height: 20px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAiCAYAAAFaYqudAAAACXBIWXMAABYlAAAWJQFJUiTwAAAChElEQVRYhc1Y3ZniMAwc8VFAtgM6uNAB28F2cHsdcB2wFaQE6IASoIPQAXQQOph7iJxVjGPHCct384J/pLEsS7YCEANJ6m8lrgMAItLrW8nPKCVINq69tKquvegRtzh3s2ahx9UHNxESWJC80sBX6gyKbwggWWQtPSS8Ty6TZCT5GdqUay9j2iTpjja5a4fRgnaZfcxGX7jM9WPtj8lIxV6Ax2QHNz3WXLP9MjSYhNH5cAFI8qjTdRaZR7jrSNr+lcwIiADuocFFyskJrEVkTbICsAJwG5SklxT+lo2cQxniCREXMcJJMNaGr5VMsr0x8JSSXybIagDjfKOIZUqTIuN3NnWPRpBQnZ/0l4hctFmQPALtQ/AQHikiXXSrpC6OPzprMnBSnZP2Xdq5NKwmEVpD/P6cXD6HBucQbp5GSD1R6I3jDgjA4eHVyfDhzrR7/gxZkCQMyJ4Gtzz2juT3lXUXkXcgksv6xjeIZIxmSm/x6KGIyBuAS0xmEkhW6qf592HGoqFo2aY1f9aogmSdE2W5mJp4pQZU8k4fwVWRbNgWM/OOnAMv/1QP0pR3BrU1dGmEVwA+B7h+wb0XT4RLW43VSodLAA3JdxE5u5rxp9DzIMmtmWtoaiu28dx4+uUCwBGvw820CwA19TNWRO4A1p78Pru4nuNBB99T3tzJzs15j+cgWOiH8FIDqfGO9kPB4cvMr9AvRC4LAH9fYZzC3pl3tF83O6D7d8EPia/uZSa5AfAb/d05FJh2IZ9dGRGDJor/x8UfETlkrcb+NTE5SQzfKqDT6FFPB8mNn4lTDFSuvcpeOfabM8PQFf/HYsFBRG4isgbwBuAQEHl+MTkX6tWnHdU/gJRfxDKRalsAAAAASUVORK5CYII=);
	background-size: 17px auto;
	background-repeat: no-repeat;
	background-position:center; 
}

.mute{
	width: 20px;
	height: 20px;
	background-size: 17px auto;
	background-repeat: no-repeat;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAAhCAYAAAEzNLINAAAACXBIWXMAABYlAAAWJQFJUiTwAAACmUlEQVRYhb1Y7ZGjMAyVZ7YAroNcB1wHlJASUkJKSAcpge0gJXAdUAJ7FVDCux+I8BDyByS7mtkJxtLTsyxLZkVSApX5eTWRtCpR6pOOezYPWYcAxjgeaVWWZhISwNVEYX53tsowivzcJj3Rc/0cAzilV7RYtQblUbo4f3v5hVnbbaUMoKHJy4xqIyAOEgCc9ffk8o3E9C4i8sGKIYSAKaFqGgPAv9IQ9jLzQCaVijfGGNUcKfZs17kXtPWAYqBMxANsHPtK/zagAG46nEkAwGBBT9aYpFedzgADug+W7YeISAjhS6bC0JCvTn9rMvgjIl80/jsDhxDCnlg/D4wT0zuHqxiUAJrM/Cpc7xVCP2f0ypZm0uWRmt/LdODU0Hd8svYBKgDv3sUmqKMPxEo6puJbWVYZwDm1mthyAS0aKUAd1qznUWfp9L1bhXgMDVMOkA04ljOrhuafzyKmpHtBF5HfIvJLREYR6QF8ikg6J7GUqJhczSYAS+UZNkvWiUrpN9D2a2Quazw319ZhA+g4iOYhjiZ8zpCmOs8+Bpo8y6DUKgZVwyYxdzsEmnG43EOIdo8jDf8nBH7Pvx3AaV+xL3WySWlMB6xO2FSRRb5v3xOOO8fvnXRqmFvBHpIakI4xXyF8zpE5SHKIBSBHyEZnwNIFKuhXylGSMIfS85cjuLnTxlaKqXZno2vwO5oamTDWUU1+HXoXck9G0EGC35Q2JFWXd2KM+X4HSZYWep/EtHWDo3PJkSkmqcqHDojaNYTj3Sksdkv6fMMsav+5S0tOHliie4JfQ5ng1cwlvwSKxKw6JaOxs2Q8aSJuD5N9/vciJhG7WId6vagnyMYOTLYtRha6qh7vJmtbabze+bZeo2hx5EP7uwVOo/gPc9/Y/2/Yfo0AAAAASUVORK5CYII=);
	background-position:center; 
}

.pause {
	width: 20px;
	height: 20px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAwCAYAAAEUfAgNAAAACXBIWXMAABYlAAAWJQFJUiTwAAABMklEQVRYhe2ZXXKDMAyEV5ygvQFHSE8MN4QbbB9iOiD/yRHttB19Txl5vV5PwHYcAABJIkGSky4AwIQCziJIbiSX82c5RhQR+YnRv6jV5dx4JEvCS708jDmPV7hW2q51krOecan+V2Ydwjrn77TANqrPngnN8YycDJt6+1SMhGEY/grD9CbslfYPXTDpSS76nSQ511I09XqbU2SmPX1vcdhF5F0ZtvUjqw3JNwDZknbRx/IVhmEYhmH4TwzXQb8VJB+1422ph0mfRK3tMetM8mGN7fJnfggYYTGEc/l3d+UeetdW4brHgq7/dwYE+seMHre/dncTAb1EQC8R0EsE9BIBvURALxHQSwT0MqF+02nB0tflP+F55fqKyY7C9W6Be/z5/MtmYfvn4ZY08+hor/p/An0rz/BWfG5zAAAAAElFTkSuQmCC);
	background-size: 15px auto;
	background-repeat: no-repeat;
	background-color: transparent;
	border: none;
	color: white;
	font-size: 16px;
	margin: 0 10px;
	cursor: pointer;
}

.play {
	width: 20px;
	height: 20px;
	background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAwCAYAAAEUfAgNAAAACXBIWXMAABYlAAAWJQFJUiTwAAACNUlEQVRYheWY3XHCMBCE7zIUAB1AB5RAOiAdkA6SDkwFJBWEDqAD6IB0YHdgd7B5sAVC1r9k8Ey+N4y83pNPp5OJNDAAXH8wc+9iR6W7SC89PWaWLzZCkwCceo/HjZXWktD0f/pEjcao2XOjG2i6yTrQatJAJU+GyvJuKIBC/GPVBDAHsHM9W5sFzoG2G7RRd5bv7Djn0ZaUOpq8b0ZNaB1b4XFiGqFOUW+gadLlR59tb4YArDWZs3Z4N2NJR8EhRM/7vXQ0zDyzDfBdWYKp4n6eKqhSSuIfROEhO0l1OJjggjuMS8CB8W2HONzzDXPqOJI6bsUA2HUCNYBplIhG8KRL1BgxlTK3oKDILWhcrzZ80qYEcMnpUGbj0ostDjNmbnR/xK7lGrrWjCg4ZB0rWS9XPbwWi9wFdvF/KrbgLbZi63hl5nOOtLnrLFId9lZM7By+d3tLf/kFhuesOiEhGwuCjE/IW2N4Oizhxe0tBrF5lFgnOEW7HwMexyBf0Y0l9B1ybP4J5i4BaXhKmt5Ig7GUUHaTsRmUqdEdAcZqUOUHufJ2IIMyJ6ifREZmUKZE4Jkie8vgYE5EB8lw4bohe5OUwJGIPpm5ki+OyaDML7U9xO9YDQr2Yzf48EUSSjVmg1/MvMjZ96fSENE3MxfyxWcbrKgtLUfTgGcYPFNbQiqv0Q/a4uKb3oEM5Wu/MpoqMUQDm2jqgKGPALidwHwp8MhDFNpjou3gVMPjg97DALBESgecmT/DpqPW+x+RLAAAAABJRU5ErkJggg==);
	background-size: 15px auto;
	background-repeat: no-repeat;
	background-color: transparent;
	border: none;
	color: white;
	font-size: 16px;
	margin: 0 10px;
	cursor: pointer;
}

#volume {
	width: 100px;
	height: 4px;
	background-color: white;
	border-radius: 5px;
	outline: none;
	-webkit-appearance: none;
	margin: 10px 0;
}

/* WebKit (Chrome, Safari) */
#volume::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 16px;
	height: 16px;
	background: #1d71b5;
	border-radius: 50%;
	cursor: pointer;
	border: 1px solid #1d71b5;
	position: relative;
	top:0px;
}

/* Firefox */
#volume::-moz-range-thumb {
	width: 16px;
	height: 16px;
	background:#1d71b5;
	border-radius: 50%;
	cursor: pointer;
	border: 1px solid #aaa;
}

/* Firefox track */
#volume::-moz-range-track {
	background:rgba(255, 255, 255, 0.32);
	height: 6px;
	border-radius: 5px;
}

#time {
	color: #ffffff;
	font-size: 13px;
}

#fullscreen{
	height: 20px;
	width: 20px;
	background-repeat: no-repeat;
	background-size: 14px auto;
	background-position: center;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAAH7+Yj7AAAACXBIWXMAABYlAAAWJQFJUiTwAAAB30lEQVRYhe1Z0XXCMAw88TpAukG6QUboCO0G7gZ0ko7QEWADOkI3cDZwNrh+OIBJLJM4SUlfuS+wpbNkZEk2IFmRJFqQJMKBDETV6eGCz/2FRi4cU5fuoIhIVIGku7bgOINOfl2RGWUjY6wkTTBlLwRJFoGguyAZYN+BJDcD/G0GyCyKOZ05MwYwyjh7Ax1sB5DrhIPNVfwd5/PIFbZhfGVyGJLlTCYtCZ7PmZvAUS72Kz90J4KvjYi8ahYB+AyGqnDSJuK0VAiTga0RmoSLTtGp0qvFybYpnV467uzhY4SwAKBHREB+UIWuILRw9rO8KOEcZaE5HhszhYVkQSUZ37EGBEFeTuA4JgvzD49eWAKqjttvIlLHlEjuAMTreEaCNSmdHJe/EnO1kLQAygziJ21LumhD0masUW+QZxwAPC8kG6LUal4D4FtRagC8D929I9pd/IAWbL736M8psZR9qHPBoNtaNDHMjdUbGMsbjje4GNC3Gt2O0/y2HXfc8ecgwCnLv8BXib2I3ORxiP5m9gJfUfYiUmuXyd0NjNtF7HAbxGvjpEeWTETtWH0lWb2BqSeGFBr4hnXQYWqD3yIjdHJ3sABgRsgb5MY1/T8VVukLY3A5RbxtSrTnpxgsyeoHexPW44bsoTgAAAAASUVORK5CYII=);
}


@media all and (max-width:2000px){
	.img-background-left { max-height:unset; }
}


@media all and (max-width:1300px){
	.loglevel-container{ width:40%; }
	.customer-container { width:60%; }
}

@media all and (max-width:1025px){

	.logo-container {
		margin-bottom: 0;
		top: unset;
		bottom: 34px;
		left: 50%;
		transform: translateX(-50%);
	}

	.login-page { display: block; }

	.customer-container {
		width: 100%;
		min-height: auto;
		padding-bottom: 30px;
	}

	.loglevel-container {
		width: 100%;
		height: 540px;
		min-height:500px;
		max-height: 540px;
		min-width:unset;
	}

	.img-background-left{
		display: block;
		height: 100%;
		max-height: unset;
		width: 100%;
		object-fit: cover;
		background-position: 50% 100%;
	}

	.content-container { margin-top:50px; }

	.login-section { min-height: unset;}

	.login-group {
		margin-bottom: 34px;
		padding-top: 20px;
	}

	.login-title h1 {
		margin-bottom: 15px;
		margin-top: 15px;
	}

}

@media all and (max-width:700px){
	.loglevel-container { 
		height:350px;
		min-height: 350px;
		max-height: 350px;
	}

	.logo-container {
			bottom: 20px;
	}
} 

@media all and (max-width:568px){ 
	.login-group {
		text-align: center;
		width: 100%;
	}

	.login-group .big-btn {
		float: none;
		width: 100%;
	}

	.login-title h1 { font-size: 23px; }
	.border-separator { padding-top: 20px; }
	.introduction-section { padding-bottom: 20px; }

}