input[type=text],input[type=password]{
border:none;
border-bottom-color : #C0C0C0;
border-bottom-style : solid;
border-bottom-width : 0.1vh;
height:4vh;
font-size:1vw;
width:100%;
color:#808080;
background-color:transparent;
margin-top:0;
margin-bottom:0;
box-shadow:0px 0px 0px 0px;
padding: 0.2vw 0.5vw 0.2vw 0.5vw;
}

body {                  
    width: 100%;
    height: 100%;    
    background-color: white;
    overflow: hidden;
}
html,
body {
	padding: 0;
	margin: 0;
	height: 100%;
}
html,
body,
* {
	box-sizing: border-box;
}
label{
font-size:1.1vw;
color:#B0B0B0;
/*font-weight:600;*/
}
a {
    color:#B0B0B0;
    font-size:1vw;
}
select {
    /*width: 12em;*/
    width: 100%;    
    /*height: 2%;*/    
    cursor:pointer;
    color:#808080;
    /*font-size:16px;*/
    font-size:1.1vw;
    /*margin-top:0.5em;*/
    /*margin-left:1em;*/    
    border:none;
    border-color : #808080;
    background-color:transparent;
    font-weight:600;
    margin-top:3vh;    
    /*background-color:#0c3451;*/
}
    select::-ms-expand {
        width: 10px;
        height: 10px;
        border: none;
        /*color:white;*/
        background-color: transparent;
    }
.dbdrpdwn {    
    text-decoration:none;
    /*font-size:16px;*/
     font-size: 1.5vw;
}
.signinbox {
    padding: 0.5vh;
    /*height: 25px;*/
    /*position: relative;*/
    /*left: 0;*/
    /*outline: none;*/
    /*border: 1px solid #cdcdcd;*/
    border:none;
    background-color:#0c3451;
    color:white;
    border-bottom:solid 1px white; /*rgba(0,0,0,.15);*/.imglogowidth
    /*background-color: white;*/
    /*font-size: small;*/
    font-size: 1vw;
    margin-right: 1vw;
    /*font-family: Open Sans;*/
    /*height:50%;*/
    /*border-radius: 0.15%;*/
}
.margnrt1 {
    margin-right: 1vw;
}
.margntp1 {
    margin-top: 2vh;
}

button {
    background-color: #D8D8D8; 
    border: none; /*solid 1px #000000;*/
    /*border-radius: 2px;*/
    color: black;
    position: relative;
    /*height: 32px;*/
    height:4vh;
    /*margin-top:0.1vw;*/
    /*padding: 0.5vw;*/
    /*min-width: 70px;*/
    /*padding: 0 16px;*/
    display: inline-block;
    /*font-size: 14px;*/
    /*font-family: Roboto;
    font-size: 0.8vw;*/
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0;
    overflow: hidden;    
    /*margin-top: 0.5vh;*/
    margin-right:1vh;         
    cursor: pointer;
    text-decoration: none;
    text-align: center;    
}
.hrmnybtn {
    background-color: #f78f1e; /*#0c3451;*/ /*maroon;*/  
    border  :none;
    color: white;
    margin-right:0vh;
    /*font-weight:bold;*/
}

.signinmaindiv {
    width: 100%;
    height:100%;            
    background-color:#FFFFFF;
    box-shadow:1px 1px 1px 2px rgba(0,0,0,0.2);
}
.signinheader {  
    display:table;  
    background-color: #0c3451;          
    width:100%;       
    height: 6vh;
    padding-left:0.5vh;
    padding-right:0.5vh;    
    box-shadow:0px 0px 10px 3px rgba(0,0,0,0.2); 
}
.signinbg {
    background-color:lightgrey;            
    margin:0;       
}
.signincontent {
    /*display: inline-flex;*/
    /*position:fixed;*/
    /*width: 100%;*/
    height: 90vh;
    width:100%;    
    /*margin-left:1%;*/
    /*margin-top: .2%;*/
    background-color: white;    
}
.height3 {
    height: 2%;
}
.height48 {
    height: 48%;
}
.height50 {
    height: 45%;
}
.height20 {
    height: 20vh;
}
.height15 {
    height: 15vh;
}
.height52 {
    height: 52%;
}
.xlargefontclass {    
    font-size:x-large;    
}

