/*
© 2024 Kieran Davies

Colour Scheme:
- #FFFFFF (White)
- #000000 (Black)
- #0EA862 (Green)

Background:
- Gradient (Green to Black) at -33 degrees

*/


html {
    height: 100%;
    box-sizing: border-box;
}


body {
    background: linear-gradient(-33deg, #000000, #0EA862);
    color: #FFFFFF;
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    min-height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

body.secret {
    /* Spin the body, disable user selection and hide the overflow */
    animation: spin 1s linear;

    user-select: none;
    overflow: hidden;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/*
Container:
- Width: 80%
- Margin: 0 auto
- Padding: 20px
- Centered vertically and horizontally
- All items inside container are centered
*/

.container {
    width: 80%;
    margin: 0 auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.logo {
    width: 25rem;
    user-select: none;
}

.tagline {
    text-transform: uppercase;
    margin: 0;
    
}

.location {
    text-transform: uppercase;
    margin: 0.1rem;
}

.social-links {
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-links a {
    color: #FFFFFF;
    text-decoration: none;
    margin: 0 1rem;

    height: 1rem;
    width: 1rem;
    border: 1px solid #FFFFFF;
    padding: 0.5rem;
    border-radius: 100%;

    /* Transition */
    transition: 0.3s;

    /* Make smaller */
    transform: scale(1);
}

.social-links a:hover {
    color: #0EA862;
    background: #FFFFFF;

    /* Transition */
    transition: 0.3s;

    /* Make larger */
    transform: scale(1.2);
}