* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font: 3vh verdana;
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

.background {
    background: url("introBG.jpg");
    background-size: cover;
    background-attachment: fixed;
    background-position: right;
}

.aboutMe {
    display: flex;
    /*border: solid 1px #ffffff;*/
    justify-content: center;
    color: #ffffff;
    background-color: transparent;
    height: 190vh;
    padding: 10vh 8vw 0;
    margin-top: -100vh;
}

.animContainer {
    height: 100vh;
    /*/border: solid 1px #ff0000;*/
    position: sticky;
    top: 0;
    display: flex;
    z-index: 1000;
}

.animRight {
    margin-top: -100vh;
    justify-content: flex-end;
}

.animLeft {
    margin-top: -100vh;
}

.animCliffs {
    margin-top: -50vh;
    position: unset;
}

.animCliffsBlur{
    margin-top: -100vh;
    position: unset;
}

.move {
    position: absolute;
    min-height: 100%;
}

.treelineLeft {
}

.treelineRight {
}

.treelineLeftFast {
}

.cliffs{
    padding-right: 100vw;
    z-index: 2;
}

.meContainer {
    /*border: solid 1px #000000;*/
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 1px 1px;
    z-index: 1000;
    position: fixed;
}

.pfp {
    text-align: center;
    /*border: solid 1px #ffffff;*/
    width: 50vh;
    height: 50vh;
}

.headerText {
    /*border: solid 1px #ffffff;*/
    font-size: 8vh;
}

.subText {
    /*border: solid 1px #ffffff;*/
    font-size: 4vh;
    color: #808080;
}

.introContainer {
    position: sticky;
    top: 0;
    /*margin-top: 70vh;*/
    /*border: solid 1px #000000;*/
    color: #ffffff;
    padding-top: 70vh;
    padding-left: 2vw;
    padding-right: 2vw;
    display: flex;
    flex-direction: column;
    z-index: 1001;
}

.introInfo {
    height: 20vh;
    overflow-y: hidden;
}

.introButtons {
    display: flex;
    height: 10vh;
    /*border: solid 1px #ffffff;*/
}

.dropup {
}

    .dropup:hover .dropdown-menu{
        display: inline-block;
    }

.dropText {
    color: #ffffff;
    padding: 0 2vw;
    opacity: 0.5;
    border-radius: 5px;
    /*border: solid 1px #ffffff;*/
}

    .dropText:hover {
        background: #808080;
        opacity: 1;
    }

.dropdown-menu {
    background: #202020;
    opacity: 0.5;
    padding: 1vmin 1vmin;
    border-radius: 10px;
}

    .dropdown-menu:hover {
        opacity: 1;
    }

.btnIntro {
    display: flex;
    align-items: center;
    border-radius: 12px;
    height: 8vh;
    background: #202020;
    padding: 0 2vh;
    border: none;
    color: #ffffff;
    margin-bottom: 1vh;
}

    .btnIntro:hover {
        background: #ffffff;
        color: #202020;
        text-decoration: none;
    }

.introInfo {
    /*border: solid 1px #ffffff;*/
}

.headerContainer {
    margin-top: -100vh;
    position: sticky;
    top: 0;
    display: flex;
    justify-content: center;
    color: #ffffff;
    background: transparent;
    opacity: 0.9;
    padding: 2vh 8vw;
    height: 10vh;
    z-index: 1003;
}

.header {
    /*border: solid 1px #000000;*/
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 1px 1px;
}

.btn {
    display: flex;
    background: transparent;
    align-items: center;
    padding: 0 2vh;
    border: none;
    color: #ffffff;
}

    .btn:hover {
        color: #245F4D;
    }

.btnCarou {
    display: flex;
    background: white;
    align-items: center;
    padding: 2vh 2vh;
    border: none;
    border-radius: 12px;
    color: black;
    font: 24px verdana;
}

    .btnCarou:hover {
        color: white;
        background: black;
        text-decoration: none;
    }

.home {
    /*border: 1px solid #ffffff;*/
    display: flex;
}

.rightOfContainer {
    display: flex;
    justify-content: space-between;
}

.projects {
    /*border: 1px solid #ffffff;*/
    display: flex;
}

.carouselSect {
    /*height: 150vh;*/
    /*border: solid 1px #ffffff;*/
    background-color: #04060c;
    align-items: center;
    display: flex;
    flex-direction: column;
    padding-left: 8vw;
    padding-right: 8vw;
    margin-top: 60vh;
}

.hills{
    position: absolute;
    margin-top: -30vh;
    z-index: 1;
}

.projectContainer {
    /*border: solid 1px #000000;*/
    color: #ffffff;
    padding: 1px 1px;
    display: flex;
    flex-wrap: wrap;
    height: 70%;
    width: 100%;
    justify-content: space-evenly;
    z-index: 1001;
    position: relative;
}

.projCaption {
    max-width: 25vw;
    height: inherit;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.RTprojCaption {
    max-width: 15vw;
    height: inherit;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.projHeader {
    padding-top: 5vh;
    padding-left: 2vw;
}

.projMessage {
    padding: 1vh 2vw;
}

.projAndCap {
    border: 5px solid #ffffff;
    width: 70vw;
    height: 55vh;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 2vh;
}

.project {
    border: 1px solid #ffffff;
    width: 80vh;
    height: 45vh;
    margin-top: 5vh;
    margin-right: 2vw;
}

.RTproject {
    /*border: 1px solid #ffffff;*/
    width: 90vh;
    height: 45vh;
    margin-top: 5vh;
    margin-right: 2vw;
}

.gap {
    height: 10vh;
    box-shadow: 0 8px 8px #13191A;
    background-color: #04060c;
    position: relative;
    z-index: 1002;
}

.resume {
    /*border: 1px solid #ffffff;*/
    margin-left: 8vw;
    display: flex;
}

.otherStuff {
    /*background-color: #04060c;*/
    background: url("introInvertBG.jpg");
    background-size: cover;
    background-attachment: fixed;
    background-position: right;
    height: 125vh;
    flex-direction: column;
    /*border: solid 1px #ffffff;*/
    align-items: center;
    justify-content: center;
    display: flex;
    padding: 3vh 8vw;
    position: relative;
    z-index: 1001;
}

.resumeContainer {
    display: flex;
    margin: 1px 1px;
    width: 70vw;
    height: 100vh;
    /*border: 1px solid #000000;*/
    justify-content: center;
    color: #ffffff;
    padding-bottom: 5vh;
}

.credits {
    background: transparent;
    color: black;
    font-size: 10px;
    padding: 5px 5px;
}