html,
body {
     height: 100%;
}

body {
     display: -ms-flexbox;
     display: -webkit-box;
     display: flex;
     -ms-flex-align: center;
     -ms-flex-pack: center;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     padding-top: 40px;
     padding-bottom: 40px;
     background-color: #f5f5f5;
}

.form-signin {
     width: 100%;
     max-width: 330px;
     padding: 15px;
     margin: 0 auto;
}

.form-signin .checkbox {
     font-weight: 400;
}

.form-signin .form-control {
     position: relative;
     box-sizing: border-box;
     height: auto;
     padding: 10px;
     font-size: 16px;
}

.form-signin .form-control:focus {
     z-index: 2;
}

.form-signin input[type="email"] {
     margin-bottom: -1px;
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
     margin-bottom: 10px;
     border-top-left-radius: 0;
     border-top-right-radius: 0;
}

.abcRioButton {
     border-radius: 1px;
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .25);
     -moz-box-sizing: border-box;
     box-sizing: border-box;
     -webkit-transition: background-color .218s, border-color .218s, box-shadow .218s;
     transition: background-color .218s, border-color .218s, box-shadow .218s;
     -webkit-user-select: none;
     -webkit-appearance: none;
     background-color: #fff;
     background-image: none;
     color: #262626;
     cursor: pointer;
     outline: none;
     overflow: hidden;
     position: relative;
     text-align: center;
     vertical-align: middle;
     white-space: nowrap;
     width: auto
}

.abcRioButton:hover {
     box-shadow: 0 0 3px 3px rgba(66, 133, 244, .3)
}

.abcRioButtonBlue {
     border: none;
     color: #fff
}

.abcRioButtonBlue,
.abcRioButtonBlue:hover {
     background-color: #4285f4
}

.abcRioButtonBlue:active {
     background-color: #3367d6
}

.abcRioButtonLightBlue {
     background-color: #fff;
     color: #757575
}

.abcRioButtonLightBlue:active {
     background-color: #eee;
     color: #6d6d6d
}

.abcRioButtonIcon {
     float: left
}

.abcRioButtonBlue .abcRioButtonIcon {
     background-color: #fff;
     border-radius: 1px
}

.abcRioButtonSvg {
     display: block
}

.abcRioButtonContents {
     font-family: Roboto, arial, sans-serif;
     font-size: 14px;
     font-weight: 500;
     letter-spacing: .21px;
     margin-left: 6px;
     margin-right: 6px;
     vertical-align: top
}

.abcRioButtonContentWrapper {
     height: 100%;
     width: 100%
}

.abcRioButtonBlue .abcRioButtonContentWrapper {
     border: 1px solid transparent
}

.abcRioButtonErrorWrapper,
.abcRioButtonWorkingWrapper {
     display: none;
     height: 100%;
     width: 100%
}

.abcRioButtonErrorIcon,
.abcRioButtonWorkingIcon {
     margin-left: auto;
     margin-right: auto
}

.abcRioButtonErrorState,
.abcRioButtonWorkingState {
     border: 1px solid #d5d5d5;
     border: 1px solid rgba(0, 0, 0, .17);
     box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
     color: #262626
}

.abcRioButtonErrorState:hover,
.abcRioButtonWorkingState:hover {
     border: 1px solid #aaa;
     border: 1px solid rgba(0, 0, 0, .25);
     box-shadow: 0 1px 0 rgba(0, 0, 0, .1)
}

.abcRioButtonErrorState:active,
.abcRioButtonWorkingState:active {
     border: 1px solid #aaa;
     border: 1px solid rgba(0, 0, 0, .25);
     box-shadow: inset 0 1px 0 #ddd;
     color: #262626
}

.abcRioButtonWorkingState,
.abcRioButtonWorkingState:hover {
     background-color: #f5f5f5
}

.abcRioButtonWorkingState:active {
     background-color: #e5e5e5
}

.abcRioButtonErrorState,
.abcRioButtonErrorState:hover {
     background-color: #fff
}

.abcRioButtonErrorState:active {
     background-color: #e5e5e5
}

.abcRioButtonErrorState .abcRioButtonErrorWrapper,
.abcRioButtonWorkingState .abcRioButtonWorkingWrapper {
     display: block
}

.abcRioButtonErrorState .abcRioButtonContentWrapper,
.abcRioButtonErrorState .abcRioButtonWorkingWrapper,
.abcRioButtonWorkingState .abcRioButtonContentWrapper {
     display: none
}

.-webkit-keyframes abcRioButtonWorkingIconPathSpinKeyframes {
     0% {
          -webkit-transform: rotate(0deg)
     }
}

.goodbyeImage {
     /* max-height: 300px; */
     max-width: -webkit-fill-available;
     border-radius: 20px;
}