/********************************** Grid Layout **********************************/
.grid-container {
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto auto auto;
    grid-template-areas: 'header header' 'image content' 'project project' 'main main';
    grid-row-gap: 1em;
    grid-column-gap: 1em;
    align-items: center;
    margin-right: 2.5%;
    margin-left: 2.5%;
}

#grid-head {
    grid-area: header;
}

#grid-image{
    grid-area: image;
}
#grid-content{
    grid-area: content;
}
#grid-project{
    grid-area: project;
}
#grid-main{
    grid-area: main;
}

/********************************** About Items **********************************/
p.bio {
    font-size: 150%;
}
p.just {
    text-align: justify;
}
.portfolio{
    border-radius: 15%;
    width: 75%;
}

.projectsLink {
    font-size: 150%;
    text-align: justify;
}
a.projectsLink:link {
    text-decoration: none;
    color: #0066ff;
}

a.projectsLink:visited {
    text-decoration: none;
    color: #0066ff;
}

a.projectsLink:hover {
    text-decoration: underline;
    color: #0066ff;
}

a.projectsLink:active {
    text-decoration: underline;
    color: #0066ff;
}

#pt1-education-carrot, #pt2-skills-carrot, #pt3-course-carrot, #pt4-projects-carrot, #pt5-involvement-carrot, #pt6-work-carrot {
    font-size: 75%;
    font-weight: 900;
    color: #022E6D;
    cursor: default;
}
.resume-break {
    border: 0.5px solid #022E6D;
}
.resume-heading {
    color: #022E6D;
}
.title-tag {
    font-size: 150%;
    color: #022E6D;
}
.resize-projects{
    width: 75%;
    cursor: pointer;
    border-radius: 1%;
}
.increase-font {
    font-size: 115%;
}
/*********************** Mobile Layout ***************************/
@media screen and (max-width: 1000px) {
    .grid-container {
        grid-template-columns: 100%;
        grid-template-rows: auto auto auto auto;
        grid-template-areas: 'header' 'image' 'content' 'project' 'main';
        margin-left: 1.5%;
        margin-right: 1.5%;
    }

    h2 {
        font-size: 100%;
    }

    p {
        font-size: 87.5%;
    }
    p.bio{
        font-size: 95%;
    }
    .projectsLink {
        font-size: 95%;
    }
}