@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
@font-face {
  font-family: 'Open Sans';    
  src:url(../../Fonts/OpenSans/OpenSans-Regular.ttf) format('truetype'), url(../../Fonts/OpenSans/OpenSans-Regular.woff) format('woff'),url(../../Fonts/OpenSans/OpenSans-Regular.eot) format('embedded-opentype');    
}
@font-face{
    font-family:'Open Sans Light';    
    src:url(../../Fonts/OpenSans/OpenSans-Light.ttf) format('truetype'), url(../../Fonts/OpenSans/OpenSans-Light.woff) format('woff'), url(../../Fonts/OpenSans/OpenSans-Light.eot) format('embedded-opentype');
}
@font-face{
    font-family:'Open Sans SemiBold';    
    src:url(../../Fonts/OpenSans/OpenSans-SemiBold.ttf) format('truetype'), url(../../Fonts/OpenSans/OpenSans-Semibold.woff) format('woff'), url(../../Fonts/OpenSans/OpenSans-Semibold.eot) format('embedded-opentype');
}
@font-face{
    font-family:'Open Sans Bold';    
    src:url(../../Fonts/OpenSans/OpenSans-Bold.ttf) format('truetype'),url(../../Fonts/OpenSans/OpenSans-Bold.woff) format('woff'), url(../../Fonts/OpenSans/OpenSans-Bold.eot) format('embedded-opentype');
}

body {
    /*font-family:'Open Sans';   */
    /*font-family:OpenSans;*/    
}
/*Login Page - style*/
/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .NDmainwrap {
        width: 1024px !important;
        /*margin-top:15px;*/
        position: absolute;
        float: none;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto auto;
        height: 100%;        
    }
    .NDmainwrapcontent
    {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto auto;
        height: fit-content;
        max-height:620px;
    }
    .NDmainleft {
        width: 600px !important;
    }
    .NDmainmiddle {
        width: 412px !important;
    }
}
/* Large devices (desktops, 992px and 1199px)*/
@media (min-width: 992px) and (max-width: 1199px) 
{  
    .NDmainwrap {
        width: 100% !important;
        /*position: absolute;
        float: none;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto auto;
        height: 100%;*/
    }
     .NDmainwrapcontent
    {
        /*position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto auto;
        height: fit-content;*/
    }
    .NDmainleft {
        width: 60% !important;
    }
    .NDmainmiddle {
        width: 40% !important;
    }
}
/*Medium devices (tablets, 768px and 991px)*/
@media (min-width: 768px) and (max-width: 991px) 
{    
    .NDmainwrap {
        width: 100% !important;
        /*position: absolute;
        float: none;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto auto;
        height: 100%;*/
    }
    .NDmainwrapcontent
    {
        /*position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto auto;
        height: fit-content;*/
    }
    .NDmainleft {
        width: 60% !important;
    }
    .NDmainmiddle {
        width: 40% !important;
    }
}
/*small devices (tablets & mobiles, 576px and 767px)*/
@media (min-width: 576px) and (max-width: 767px)
{ 
    .NDmainwrap {
        width: 100% !important;
    }
    .NDmainleft {
        width: 100%;
    }
    .NDmainmiddle {
        width: 100%;
    }
}
/*small devices (mobiles, 575px)*/
@media (max-width: 575px)
{
    .NDmainwrap {
        width: 100% !important;
    }
    .NDmainleft {
        width: 100%;
    }
    .NDmainmiddle {
        width: 100%;
    }
}
/* left side */
.NDmainleftimg
{
    position:relative;
}
.NDmainleftcontent
{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto auto;
    height:100px;
    text-align:center;
    width:100%;
}
.NDtext
{
    font-family:'Open Sans';
    /*font-family:OpenSans;*/
    text-align:left;
    margin:auto auto;
    text-transform:none;
    color:white;
    font-size: 15px;
    line-height: 22px;
    padding-right:5px;
    padding-left:5px;
    max-width:320px;
}
.NDcrossoftlogowhite
{
    margin-bottom:30px;
    max-width:140px;
}
/* right side */
.NDmainmiddleimg
{
    position:relative;
}
@media (min-width: 576px) and (max-width: 767px)
{
    .NDmainmiddleimg img {
        height:350px;
    }
}
@media (max-width: 575px) {
    .NDmainmiddleimg img {
        height:350px;
    }
}
.NDmainmiddlecustomerlogo
{
    position: absolute;
    width: 100%;
    height:28px;
    top: 0;
    left: 0;
    right: 0;
    margin: auto auto;
    z-index: 1;
    padding-top:10px;
    padding-bottom:10px;    
}
.NDmainmiddlecustomerlogo img
{
    margin-right:10px;
}
.NDmainmiddlecontent
{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto auto;
    z-index: 10;
    height: 230px;
}
.NDlogin
{
    font-family:'Open Sans';
    /*font-family:OpenSans;*/
}
.NDloginbox
{
    position:relative;
    line-height:0px;    
    margin-bottom:10px;    
}
.NDloginboxtitle
{
    font-family:'Open Sans';        
    /*font-family:OpenSans;*/
    font-size: 16px;
    line-height: 18px;
    color:#444546;
}
.NDlogininput
{
    border-width:0px 0px 1px 0px;
    border-color:#929395;
    position: relative;
    top: 0px;
    height: 24px;
    color:#aaaaaa;
    font-size:14px;
    line-height:14px;
    width:220px;
    padding: 8px 5px 8px 36px;
}
.NDlogininput:focus
{
    border-color:#2058a5;
    /*border-color:#004976;*/
    color:#7d9dc8;
    outline:none;
    outline-offset:unset;
}
.NDlogininput:focus::-webkit-input-placeholder { /* Edge */
  color:#7d9dc8;
}
.NDlogininput:focus:-ms-input-placeholder { /* Internet Explorer */
  color:#7d9dc8;
}
.NDlogininput:focus::placeholder {
  color:#7d9dc8;
}
.NDloginusericon
{
    position: absolute;
    width: 32px;
    height:100%;
    background:url(../../Images/Blue/NDLoginUserIcongray.png) left no-repeat;
    background-size: 20px auto;
    background-position: 4px 9px;        
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 10;  
    margin:auto auto;     
    text-align: right;
    font-size: 14px;
    line-height: 0px;
    color:#aaaaaa;
}
.NDloginusericon.active
{
    background:url(../../Images/Blue/NDLoginUserIconorange.png) left no-repeat;
    background-size: 20px auto;
    background-position: 4px 9px; 
    color:#7d9dc8;
}
.NDloginpasswordicon
{
    position: absolute;
    width: 32px;
    height:100%;
    background:url(../../Images/Blue/NDLoginPasswordIcongray.png) left no-repeat;
    background-size: 20px auto;
    background-position: 4px 9px;        
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 10;  
    margin:auto auto;     
    text-align: right;
    font-size: 14px;
    line-height: 0px;
    color:#aaaaaa;
}
.NDloginpasswordicon.active
{
    background:url(../../Images/Blue/NDLoginPasswordIconorange.png) left no-repeat;
    background-size: 20px auto;
    background-position: 4px 9px; 
    color:#7d9dc8;
}
.NDloginVline
{
    position: relative;
    top: 20px;
    bottom: 0;
    left: 3px;
    margin: auto auto;
    font-size: 15px;
    line-height: 0px;    
}
.NDforgotpassword
{
    color:#2058a5;
    /*color:#004976;*/
    text-decoration:underline;
    display:block;
}