/* 2022 dark style css used for the new login experience  */

@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lato-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lato-v17-latin-regular.eot?##iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v17-latin-regular.svg##Lato') format('svg'); /* Legacy iOS */
}

body {font-family: 'Lato', sans-serif;
font-size: 16px;
font-style: normal;
font-variant: normal; 
font-weight: 400; 
line-height: 26px;
letter-spacing:1px;
text-transform: none;
color: #ffffff;}

/* custom scrollbar for Chrome, Edge, OS */
::-webkit-scrollbar {
  width: 16px;	
}

::-webkit-scrollbar-track {
  background-color:transparent; 
}

::-webkit-scrollbar-thumb {
  background-color: #EDECEC;
  border-radius: 16px;
  border: 4px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #444444;
}

/* Thin Scrollbar for Firefox*/
:root{
  scrollbar-color: rgb(237, 236, 236) rgb(68,68,68) !important;
  scrollbar-width: thin !important;
}

.divScroller {  
  overflow-y: auto;
  scrollbar-width: thin;
}
/* ----- */

/* login input classes for dark style */
.login-control {
box-sizing: border-box;
display:block; 
height:40px;
font-family: 'Lato', sans-serif;
font-size:16px;
font-weight: normal;
color:#ffffff; 
border:1px solid #ccc; 
border-radius:4px;
-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}

.login-control:focus{border-color:#0066CC; color:#fff;
outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 92, 199, .5);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0, 92, 199, .5);} /*102,175,233,.6*/

.login-control::-moz-placeholder{color:#fff; opacity:1;}
.login-control:-ms-input-placeholder{color:#fff;}
.login-control::-webkit-input-placeholder{color:#fff;}

input[type="text"]:focus{ color:#fff;}
/* ----- */

/* Login enter button */
.enter {
  background-color: #8F979D;/*7C9298 6C8288 5B6D73*/
  color: #fff;
  background-image: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,0.5) 60%);	
  /*border: 1px solid #B1B1B1;*/
	font-size:22px; 
	font-weight:500; 
	letter-spacing:4px;  
  text-align: center;
  text-decoration: none;  
  cursor: pointer;	
}

.enter:hover {
  background-color: #DCDCDC;
  cursor: pointer; 
  -webkit-transition: background 0.5s linear;
  -moz-transition: background 0.5s linear;
  -ms-transition: background 0.5s linear;
  -o-transition: background 0.5s linear;
  transition: background 0.5s linear;
}

/* ----- */

#OP-container {background-color:rgba(0,0,0,0.6); border-radius:6px;}

#OP-loginnotice { background-color: rgba(0,0,0,0.4); border-radius:4px; }
#OP-bottomlinks { background-color: rgba(0,0,0,0.4); border-radius:4px; }

.transparent	{background-color:transparent;}

/* --- text styles --- */
.heading24 {font-family: Lato; 
	font-size:24px; 
	font-style: normal; 
	font-variant: normal; 
	font-weight: 400; 
	line-height: 26px; 
	letter-spacing:1px;}

.heading20	{font-family: Lato; 
	font-size:20px; 
	font-style: normal; 
	font-variant: normal; 
	font-weight: 500; 
	line-height: 26px; 
	letter-spacing:1px;}

.attention	{	color:#C33;}
.italic 	{font-style:italic;}
.txt12px	{font-size:12px; letter-spacing: 1px; line-height: normal;}
.txt14px	{font-size:14px; letter-spacing: 1px; line-height: normal;}
.txt18px	{font-size:18px; letter-spacing: 1px; font-style: normal; font-variant: normal; font-weight: 400; line-height: normal; }
.txtdark	{color:#222222;}
.txtreq	{font-family: Lato; font-size:14px; font-weight:500; letter-spacing: 1px; line-height: normal;}

a.navlink:link	{color:#fff; text-decoration: none; cursor:pointer;}
a.navlink:visited	{color:#fff; text-decoration: none; cursor:pointer;}
a.navlink:active	{color:#ABABAB; text-decoration: underline; cursor:pointer;}
a.navlink:hover	{color:#ABABAB; text-decoration: underline; cursor:pointer;}

a.darklink:link	{color:#010101; text-decoration: none; cursor:pointer;}
a.darklink:visited	{color:#010101; text-decoration: none; cursor:pointer;}
a.darklink:active	{color:#878787; text-decoration: underline; cursor:pointer;}
a.darklink:hover	{color:#878787; text-decoration: underline; cursor:pointer;}

.bgcolorhover { background-color: #919AA4; background-color:rgb(145, 154, 164);  }