body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    margin: 0 auto;
    background-color: #FFF;
    color: #4B5A68;
}

/* Helvetica Neue Light Font Stack */
.hnl {
    font-family: "HelveticaNeueLight", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    font-stretch: normal;
}
/* Helvetica Neue Regular Font Stack */
.hnr {
    font-family: "HelveticaNeue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-stretch: normal;
}

.txtInput {
    font-size: 18px;
    color: #404041;
}

.rememberMeText {
    font-size: 14px;
    color: #929467;
    
}
.forgotPw {
    font-size: 14px;
    color: #15ABFF;
    float:right;
}


.copywrite {
    font-size: 11px;
    color: #929497;
    margin-left: 5px;
    vertical-align: text-top;
}
.privacy {
    font-size: 11px;
    color: #0067A6;
}

.pipe {
    color: #C3C3C3;
    font-size: 11px;
}

#wd_logo {
    width: 320px;
    height: 99px;
    background: url("../images/webfiles/assets_onboarding.png")  0 0 no-repeat transparent;
    margin-left: auto;
    margin-right: auto;
}

#wd_logo_wdcloud {
    width: 320px;
    height: 99px;
    background: url("../images/webfiles/assets_onboarding_wdcloud.png")  0 0 no-repeat transparent;
    margin-left: auto;
    margin-right: auto;
}

.content {
    max-width: 540px;
    min-width: 320px;
    margin: 90px auto 0;
}

.innercontent {
    min-height: 290px;
    padding-bottom: 10px;
    padding-top: 30px;
    padding-left: 90px;
    padding-right: 90px;
    /*border: 1px solid #84929B;*/
    background: #FFF;
    /*box-shadow: 0 2px 3px rgba(0,0,0,.2);*/
}

.leftAligned {
    float: left;
}
.rightAligned {
    float: right;
}

.btmA {
    display: block;
    padding-top: 20px;
    padding-bottom: 25px;
}

#serverError{
 margin-top: -10px;
}
.footer {
    width: 100%;
    height : 70px;
    padding: 20px 0 0 0;
    margin-top : 70px;
    margin-left: auto;
    margin-right: auto;
}

.footerImage {
   
}


#header_line {
    width: 960px;
    background: #9FC8DF;
    height: 2px;
    margin:  0 auto;
}
#footer_line {
    width: 960px;
    background: #DCDCDC;
    height: 1px;
    margin:  0 auto;
    margin-bottom: 30px;
}

.login {
    display: inline-block;
    width:100%;
    margin-top: 22px;
}

a {
    color: #15ABFF;
    text-decoration: none;
}

.footerContent {
    text-align: center;
    box-sizing: border-box;
}

.errorAlert{
    color: #EC1C24;
    padding: 5px 0 5px 0;
    
    font-style: italic;
    font-size: 14px;
    font-weight: 300;
    font-stretch: normal;
}

p {
    padding: 0 0 20px;
}

.button {
    display: inline-block;
    height: 44px;
    width: 100%;
    /*
    border-bottom: 1px solid #0067A6;
    background: #15ABFF;
    color: #FAFAFA;
    text-decoration: none;
    vertical-align: middle;
    text-align: center;
    */
    
    border-bottom: 1px solid #0067A6;
    background: #15ABFF;
    color: #FAFAFA;
    text-decoration: none;
    vertical-align: middle;
    text-align: center;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,.16);
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    cursor: pointer;    
}
.button:hover,
.button:active {
    background: #139AE6;
}

.button >.icon {
    display:inline-block;
    width: 30px;
    height: 34px;
    padding: 0;
    background: url("../images/webfiles/assets_onboarding.png")  -90px -177px no-repeat transparent;

}
.button .loginmessage {
    display: inline-block;
    padding-top: 12px;
    text-align: left;
    vertical-align: top;
}


input[type='checkbox']  {
    height: 15px;
    width:  15px;
}

