/* apply styles to */ body { color: #227070; font-family: Arial, Helvetica, sans-serif; } .body-grid-wrapper { display: grid; width: 100%; } .body-grid-container { width: 100%; display: grid; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(1, 1fr); color: #227070; font-size: 1.2rem; } .body-grid-item { padding: 15px 0; display: grid; align-items: center; justify-content: space-between; text-align: left; } .body-grid-item.three { grid-column: 1 / span 3; } .body-grid-item.both { grid-column: 2 / span 2; } /* apply styles to

*/ #header { padding: 20px 35px; background-color: #c3c7c7; display: flex; justify-content: space-between; flex-wrap: wrap; position: sticky; position: -webkit-sticky; background-size: cover; background-position: 80%; } #header h1 { text-shadow: 0 0 10px rgba(10, 81, 92, 0.473); } #header a { text-decoration: none; color: #227070; } #header nav { margin: 7px 0; } #header nav ul { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; list-style: none; } #header nav ul li a { padding: 10px 15px; font-weight: lighter; font-size: 1.55vw; text-shadow: 0 0 10px rgba(10, 81, 92, 0.473); } #header nav ul li a:hover { color: #3a1b42; border-radius: 15px; text-shadow: none; } /* end

*/ /* apply styles */ * { margin: 0; padding: 0; box-sizing: border-box; } img{ width: 40%; height: 40%; border-radius: 180px; } section { padding: 60px; } .section-title { font-size: 38px; color: #227070;; padding-right: 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .primary-border { border-color: #227070; border-right: 3px solid; } /* apply styles to about */ .flex-row { display: flex; } #about-me{ padding: 60px; align-items: right; justify-content: right; text-align: right; } #about-img{ justify-content: space-around; text-align: center; } #about-bio p{ padding: 20px; align-items: left; justify-content: space-around; text-align: Left; } /* end about */ /* apply styles to projects */ .flex-row { display: flex; } #projects{ padding: 60px; align-items: right; justify-content: right; text-align: right; } .project-grid-wrapper { display: grid; width: 100%; justify-content: center; } .project-grid-container { max-width: 940px; margin: 0 auto; display: grid; grid-template-columns: 200px repeat(2, 1fr); grid-template-rows: 100px repeat(1, 1fr); grid-gap: 10px; } .project-grid-item { border: solid; padding: 1em; color: #227070; align-items: center; justify-content: space-between; text-align: right; border-radius: 25px; } .project-grid-item a { color: #227070; } .project-grid-item.p-one { grid-column: 1/3; grid-row: 1/4; background-image: url("../images/wordsearch.jpg"); color: #227070; background-size: cover; } .project-grid-item.p-one:hover { color:#227070; background-size: cover; height: 300px; /*text-shadow: none;*/ } .project-grid-item.p-two { background-image: url("../images/heart1.jpg"); background-size: cover; color: #227070; } .project-grid-item.p-three { background-image: url("../images/portfolio.jpg"); background-size: cover; color: #227070; } .project-grid-item.p-three:hover { height: 100px; } .project-grid-item.p-four{ background-image: url("../images/runbuddy.jpg"); background-size: cover; color: #227070; } .project-grid-item.p-four:hover { background: yellow; color: #227070; text-shadow: none; } /* end projects */ /* apply styles to */ .contact h2 { color: #227070; } #contact-me { align-items: right; justify-content: right; text-align: right; } #contact-info { display: flex; flex-wrap: wrap; } #contact-info address ul { display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; list-style: none; } #contact-info address ul li a { text-decoration: none; color: #227070; padding: 10px 15px; font-weight: lighter; font-size: 1.55vw; } #contact-info address ul li a:hover { color: #3a1b42; border-radius: 15px; text-shadow: none; } /* end contect */ /* apply styles to