*, *:before, *:after {
  box-sizing: border-box;
}

html, body {
    height: 100%;
    width: 100%;
    overflow: hidden;
    background: url("../Images/LoginBG.jpg") no-repeat center center;
    background-size: cover;
}

.container {
    padding: 1px 0;
    height: 100%;
    width: 100%;
    color: #9b9b9b;
    font-family: "Comfortaa", "Helvetica", sans-serif;
}

/*.login {
    max-width: 280px;
    min-height: 100px;
    margin: 80px 30px 80px 0;
    background-color: rgba(255, 255, 255, 0.6);
    float: right !important;
    border-radius: 20px !important;
    padding-bottom: 20px;
}*/
.login {
    max-width: 280px;
    min-height: 100px;
    margin: 80px auto;
    background-color: rgba(219, 219, 219, 0.71);
    border-radius: 20px !important;
    padding-bottom: 20px;
}

.login-icon-field {
   width: 100%;
  /*background-color: red;*/
}

.login-icon {
  margin: 50px 65px;
}

.login-form {
  padding: 8px 20px 20px;
  height: 120px;
  width: 100%;
  /*background-color: green;*/
}

 

.username-row {
  position: relative;
  height: 40px;
  /*background-color: pink;*/
  border-bottom: 1px solid;
  margin-bottom: 10px;
}

.password-row {
  position: relative;
  height: 40px;
 /* background-color: grey;*/
  border-bottom: 1px solid;
}

.password-icon,
.user-icon {
  margin: 5px;
}

    .password-icon .key-path,
    .user-icon .user-path {
        fill: rgba(10,10,10,0);
        stroke: #043F57;
        stroke-width: 3.5;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-miterlimit: 10;
        stroke-dasharray: 300;
        stroke-dashoffset: 300;
        -webkit-animation: dash 3s .3s linear forwards;
        animation: dash 3s .3s linear forwards;
    }

.user-icon .user-path {
  -webkit-animation: dash 3s .8s linear forwards;
  animation: dash 3s .8s linear forwards;
}

input {
    position: absolute;
    width: 195px;
    height: 30px;
    margin: 5px 0;
    background: transparent;
    border: none;
    color: #043F57
}

input:focus,
button:focus {
  outline: none;
}

    input::-webkit-input-placeholder {
        color: #6d76c4;
    }

    input::-moz-placeholder {
        color: #6d76c4;
    }

.call-to-action {
  margin: 22px 0;
  height: 130px;
  width: 100%;
  /*background-color: blue;*/
}

button {
    display: block;
    width: 240px;
    height: 40px;
    padding: 0;
    margin: 10px 20px 10px;
    font-weight: 700;
    color: #fff;
    background-color: #043F57;
    border: none;
    border-radius: 20px;
    transition: background-color .10s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

button:hover {
  background-color: #26d69a;
}

button:active {
  background-color: #1eaa7a;
}

p {
  display: inline-block;
  width: 200px;
  margin: 0 40px;
  font-size: .8rem;
  color: rgba(255,255,255,.4);
  /*background-color: yellow;*/
}

p a {
  color: #fff;
}

label,
p a:hover {
  -webkit-cursor: pointer;
  cursor: pointer;
}

@-webkit-keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}


input.k-textbox , .k-input, .k-multiselect-wrap, .k-textbox > input, input.k-textbox, input.k-textbox:hover, textarea.k-textbox, textarea.k-textbox:hover {
    background-color: #fff0 !important;
    : #043F57 !important;
    border: 0 !important;
}
    .k-input, .k-multiselect-wrap, .k-textbox > input, input.k-textbox, input.k-textbox:hover, textarea.k-textbox, textarea.k-textbox:hover {
        background-color: #fff;
        color: #043F57 !important;
    }
.k-widget.k-tooltip-validation {
    border-color: #feca3f;
    background-color: #feca3f;
    color: #0b0800;
    display: none !important;
}
.k-button {
    -webkit-appearance: button !important;
    display: block !important;
    width: 240px !important;
    height: 40px !important;
    padding: 0 !important;
    margin: 10px 20px 10px !important;
    font-weight: 700 !important;
    color: #fff !important;
    background-color: #D76908 !important;
    border: none !important;
    border-radius: 0px !important;
    transition: background-color .10s ease-in-out !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}
h3 {
    margin-top:7px !important ; font-size :20px;
}
a {
    color: #043F57 !important;

}
.k-widget.k-notification.k-notification-error {
    background: url('../Images/error-icon.png') 5% 50% no-repeat, rgba(239, 0, 0, 0.65) none no-repeat scroll 0% 0% !important;
    border-radius: 20px !important;
    border-color: #E15151 !important;
    font-size: 1.2em !important;
    font-weight: bold !important;
    padding-left: 13px !important;
    background-origin: content-box, padding-box;
    background-clip: padding-box;
    padding: 3px 20px !important;
    margin-top: 10px !important;
}