@import url('https://fonts.googleapis.com/css?family=Montserrat:500|Quicksand:300|Major+Mono+Display');

html,body{
    height: 100%;
}
body{
    font-family:'Quicksand';
    font-size: calc(0.5vh + 2rem);
    margin:0;
    cursor: crosshair;
     text-align: justify;
  text-justify: inter-word;
  background-color: black;
}

h2{
    text-align: center;
}

section{
    scroll-snap-align: start;
}

.heading-container{
    min-height: 100vh;
    background-color: black;
    display: grid;
    grid-template-rows:40% 60%;
    align-items: center;
    justify-items: center;
    color: white;
}
.heading{
    text-align: center;
    font-family: Montserrat;
}

.interests{
    text-align: center;
}
h2{
    font-family: Montserrat;
}

.skill-container{
    margin: 2%;
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto auto auto auto;
    }

.experience-container{
    display: grid;
    background-color: black;
    color: white;
    align-items: center;
    min-height: 100vh;
}
.experience-container *{
    color: white;
    margin: 1%;
}

.projects-container{
    display: grid;
    margin: 2%;
    min-height: 100vh;
    align-items: center;
    font-family: Major Mono Display;
}

.contact-container{
    display: grid;
    min-height: 100vh;
    background-color: black;
    color: white;
    align-items: center;
    margin-bottom: -10%;
    justify-items: center;
    text-align: center;
}

.contact-container a{
    color: white;
}
.projects-container a{
    color: black;
}

.languages-container{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-template-rows: auto;
    justify-items: center;
    align-items: center;
    grid-gap: 1vw;
    text-align: center;
}

.tools-container{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    justify-items: center;
    align-items: center;
    text-align: center;
}

.development-container{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    justify-items: center;
    align-items: center;
    text-align: center;
}

.deployment-container{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    justify-items: center;
    align-items: center;
    text-align: center;
}

.projects-subContainer{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(700px, 1fr));
    justify-items: center;
    align-items: center;

}