input {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #DCDCDC;
    background: #FFF;
    color: #84929B;
    font-size: 18px;
    margin-bottom: 2px;
    box-sizing: border-box;
    
    -webkit-border-radius: 4px;            
    -moz-border-radius: 4px;            
    border-radius: 4px;    
}

.wdInput {
    width: 100%;
}

.innercontent.wdShared {
    padding-top: 36px;
    min-height: 228px;
}
#visible\.username {
    margin-top: 32px;
}
#visible\.username2 {
    margin-top: 40px;
}
#visible\.username2 > span {
    font-weight: bold;
}
#visible\.password {
    margin-top: 5px;
}

*::-webkit-input-placeholder {
    color: #C8C8C8;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: #C8C8C8;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: #C8C8C8;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: #C8C8C8;
}
input.error {
    border: 1px solid #EC1C24;
}

input[type="checkbox"] {
    display: none;
}
input[type="checkbox"] + label  {
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: -3px 4px 0 0;
    vertical-align: middle;
    background: url("../images/webfiles/assets_onboarding.png")  -494px -183px no-repeat transparent;
    cursor: pointer;
}
input[type="checkbox"]:checked + label  {
    background: url("../images/webfiles/assets_onboarding.png")  -590px -183px no-repeat transparent;
}

input[type="checkbox"]:not(:checked) + label:hover  {
    background: url("../images/webfiles/assets_onboarding.png")  -542px -183px no-repeat transparent;
}


#branding {
	position: absolute;
    z-index: 2;
    display: inline-block;
    margin: 15px 0 0 20px;
    cursor: default;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.white_logo {
    width: 152px;
    height: 28px;
    background: url("../images/svg/web-icon-logo-mycloud.svg") 0 0 no-repeat transparent;
    /*background-size: cover;*/
}

.spriteBg:after {
    overflow: hidden;
}

#container {
    /*position: absolute;*/
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    margin: 0;
    box-sizing: border-box;
}

#container > header {
    position: fixed;
    top: 0;
    z-index: 8;
    width: 100%;
    height: 60px;
    background-color: #15ABFF;
    color: #FFF;
    box-sizing: border-box;
}

#container > header > * {
    z-index: 9;
}  

/* Footer */
.main_foot {
    position: fixed;
    right: 0;
    bottom: -6px;
    left: 0;
    z-index: 2;
    width: 100%;
    padding: 0 0 10px;
    font-size: 10px;
    color: #BEBEBE;
    background: #FFF;
    text-align: center;
    box-sizing: border-box;
}
.main_foot > a {
    color: #83929B;
    text-decoration: none;
}
.main_foot > span:not(.wd_copyright) {
    position: relative;
    top: 3px;
    right: 0;
    display: inline-block;
    width: 1px;
    height: 12px;
    margin: 0 7px;
    background: #83929B;
}
.main_foot > .main_foot__status-service-link {
    margin-bottom: 1rem;
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    color: #15ABFF;
}

.wd_copyright {
    display: inline-block;
    margin-left: 15px;
}

.emailNotificationMessages {
	padding-top:10px;
}

/* Media Queries */

@media only screen
and (min-width : 1401px) {
    #container {
        position: relative;
        z-index: 0;
        margin: 0 auto;
    }
    #container,
    #container > header {
        width: 1400px;
    }
}

@media only screen and (max-width: 800px) {
    .content {
        margin: 30px auto;
    }
}

@media only screen and (max-width: 580px) {
    .header  img{
        width: auto;
        height: 27px;
        padding: 15px 0 10px 10px;
    }
    
    .innercontent {
        padding-left: 50px;
        padding-right: 50px;
    } 
        
    #header_line,
    #footer_line {
        width: 100%;
    }

    .content {
        max-width: 540px;
        min-width: 320px;
        /* margin: 20px auto; */
        background-color: #F6F6F6;
    }

    .footer p{
        max-width: 260px;
    }
}

@media only screen and (max-width: 400px) {
    .innercontent {
        padding-left: 20px;
        padding-right: 20px;
    } 
}