/* START OF STYLES FOR PROGRESS BAR */
.progressbarbody {
	width: 100vw;
	height: 100vh;
	background-color: rgba(255,255,255,.5);
	z-index: 10000;
	position: fixed;
	top:0px;
}

.progressbarstyle {
	/*width: 2.5rem;*/
	/*width: 75px;
	height: 75px;*/
    /*comment below two lines for progressbar stretched other logos*/
	/*width: 5.5vw;
	height: 11.5vh;*/
    height:100%;
	position: fixed; /*it can be fixed too*/
	left: 0;
	right: 0;
	/*top: 0;
	bottom: 0;*/
	margin: auto;
	/*this to solve "the content will not be cut when the window is smaller than the content": */
	max-width: 100%;
	max-height: 100%;
	overflow: auto;
}

/* New Styles */
.subDivProgress {	
	/*width: 60px;
	height: 5px;*/
	width: 4vw;
	height: 0.6vh;
	background-color: #0c3451; /*#D0D0D0;*/
	position: relative;
	animation-timing-function: ease-in;
	animation: progressbar 2s infinite;
	animation-direction: normal;  
}
/* Standard syntax */
@keyframes progressbar {
	0%   {left:0px; top:0px;}
	100%  {left:90%; top:0px;}
}
.mainDivProgress {
	/*margin-top: 10%;*/
	position:fixed;
	top: 57.5vh;
	left: 30vw;
	width: 40vw;
	background-color: #D0D0D0; /*#f0f5f5; ;*/
}
/* END OF STYLES FOR PROGRESS BAR */

/*.divrightheader {        
    float: right;
    display: inline-flex;    
}*/
/*.rblfbkg {
    background-color: lightgrey;
    padding: 1vw;
}*/
/*.textcenteralign {
    text-align: center;
}*/

/*.paddinglft12 {      
    display: inline-flex;
    width: 100%;
}*/
.paddinglft6 {
    padding-left: 6%;
}
.greycolorfont {
    color: #A0A0A0;
}
.ltgreycolorfont {
    color: #d8d8d8;
}
.whitecolorfont {
    color: #FFFFFF;
}
.blackcolorfont {
    color: #000000;
}
.margintop3 {
    margin-top: 3%;
    margin-left:5vh;
}
.margintop1 {
    margin-top: 0.5%;
}
.paddingtop15 {
    padding-top: 15%;
}
.margintop6 {
    margin-top: 6%;
}
.margnlft2 {
    margin-left: 2%;
}
.lstloginmargin {
    margin-left: 0.2vw;
}
.divImglogo {
    padding: 0.5vw 0.5vw 0.5vw 0vw;
    float: left;
}
.imglogowidth {    
    width: 1.5vw;
}
.lbldesc {    
     font-size: 1.1vw;
    font-weight: bold;
}
.lbltitle {
    font-size: 3vw;
    font-weight: bold;
}
.titlefont {
    color: #0c3451;    
}
/*.divtitle {
    text-align: center;    
    margin-top: 3vh;    
    margin-left: 14vw;
    width: 50vw;    
    display: inline-flex;
}*/
/*.divsubtitle {
    background-color: #0c3451;            
    padding: 1vw;
}*/
/*.lblwlcme {    
    font-size: 1.5vw;
    font-weight: bold;
}*/
.divmaindesc {
    width: 100%;
    text-align: center;
    padding-top: 2%;
}
.lblmaindesc {
    font-weight: bold;
    font-size: 1vw;
    color: #f1f1f1;
}

.statscountwidth {
    width: 30%;
}

.statsnamewidth {
    width: 70%;
}
.lblstats {       
     font-size: 0.9vw;
     font-weight:600;
    color: #f1f1f1;
}
.divContent {
    left: 9vh;
    top: 5vh;
    width: 25vw;
    position: absolute;
}

.divStatistics {
    left: 35vw;
    top: 15vh;
    width: 1vw;
    position: absolute;
}
#divcontent {
    display: inline-block;
    position: absolute;    
    left:1.5vw;      
    color: #f1f1f1;    
    padding: 1vw;
}

#divStatistics {
    display: inline-block;
    position: absolute;    
    top:2vh;
    left:1.5vw; 
    color: #f1f1f1;    
    width: 20vw;
    padding: 1vw;
}

