/* Style texts for the web page */
h1, h2, h3 {
    font-family: 'Cantora One';
}

p, nav a, .skills-column li, footer a{
    font-family: 'Dosis', serif;
}

/* Styles the navigation bar */
#navigator {
    background-color: #e8e8e8;
}

/* Styles the hero section */
header {
    height: 45vh;
    position: relative;
}

#hero {
    background-image: url(../images/hero.JPG);
    background-position: top right;
    background-repeat: no-repeat;
    padding-top: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 5vh;
    /* font-family: 'Amita', serif; */
    color: #262c2b;
    padding-left: 1rem;
    padding-right: 2rem;
    background-color: #bfcbd1;
    width: fit-content;
}

.my-pic {
    height: 25vh;
    padding-top: 2vh;
    padding-bottom: 2vh;
}

.my-pic img{
    border: solid 0.2rem #4a5b65;
    object-fit: cover;
    object-position: center;
    height: 100%;
}

#subtitle {
    margin-right: 0;
    padding-right: 0;
}

#subtitle p {
    background-color: #e8e8e8;
    font-size: 2.5vh;
    padding-left: 4vw;
    padding-right: 2vw;
}

.work-cards {
    border: #e8e8e8 solid 0.3rem;
}

.work-cards img {
    border: #262c2b solid 0.1rem;
    opacity: 0.7;
}

.work-cards img:hover {
    opacity: 1;
}

/* Styles the contact section */
#contact a {
    border: 0.1rem solid #e8e8e8;
    border-radius: 0.3rem;
}

#contact a:hover{
    box-shadow: 0.1rem 0.1rem #bfcbd1;
}