#recruit{
    height: 100vh;
    width: 100%;
    display: grid;
    place-items: center;
    text-align: center;
}
.recruit-content > span{
    font-size: var(--heading2);
}
.recruit-content > h1{
    font-size: var(--hero);
    margin: 2rem 0 6rem;
    color: var(--green-1);
}
.recruit-content > a{
    font-size: var(--heading3);
    background-color: var(--green-1);
    padding: var(--gutter) var(--offset);
    border-radius: 20px;
    color: black;
    position: relative;
}
.recruit-content > a:hover{
    top: -2px;
}
@media screen and (max-width: 1080px){
    .recruit-content > h1{
        font-size: 8vw;
    }
    .recruit-content > span{
        font-size: 4vw;
    }
  
}
@media screen and (max-width: 500px){
    .recruit-content > a{
        font-size: 4vw;
    }

}