#divStats {
    top: 2vh;
}
.heightwidth100 {
    width: 100%;
    height: 100%;
}

.divDivTime {
    padding-left: 2%;
    left: 0px;
    width: 40%;
    height: 12%;
    bottom: 15%;
    position: absolute;
}
.divTime {
    font-size: 7vw;
    color: #FFFFFF;
    font-weight: 200;
}
.divDivDay {
    padding-left: 2%;
    height: 50%;
    color: #FFFFFF;
    left: 0px;
    width: 70%;
    height: 12%;
    bottom: 0%;
    position: absolute;
}
.divDay {
    color: #FFFFFF;
    font-size: 4vw;
    font-weight: 200;
}

.divDivAppName {
    padding-left: 2%;
    height: 50%;
    color: #FFFFFF;
    left: 0px;
    width: 70%;
    height: 8%;
    bottom: 15%;
    position: absolute;
}
.divAppName {
    color: #FFFFFF;
    font-size: 3vw;
     font-weight: bold;
    font-weight: 200;
    font-family: 'Segoe UI Lucid';
  
}

.fullheight {
    height: 100%;
}
.clientlogowidth {
    width: 15vw;
    height:15vh;
}
/*.licensemsg {
    display: inline-flex;
    margin-left: 30%;
    width: 20vw;
}*/

/*.progressbarlocation {
    margin-top: 30%;
    margin-left: 35%;
}*/

.eventsfntsize {
    font-size: 0.8vw;
}
.divRememberMe {
    margin-top: 0.4vh;
    /*margin-left: 0.2vw;*/
}
.margntpsigninbtn {
    margin-top: 0.5vh;
}
.iptRememberwidth {
    width: 0.8vw;
}
.divForgotPwd {
    margin-top: 1vh;
}
.licenseagree{
    font-size: 1.2vw;
    font-family: Open Sans;
}
.licensepara{
    font-size: 1vw;
    font-family: Open Sans;
}
.licensesubtext{
    font-size: 1.1vw;
    font-family: Open Sans;
}

.d-menu {
  text-align: left;
  background: #ffffff;  
  list-style: none inside none;
  position:absolute;
  bottom:0vh;
  height:80%;
  text-transform:uppercase;
  right:28.5vw;
  cursor:pointer;
  padding: 0vw;
  width: 18vw;      
  border-collapse: separate;
  display: none;
  z-index: 100000;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2);
}

/*#ListEle {
    padding: 1vh 2vh 1vh 2vh;    
    border-bottom: solid 0.1vh #f0f0f0;
    color: #303030;    
    font-size: 0.8vw;
    font-weight: 600;
}

#ListEle:hover {
    background-color:#E8E8E8;
}*/


.circle {
  height: 1.6vh;
  width: 1.6vh;
  background-color: #ee7600;
  border-radius: 50%;
  /*margin-top:.5vh;*/
}
.heightwidth1vw {
    height: 1vw;
    width: 1vw;
}
.imgDivContent {
    position: absolute;
    top: 2.6vh;
}
.imgDivStatistics {
    position: absolute;
    top: 4.6vh;
}
.divSignInPanelClass {
    left: 65vw;
    border-radius: 2vh;
    top: 15vh;
    width: 28vw;
    height: 70vh;
    position: fixed;
    opacity:0.8;
    z-index: 10000;
    background-color: #FFFFFF;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
    padding-bottom: 0.3vw;
}
.divDivSignInPanelClass {
    width: 100%;
    height: 100%;
    z-index: 1000;
}
.divTopSignInPanel {
    width: 100%;
    height: 27%;
    text-align: center;
    padding: 0vw 3vw 0vw 3vw;
    border-bottom: solid 0.1vh #F0F0F0;    
}
.imageHarmonyLogo {
    width: 5vw;
}
.labelHamrony {
    margin-left: 1vh;
    font-size: 2vw;
    font-weight: 700;
    color: #0A557F;
    text-transform:uppercase;
}
.divBuildCopyrightLabel {       
    padding:0.3vw 1vw 0vw 1vw;
    /*float: right;
    margin-right: 3.3vw;*/
}
.buildCopyrightLabel {
    font-size: 0.7vw;
    font-weight: 400;    
}

.divTopInputSignInPanel {
    width: 100%;
    height: 31%;
    margin-top: 2vh;
    padding: 0vw 2.5vw;
}

