.txt-center { text-align: center;}
.txt-left { text-align: left;}
.txt-right { text-align: right;}

.txt-sml { font-size: 1.2em;}

/* === Default === */
.hue-bg, .hue-bg {  background-color: #ED677A !important; }
.hue-bg-opa, .hue-bg-opa { background-color: rgba(237, 103, 122, 0.94) !important; }
.hue-bg-inv, .hue-bg-inv {  background-color: #2EB1D7 !important; }
.hue-bg-opa-inv, .hue-bg-opa-inv { background-color: rgba(46, 177, 215, 0.94) !important; }
.hue-txt, .hue-txt {  color: #FFF !important; }
.hue-txt-inv, .hue-txt-inv {  color: #000 !important; }
.hue-border, .hue-border { border-color: #ED677A !important; }
.hue-border-inv, .hue-border-inv { border-color: #2EB1D7 !important; }

/* === Hue 1 === */
.hue-1 .hue-bg, .hue-1.hue-bg {  background-color: #1988c9 !important; }
.hue-1 .hue-bg-opa, .hue-1.hue-bg-opa { background-color: rgba(25, 136, 201, 0.1) !important; }
.hue-1 .hue-bg-inv, .hue-1.hue-bg-inv {  background-color: #dc772c !important; }
.hue-1 .hue-bg-opa-inv, .hue-1.hue-bg-opa-inv { background-color: rgba(44, 67, 80, 0.94) !important; }
.hue-1 .hue-txt, .hue-1.hue-txt {  color: #fff !important; }
.hue-1 .hue-txt-inv, .hue-1.hue-txt-inv {  color: #000 !important; }
.hue-1 .hue-border, .hue-1.hue-border { border-color: #1988c9 !important; }
.hue-1 .hue-border-inv, .hue-1.hue-border-inv { border-color: #dc772c !important; }

.content-container {
    padding: 0 5%;
    margin: 5% auto 0 auto;
}

.switcherlink {
    font-size: 1.4rem;
}

.content-container .modifypw{
    font-size: 1.4rem;
}

.login-container {
    width: 100%;
    margin: 7% auto 0 auto;
    padding: 0;
}

.header-container {
    width: 100%;
}

.logo-container {
    width: 100%;
}

.logo-img img {
    width: auto;
    max-width: 90%;
    max-height: 110px;
    margin: 6% 0;
}

.small-ttlogo {
    display: none;
}

.form-container {
    margin: 20px 0 50px 0;
}

.form-container2 {
    margin: 20px 0 5px 0;
}

button {
    display: block;
    width: 100%;
    height: 50px;
    border: none;
    margin: 20px auto 0 auto;
    font-size: 2.4em;
    font-weight: 300;
    border-radius: 3px;
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2);
    box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2);
    transition: ease 0.4s box-shadow;
    webkit-transition: ease 0.4s webkit-box-shadow;
    cursor: pointer;
}

button:hover {
    -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3);
    box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3);

}

.modal-info {
    width: 80%;
    text-align: center;
    margin: 25px auto 0 auto;
}

.documents-container {
    display: block;
    width: 100%;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-top: 25px;
    padding-top: 2px;
    font-size: 1.6rem;
    line-height: 40px;
}

.privacypolicy {
    text-align: center;
    margin-top: 3%;
    font-size: 1.6rem;
}


/* Tablet ============== */
@media screen and (min-width: 600px) {
    .login-container {
        width: 70%;
        margin: 5% auto 0 auto;
        border: 1px solid #dddddd;
        border-radius: 3px;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16);
    }

    .small-ttlogo {
        display: block;
        position: relative;
    }

    .small-ttlogo img {
        height: 30px;
        position: absolute;
        top: 7px;
        right: 7px;
    }

    .edit-pw {
        margin-top: 10px;
    }

    .documents-container {
        width: 70%;
        margin: 40px auto 0 auto;
    }

}

 /* Desktop ============== */
 @media screen and (min-width: 992px) {

     .content-container {
         padding: 0;
         margin: 5% auto 0 auto;
         width: 600px;
     }

     .login-container {
        margin: 3% auto 0 auto;
         width: 84%;
     }

     .documents-container {
         margin: 40px auto 50px auto;
         width: 500px;
     }

 }