
hr {
    margin: 1em 0;
}

.nav a{
    color: black;
}

.signup-container{
    background-color: #f7f7f7;
    padding: 50px;
	margin: 0 auto;
}
.signup{
    background-color: white;
    padding: 40px;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
.login-header h1{
	font-size: 2rem;
	text-align: center;
	margin-bottom: 20px;
}
.login-header .subheadline{
	margin-bottom: 20px;
}
.explanation{
    padding: 50px;
    color: white;
    background-image: url('../img/auth/group.jpg');
}
.description{
    font-size: .8rem;
}
.descriptor{
    display: inline-block;
}
.descriptor ul{
    margin: 0;
    display: flex;
}
.descriptor li{
    display: inline-block;
    font-size: .7rem;
    text-align: center;
    /*margin: auto;*/
    flex-grow: 1;
}
.descriptor li:first-of-type{
    list-style-type: none;
    text-align: left;
}
.descriptor li:last-of-type{
    list-style-type: none;
    text-align: right;
    float: right;
}

.box-container{
    background-color: #f7f7f7;
    padding: 20px 50px;
}

@media screen and (max-width: 1024px) {
    .box-container{
        padding: 40px 10px;
    }
}

.box{
    background-color: white;
    border-radius: 10px;
    padding: 40px;
    margin: auto;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.button-fill {
    color: #5270b5;
    border: 0.5px solid #4591e8;
    background: transparent;
    padding: 0.5em 1.25em;
    border-radius: 2px;

    text-transform:uppercase;

    transition:
        color 0.15s ease-in-out,
        background 0.20s ease-in-out;
}

/*a.button-fill { color: #5270b5; }*/


.button-fill:hover {
    color: white;
    background: #4591e8;
}

.button-fill .button-text {
    letter-spacing: 0.0125em;
}

/* continues the Foundation inner shadow effect found on other input elements */
select:focus {
    border: 1px solid #8a8a8a;
    background-color: #fefefe;
    outline: none;
    box-shadow: 0 0 5px #cacaca;
    -webkit-transition: -webkit-box-shadow .5s,border-color .25s ease-in-out;
    transition: box-shadow .5s,border-color .25s ease-in-out;
} 


.text-link {
    display: inline-block;
    position: relative;
    text-decoration: none;
}

.text-link::before {
    background-color: #4591e8;
    content: '';
    height: 2px;
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    /*transition: width 0.2s ease-in-out;*/
    width:0;
}
.text-link:hover {
    
}

.text-link:hover::before {
    width: 100%;
}

button,
.button {
    font-family: Calibre, sans-serif;
    margin-left: 0.125em;
    margin-right: 0.125em;
    color: white;
    font-size: 14pt;
    border-radius: 0.25em;
    border: 1px solid #34afe4;
    background: #34afe4;
    background: -moz-linear-gradient(top, #34afe4 0%, #4591e8 100%);
    background: -webkit-linear-gradient(top, #34afe4 0%,#4591e8 100%);
    background: linear-gradient(to bottom, #34afe4 0%,#4591e8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#34afe4', endColorstr='#4591e8',GradientType=0 );
    /* foundation overrides */
    padding: 0.5em 0.75em;
}


button.secondary,
.button.secondary {
    background: transparent;
    color: #222;
    border-color: #ccc;
}