.feature > p > a { color: #2a4678; } .feature > p { font-weight: lighter; } .front-links > ul { margin: auto; padding: 0; display: flex; justify-content: center; } @media screen and (max-width: 800px) { .front-links > ul { flex-direction: column; } } .front-links > ul > li > a, .front-links > ul > li > a:visited { text-decoration: none; color: #586761; } .front-links > ul > li { list-style: none; text-align: center; margin: 10px; padding: 0; } #features { background-image: url("/static/img/darkened_paper.jpg"); width: 100%; } .pagegradient { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 50px), linear-gradient(to right, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 30px), linear-gradient(to left, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 30px); margin: 0; min-height: 100vh; width: 100%; display: flex; flex-wrap: wrap; justify-content: center; } .feature { width: 40%; background-image: url("/static/img/paper.jpg"); margin: 20px 30px 20px 30px; padding: 20px; text-align: left; box-shadow: rgba(0,0,0,0.3) 0 0 10px; color: black; } .feature > img { float: right; width: 35%; margin-left: 20px; box-shadow: rgba(0,0,0,0.3) 0 0 10px; } @media screen and (max-width: 800px) { .feature { width: 99%; } } #useful-fun { flex-grow: 1; } #fourth-box { width: 30%; } @media screen and (max-width: 800px) { #fourth-box { width: 99%; } } .front-links { color: black; } .response { display: flex; flex-direction: column; align-items: center; } #lyphebig { display: grid; margin: 7% 10% 0 10%; grid-auto-flow: column; width: 55%; } @media screen and (max-width: 800px) { #lyphebig { grid-auto-flow: row; } } #lyphetitle { display: grid; margin-left: 5px; padding-top: 20%; } @media screen and (max-width: 800px) { #lyphetitle { padding-top: 0; } } .bent-surrounding { background: url("/static/img/borderbent.png") no-repeat center; background-size: 90%; display: grid; height: auto; } #lypheimg { width: 90%; margin: auto; } #lyphetitle > img { width: 100%; margin: 0; } #lyphetitle > p { font-family: NanumGothicCoding, monospace; font-size: 175%; color: #9baba4; } @media screen and (max-width: 800px) { #lyphetitle > h2 { font-size: 100%; } } form { margin-top: 10%; } .pagecontent { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0, rgba(0, 0, 0, 0) 50px); margin: 0; min-height: 100vh; width: 100%; }