@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700');

/* General settings */
html, body {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Poppins';
    background-color: #fff;    
    max-width: 100%;
    font-size: 0.8rem;
}

.padding {
    padding-top: 1.5rem;
}
.small-padding {
    padding-top: .5rem;
}
.small-margin {
    margin-top: 0.5rem;
}
.small-text {
    font-size: 0.7rem;
}

/* Navbar */
.navbar {
    padding: .8rem;
    background-color: black;
}
.navbar li {
    margin: 3px;
}

/* Login status */
.login_status {
    text-align: right;
    color: grey;
    font-style: italic;
}

/* Flash-box */
.flash-alert {
    position: relative;
    border-radius: 10px;
    padding: 1rem;
}

/* Lessons */
.lesson {
    margin: .2rem 0;
    padding: 1rem;
}
.lesson {
    background-color: blue;
    border-radius: 15px;
    font-weight: bold;
    color: #fff;
    font-size: 1.2rem;
}
.lesson a:link,
.lesson a:visited {
    text-decoration: none;
    color: #fff;
}
.lesson-subscribed {
    background-color: green;
}
.lesson-not-subscribed {
    background-color: orange;
}
.lesson-cancelled {
    background-color: gray;
}

/* Forms */
input[type="text"],
input[type="password"] {
    border-radius: 10px;
    border-style:solid;
    border:1px solid #aaa;
    font-family: monospace;
    padding: 10px;   
    width: 100%;
}

/* Strippenkaart */
.strip {
    padding: 1rem;
    margin: 0.2rem;
    border-radius: 10px;
    text-align: center;
}

.used {
    background-color: black;
    color: white;
    border: 1px solid black;
}

.reserved {
    background-color: gray;
    color: white;
    border: 1px solid gray;
}

.unused {
    background-color: white;
    color: black;
    border: 1px solid darkgray;
}

.strip-title {
    font-size: 1.2rem;
    text-align: center;
}
.new-credits-request {
    margin: 3rem 0 2rem 0;
}
#used_credits {
    display: none;
}

/* Social media */
.social-media {
    text-align: center;
}
.social-media a {
    font-size: 4em;
    padding: 0 2.8rem;
}

.fa-facebook {
    color: #3b5998;
}

.fa-instagram {
    color: #C13584;
}

.fa-facebook:hover,
.fa-instagram:hover {
    color: #d5d5d5;
}

/* Footer */
footer {
    margin: 1rem 0;
    padding: 1rem 0;
}

footer a:link,
footer a:visited {
    text-decoration: none;
    color: #ede4d5;
}

footer a:hover {
    color: darkgray;
}

.footer-column {
    background-color: #596d7e;
    color: #ede4d5;
    padding: 1rem 0;
    margin: .2rem 0;
}

/* Clear link */
.clear-link {
    color: red;
    font-weight: bold;
    text-decoration: none;
}