body{
    background-color:#e4e7e8;
}
.form-elegant
{
  width:40%;
  margin:6% auto auto auto;
}
.card {
  font-weight: 400;
  border-radius: .3rem;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  padding:0% 5% 5% 5%;
  box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
}

.card .card-body p{
  margin-bottom:2rem;
}

.card .card-body h3 {
    margin-bottom: 0;
    padding: 0;
}

.fa{
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

.card input[type=email], .card input[type=number], .card input[type=password], .card input[type=text],.card select{
   background-color: transparent;
   border: none;
   border-bottom: 1px solid #bdbdbd;
   border-radius: 0;
   outline: 0;
   height: 2.1rem;
   width: 100%;
   font-size: 1.7rem;
   box-shadow: none;
   box-sizing: content-box;
   -webkit-transition: all .3s;
   transition: all .3s;
}

.card input[type=password]:focus:not([readonly]), .card input[type=text]:focus:not([readonly]),.card select:focus:not([readonly]){
   border-bottom: 1px solid #4285f4;
   box-shadow: 0 1px 0 0 #4285f4;
}

.card input[type=password]:focus:not([readonly])+label, .card input[type=text]:focus:not([readonly])+label
{
   color: #4285f4;
}

.btn .fa,.card .card-body{
  position:relative;
}

.dark-grey-text{
    color:#4f4f4f!important;
}

.mb-5{
    margin:3rem 0!important;
}

.md-form,.md-form .btn{
    margin-bottom:2.5rem;
}

.md-form{
    position:relative;
}
.md-form label{
    -webkit-transition:.2s ease-out;
    transition:.2s ease-out;
    color:#757575;
    position:absolute;
    top: 0.4rem;
    left: 0;
    font-size: 1.6rem;
    cursor: text;
    font-weight: normal;
}
.md-form label.active{
    -webkit-transform:translateY(-140%);
    -ms-transform:translateY(-140%);
    transform:translateY(-140%);
    font-size:1.2rem;
}
.md-form .prefix{
    -webkit-transition:color .2s;
    transition:color .2s;
    position:absolute;
    width:3rem;
    font-size:2rem;
    padding-top:1rem;
}
.md-form .prefix~input, .md-form .prefix~select{
    margin-left:3rem;
    width:92%;
    width:-webkit-calc(100% - 3rem);
    width:calc(100% - 3rem);
}
.md-form .prefix~label{
    margin-left:3.2rem;
}
.md-form .prefix.active{
    color:#4285F4;
}

.grey-text{
    color:#9e9e9e!important;
}

.form-control{
    padding:.5rem 0 .6rem;
    font-size:1rem;
    line-height:1.5;
    background-color:transparent;
    background-image:none;
    border-radius:0;
    margin-top:.2rem;
    margin-bottom:1rem;
}

.form-control:focus{
    background:0 0;
    box-shadow:none;
}
.form-control:disabled,.form-control[readonly]{
    background-color:transparent;
    border-bottom:1px solid #bdbdbd;
}

.mb-3,.my-3{
    margin:2rem 0!important;
    }

.btn{
    font-size: 2rem;
    padding: 0.90rem 4.45rem;
    margin:6px;
    border-radius:2px;
    border:0;
    -webkit-transition:.2s ease-out;
    transition:.2s ease-out;
    white-space:normal!important;
    cursor:pointer;
    color:#fff;
}
.btn:active,.btn:active:focus,.btn:focus,.btn:hover{
    outline:0;
    color:#fff;
}

.btn-block{
  margin:inherit;
  color:#fff;
}

.form-elegant .font-small {
    font-size: 1.55rem;
}

.blue-text {
    color: #2196f3!important;
}

.justify-content-end {
   -webkit-box-pack: end!important;
   -ms-flex-pack: end!important;
   justify-content: flex-end!important;
}

.justify-content-center {
    -webkit-box-pack: center!important;
    -ms-flex-pack: center!important;
    justify-content: center!important;
}

.d-flex {
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: flex!important;
}

.form-elegant .z-depth-1a {
  -webkit-box-shadow: 0 2px 5px 0 rgba(55, 161, 255, 0.26), 0 4px 12px 0 rgba(121, 155, 254, 0.25);
  box-shadow: 0 2px 5px 0 rgba(55, 161, 255, 0.26), 0 4px 12px 0 rgba(121, 155, 254, 0.25); }

.form-elegant .z-depth-1-half,
.form-elegant .btn:hover {
  -webkit-box-shadow: 0 5px 11px 0 rgba(85, 182, 255, 0.28), 0 4px 15px 0 rgba(36, 133, 255, 0.15);
  box-shadow: 0 5px 11px 0 rgba(85, 182, 255, 0.28), 0 4px 15px 0 rgba(36, 133, 255, 0.15); }

.btn.blue-gradient {
    background: -webkit-linear-gradient(50deg,#45cafc,#303f9f)!important;
    background: linear-gradient(40deg,#45cafc,#303f9f)!important;
    -webkit-transition: .5s ease;
    transition: .5s ease;
}

.btn-rounded {
    border-radius: 10em;
}

.waves-effect {
    position: relative;
    cursor: pointer;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    z-index: 1;
}

.btn-block {
    margin: inherit;
}

.pt-2 {
    padding-top: .5rem!important;
}

.btn-white {
    background-color: #fff!important;
    color: #000!important;
}

.btn-red
{
    background-color: #DB2929!important;
    color: #fff!important;
    border-radius:15px;
    box-shadow:1px 4px 4px #8B1A1A;
}

.btn-red:hover
{
    box-shadow:1px 4px 4px #8B1A1A!important;
}

.main_div
{
    background: rgba(0, 0, 0, 0) url(../img/confetti.svg) repeat scroll center center;
    color: #969696;
}

.middle_image
{
     margin: auto;
    width: 445px;
    margin-bottom: 20px;
    margin-top: 8%;
}

.login_form
{
    padding-top: 20px;
    width: 70%;
    margin: auto;
}

.blue-btn
{
    font-size: 1.40rem;
    padding: 0.90rem 3rem;
}

.alert-heading {
    font-style: italic;
}

.alert-text {
    text-align: justify;
}

.create-new-account-btn {
    background-color: #346acf;
    border-color: #000000;
    color: #fff;
    border: 1px solid #063a9b;
}

.note {
    text-align: left;
    color: #3652ac !important;
    font-weight: bold;
    font-size: 1.6rem !important;
    font-style: italic;
    line-height: 1.4;
}

.note-footer {
    padding: 7px 17px 0px 8px;
}

.ft-user {
    font-weight: 700;
    font-size: 14px;
    height: 15px;
}

@media only screen and (max-width:992px){
    .md-form .prefix~input{
        width:86%;
        width:-webkit-calc(100% - 3rem);
        width:calc(100% - 3rem)
    }

   .form-elegant
   {
     width:60%;
   }
}
@media only screen and (max-width:600px){
    .md-form .prefix~input{
        width:80%;
        width:-webkit-calc(100% - 3rem);
        width:calc(100% - 3rem)
    }

   .form-elegant
   {
     width:85%;
   }
}

@media only screen and (max-width:500px){
    .login_form
    {
        padding-top: 20px;
        width: 100%;
        margin: auto;
    }
}


