#myname{
    font-family: 'Comfortaa', 'Courier New', 'Courier', 'monospace';
    padding-top:1rem;
    color:white;
    font-size: 2rem;

}

section{
    display: block;
    margin: 1rem;
    border: 0.25em solid black;
    border-radius:0.3em;
    background-color: rgb(152, 216, 244);

}


a{
    text-decoration:none; /*Gets rid of underline of links*/
}



/* Makes bullet points visible */
article{
    padding-left: 1rem;
}

/* Styles page grid layout */
#pageGrid{
    display:grid;
    grid-template-columns: 10px 1fr 1fr 1fr 1fr;
    grid-template-areas: 'header header header header header'
                        '. . title . .'
                        'lineSegment1 uni uni uni .'
                        'lineSegment2 sixthForm sixthForm sixthForm .'
                        'footer footer footer footer footer';
}

header{
    grid-area: header;
}

/*Styles the title of the page*/
#title{
    text-align: center;
    text-decoration: underline;
    padding: 1rem;
    font-size: 2rem;
    grid-area: title;
}

#university{
    grid-area: uni;
}
#sixthForm{
    grid-area: sixthForm;
 }

.timeline{
    position:relative;
    margin-left:auto;
    width:2%;
    background-color:rgb(0, 179, 255); 

}
.lineSegment1{
    grid-area:lineSegment1;
    
 }

 .lineSegment2{
    grid-area: lineSegment2;
 }

.timelineCircle{
    position:absolute;
    top:0%;
    width:0.8em;
    height:0.8em;
    transform: translateX(-50%); /*centres point */
    border-radius:50%;
    background-color:aqua;
}

 footer{
    grid-area: footer;
    background-color: rgb(0, 179, 255); 
 }