.divLabelWelcome {
    width: 100%;
    text-align: center;
}
.labelWelcome {
    font-size: 1.5vw;
    font-weight: 400;
    color: #808080;
}
.divDivUserNameEntry {
    width: 100%;
    margin-top: 3vh;
}
.divInputUserNameEntry {
}
.inputTextLoginName {
    font-size: 1.3vw !important;
}
.divUserNameDisplay {
    width: 100%;
    text-align: center;
    margin-top: 0.5vh;
}
.labelUserName {
    font-size: 1.7vw;
    color: #ee7600;
    font-weight: 400;
}
.divLabelNotificationCount {
    margin-left: 1vh;
}
.labelNotificationsCount {
    font-size: 0.8vw;
}
.labelLastLogin {
    font-size: 0.8vw;    
}
.labelLastLoginColor {
    font-size: 0.8vw;
    color: #ee7600;
}
.divPassword {
    width: 100%;
    margin-top: 3vh;
}
.divInputPassword {
}
.inputTextPassword {
    font-size: 1.3vw !important;
}
.divBottomButtonsSignInPanel {
    width: 100%;
    height: 12%;
    padding: 0.5vw 2.5vw;
    border-bottom: solid 0.1vh #F0F0F0; 
    /*margin-top: 2vh;*/
}
.divDivLoginBtn {
    width: 28%;
    float: right;
}
.divLoginBtn {
}
.divRememberMeLabel {
    width: 30%;
    float: right;
    margin-top: 1vh;
    text-align: right;
}
.rememberMeLabel {
    font-size: 0.8vw;
    color: #808080;
    /*font-weight: 600;*/
    margin-left: 2vw;
}
.divChangeUserLabel {
    width: 30%;
    float: right;
    margin-top: 1vh;
    text-align: right;
}
.changeUserLabel {
    font-size: 0.8vw;
    color: #808080;
    font-weight: 200;
    margin-left: 2vw;
}
.divBottomImagesSignInPanel {
    width: 100%;
    height: 10%; 
    /*margin-top: 2vh;*/
}
.divBottomImageLeftSignInPanel {
    width: 50%;
    height: 100%;
    float: left;
    display: inline-block;
}
.divLicensedToLabel {
    text-align: center;
    padding-top: 1vh;
}
.licensedToLabel {
    font-size: 0.9vw;
}
.divClientImage {
    width: 80%;
    padding-left: 5vh;
    height: 100%;
}
.divBottomImageRightSignInPanel {
    width: 50%;
    height: 100%;
    padding-right: 5vh;
    margin-top: 3.6vh;
    float: right;
}
.divHarmonyImageRightSignInPanel {
    width: 80%;
}
.divBottomSignInPanel {
    width: 100%;
    margin-top: 7vh;
}
.divDivBottomSignInPanel {
    width: 100%;
    display: inline-flex;
}
.divCopyrightLabel {
    width: 75%;
    padding-left: 2vh;
}
.copyrightLabel {
    font-size: 0.8vw;
    color: #808080;
}
.divHelpaTag {
    width: 10%;
}
.helpaTag {
    font-size: 0.7vw;
    text-decoration: none;
}
.divTermsaTag {
    width: 15%;
    text-align: left;
}
.termsaTag {
    font-size: 0.7vw;
    text-decoration: none;
}
/*#divSignInPanel {
    content: "";
    background-image: url(../Images/G4-LOGO-256X256.png);
    background-repeat:no-repeat;    
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
}*/

input:hover {
    box-shadow: 0 0 0 0;
}

@font-face {
    font-family: Algerian;
    src: url(fonts/ALGER.woff);
}
@font-face {
    font-family: 'Lucid';
    src: url(fonts/LBRITE.woff);
}
@font-face {
    font-family: 'Segoe UI Light';
    src: url(fonts/segoe-ui-webfont.woff);
}
@font-face {
    font-family: Calibri;
    src: url(fonts/calibri.woff);
}

.CalibriFont {
    font-family: Calibri;
}

button:hover {
box-shadow:0 1px 2px 0 rgba(255,255,255,.3), 0 1px 3px 1px rgba(255,255,255,.3);
}

.imageHarmonyLogoUnison {
    width: 9vw;
}