/**** Blog Home page *****/ .banner { max-width: 30%; box-shadow: 0 6px 4px 0 var(--mutedBlack); -webkit-border-radius: 0.625rem; -moz-border-radius: 0.625rem; border-radius: 0.625rem; border: 2px solid var(--mutedGrey); } h2 { font-family: Share Tech Mono, monospace; font-style: normal; font-weight: normal; font-size: var(--headingFS); line-height: 2.5625rem; text-transform: lowercase; } h3 { font-family: Noto Sans KR, sans-serif; font-style: normal; font-weight: 500; font-size: var(--generalFS); line-height: 2.1875rem; } div.menu { width: 100%; border-bottom: 5px solid var(--mutedGrey); } div.menu input:not([type="submit"]) { width: auto; border-top-right-radius: 0; border-bottom-right-radius: 0; } div.menu > ul { list-style: none; display: flex; flex-direction: row; justify-content: space-around; } div.menu ul li { display: flex; flex-direction: row; } div.menu ul li button.btn { padding: initial; border-radius: 0 0.5em 0.5em 0; } div.menu ul li input:not([type="submit"]):focus + button.btn, div.menu ul li:hover button.btn, div.menu ul li:focus button.btn { background: var(--primaryHover); border: 0.3215em solid var(--primaryHover); } div.menu ul li:hover input:not([type="submit"]), div.menu ul li:focus input:not([type="submit"]) { border: 0.3215em solid var(--primaryHover); } section.largePost { display: flex; flex-direction: column; justify-content: space-evenly; align-items: flex-start; gap: 2em; width: 100%; padding: 0 5em 1em; } section.largePost:not(:last-child) { border-bottom: 5px solid var(--mutedGrey); } section.largePost .outerContent { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; align-items: center; gap: 1em; } section.largePost .outerContent > img, section.largePost .outerContent > .content { width: 50%; } section.largePost .outerContent .postContent { display: flex; flex-direction: column; justify-content: space-evenly; align-items: flex-start; } section.largePost .outerContent .postContent h2 { align-self: center; } section.largePost .outerContent .postContent a { align-self: flex-end; } #main .errorFof { display: table; width: 100%; height: 100vh; text-align: center; } .fof { display: table-cell; vertical-align: middle; }