/*ESSENTIAL ----------------------------------------------------------------------------------------------------------*/

/*To stop the navbar from covering content, source: https://stackoverflow.com/questions/10336194/top-nav-bar-blocking-top-content-of-the-page*/
body {
    padding-top: 55px;
}


/*To make internal links selection better:*/

html {
    scroll-behavior: smooth;
}

/*Change text size depending on viewport, source: https://css-tricks.com/viewport-sized-typography/ */

h1 {
    font-size: 5.9vw;
}

h2 {
    font-size: 3.0vh;
}

p {
    font-size: 2vmin;
}

/*FONTS --------------------------------------------------------------------------------------------------------------*/

/*Tags from google fonts

Josefin sans light:

font-family: 'Josefin Sans', sans-serif;
font-weight: 300;

Josefin sans regular:

font-family: 'Josefin Sans', sans-serif;
font-weight: 400;

Libre Franklin
font-family: 'Libre Franklin', sans-serif;
font-weight: 800;
*/


/*NAVBAR -------------------------------------------------------------------------------------------------------------*/

/*Structure --*/

.nav-item-spacing {
    margin-left: 30px;
    margin-right: 30px;
}

.vertical-center {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

/*Colors --*/

.background-black {
    background-color: black;
}

.nav-link-custom {
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 800;

    font-size: 1vw;
}

@media (max-width: 768px) {
    .nav-link-custom {
        font-family: 'Libre Franklin', sans-serif;
        font-weight: 800;

        font-size: 3vw;
    }
}

/*HOME-Logo animation ------------------------------------------------------------------------------------------------*/

/*Background --*/

/*
.background-black {
    background: black;
}
*/

/*Structure --*/


.screen-height {
    height: 100vh;
}

.top-logo {
    height: 13vh;
}

@media (max-width: 768px) {
    .top-logo {
        height: 30vh;
    }
}

#animation {
    animation: animation 2s;
}

@keyframes animation {
    from {
        transform: translateY(60vh);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 100%;
    }
}

/*CURRICULUM ---------------------------------------------------------------------------------------------------------*/

/*Background --*/

/*
.background-black {
    background: black;
}
*/

/*Structure --*/

.screen-height-curriculum {
    height: 100vh;
}

@media (max-width: 768px) {
    .screen-height-curriculum {
        height: 110vh;
    }
}


.cur-buffer-mid {
    height: 10vh;
}

@media (max-width: 768px) {
    .cur-buffer-mid {
        height: 6vh;
    }
}

.cur-buffer-top {
    height: 8vh;
}

/*Text --*/

.home-cur-text {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 400;

    color: white;

    text-align: center;
}

/*Button --*/

.link-btn {
    border-style: solid;
    border-width: thick;
    border-color: white;

    background-color: black;

    font-family: 'Libre Franklin', sans-serif;
    font-weight: 800;
}

/*MY WORK ------------------------------------------------------------------------------------------------------------*/

/*Structure --*/

.work-buffer {
    height: 10vh;
}

/*Text --*/

.work-text-title {
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 800;
    color: black;

    font-size: 60pt;
}

.work-text-red {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 400;
    color: red;

    font-size: 36pt;
}

.work-text-normal {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 300;
    color: black;

    font-size: 24pt;
}

@media (max-width: 768px) {
    .work-text-title {
        font-family: 'Libre Franklin', sans-serif;
        font-weight: 800;
        color: black;

        font-size: 42pt;
    }

    .work-text-red {
        font-family: 'Josefin Sans', sans-serif;
        font-weight: 400;
        color: red;

        font-size: 24pt;
    }

    .work-text-normal {
        font-family: 'Josefin Sans', sans-serif;
        font-weight: 300;
        color: black;

        font-size: 18pt;
    }
}

/*Button --*/

.link-btn-light {
    border-style: solid;
    border-width: thick;
    border-color: black;

    background-color: white;

    font-family: 'Libre Franklin', sans-serif;
    font-weight: 800;
}

/*INFO ---------------------------------------------------------------------------------------------------------------*/

/*Structure --*/

.info-buffer {
    height: 10vh;
}

.info-buffer-button {
    height: 15vh;
}

/*Text --*/

/*
.work-text-title {
    font-family: 'Libre Franklin', sans-serif;
    font-weight: 800;
    color: black;

    font-size: 60pt;
}
 */

.info-text-title {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 400;
    color: black;

    font-size: 36pt;
}

.info-text-red {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 400;
    color: red;

    font-size: 24pt;
}

.info-text-normal {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 300;
    color: black;

    font-size: 24pt;
}

@media (max-width: 768px) {
    .info-text-title {
        font-family: 'Josefin Sans', sans-serif;
        font-weight: 400;
        color: black;

        font-size: 18pt;
    }

    .info-text-red {
        font-family: 'Josefin Sans', sans-serif;
        font-weight: 400;
        color: red;

        font-size: 3vmin;
    }

    .info-text-normal {
        font-family: 'Josefin Sans', sans-serif;
        font-weight: 300;
        color: black;

        font-size: 4vmin;
    }
}