/* test style */
a:link{
    text-decoration-line: none;
}
h1 {
    font-family: "Garamond", "Times New Roman", serif;
    font-size: 40px;
}
h2 {
    font-family: "Garamond", "Times New Roman", serif;
    font-size: 30px;
}
h3 {
    font-family: "Garamond", "Times New Roman", serif;
    font-size: 30px;
    margin-bottom: 5px;
}
p{
    font-family: "Helvetica", sans-serif;
    font-size: 20px;
    margin-top: 0px;
}
ul {
    font-family: "Helvetica", sans-serif;
    font-size: 20px;
    margin-top: 0px;
    line-height: 1.1;
}
ul li {
    margin-bottom: 20px;
}
body{
    background-color: #008080;
}

 /* Main grid*/
.grid-container {
    display: grid;
    grid-template-areas: 
        "grid-header"
        "grid-middle"
        "grid-footer"
}
.grid-header {
    grid-area: grid-header;
    background: linear-gradient(#008080, #99cccc);
    text-align: center;
    line-height: 2.0;
    display: grid;
        grid-template-columns: 0.5fr 2fr 0.5fr;
            grid-template-areas: 
                "grid-header-left" "gird-header-center" "grid-header-right"
}
.grid-middle {
    grid-area: grid-middle;
    background: linear-gradient(#99cccc, #cce5e5);
    display:grid;
        line-height: 1.15;
        text-align: left;
        grid-template-columns: 1fr 2fr 1fr;
        grid-template-areas: 
            "grid-middle-left" "grid-middle-center" "grid-middle-right"
}
.grid-footer {
    grid-area: grid-footer;
    background: linear-gradient(#cce5e5, #008080);
    text-align: center;
}

/* Header */
.grid-header-center {
    display: grid;
    align-items: center;
    grid-template-areas: 
        "header-pic header-title"
        "header-pic header-text"
}
.header-pic{
    grid-area: header-pic;
    margin-top: 40px;
    margin-bottom: 20px;
}
img.rounded-corners {
    border-radius: 30px;
}
.header-title{
    grid-area: header-title;
    margin-right: 10px;
}
.header-text{
    grid-area: header-text;
    margin-right: 10px;
}

/* Floating Year Grids */
.cv {
	display:grid;
	grid-template-columns: 1fr 9fr;
	grid-template-areas:
		"cv-year" "cv-item" 
}

.cv-item {
	padding-left:10px;
	list-style-type: none;
}

.cv-year {
	display:grid;
	justify-content: center;
	font-weight:bold;
	border-radius: 10px;
	background:white;
	padding:5px;
}


/* Mobile Screens */
@media screen and (max-width:1000px) {
    .grid-middle {
        grid-template-columns: 0.1fr 2fr 0.1fr;
    }
        .grid-header {
        grid-template-columns: 0.1fr 2fr 0.1fr;
    }
}
@media screen and (max-width:700px) {
    .grid-header-center {
        grid-template-areas: 
            "header-pic"
            "header-title"
            "header-text"
    }
}

/*Non-Academic Collapsible Section */
details {
  border: 1px solid #000;
  border-radius: 1px;
  padding: 0.5em 0.5em 0;
}
summary {
  font-weight: bold;
  margin: -0.5em -0.5em 0;
  padding: 0.5em;
  display: block;
  background: #cce5e5;
}

details[open] {
  padding: 0.5em;
}

details[open] summary {
  border-bottom: 1px solid #000;
  margin-bottom: 0.5em;
}