html { font-family: monospace; font-size: 82.5%; color: #eee; background-color: #4a525a; } body { font-size: 1.6rem; color: #fff; text-align: justify; } strong { color: #80f3af; } em { color: plum; font-weight: bold; } em:lang(ja) { font-style: normal; } strong em { color: yellow; } .homepage { font-style: normal; } li { text-align: left; } img { display: block; max-width: 100%; height: auto; margin: auto; } img[alt$="))"] { display: block; max-width: 100%; height: auto; margin: auto; float: none!important; } img { max-width: 100%; margin: auto; display: block; } img[src*='#left'] { float: left; max-width: 50%; margin: 0; } img[src*='#right'] { float: right; max-width: 50%; margin: 0; } /* img[src*='#center'] { display: block; margin: auto; } img[alt$="(r)"] { float: right; max-width: 50%; margin: 0; } img[alt$="(l)"] { float: left; max-width: 50%; margin: 0; } */ figure { margin: auto; } figcaption { text-align: center!important; background-color: #333!important; } /* tr.odd td { padding: 0px; } */ blockquote { padding: 0 1em; color: #2ecc40; border-left: 0.25em solid #dfe2e5; } code { /* color: palevioletred;*/ color: tomato; font-style: normal; font-weight: bold; } header { border-bottom: 0.2rem solid #eee; } nav { text-align: right; } nav a:link, nav a:visited { font-size: 1.8rem; font-weight: bold; color: #499cd4; text-decoration: none; text-transform: lowercase; } a { text-decoration: none; } a:link { color: #499cd4; } a:visited { color: #ca49d4; } footer { margin-top: 3rem; margin-bottom: 1.2rem; padding: 1.2rem 0; border-top: 0.2rem solid #eee; font-size: 1.2rem; color: #ccf; } h1 { font-size: 2.4rem; } h2 { font-size: 2rem; color: pink; } article .header { font-size: 1.4rem; text-align: right; color: #cfc; } .logo a { font-weight: bold; color: #ccc; text-decoration: none; } @media (max-width: 319px) { body { width: 90%; margin: 0; padding: 0 5%; } header { margin: 4.2rem 0; } nav { margin: 0 auto 3rem; text-align: center; } footer { text-align: center; } .logo { text-align: center; margin: 1rem auto 3rem; } .logo a { font-size: 2.4rem; } nav a { display: block; line-height: 1.6; } } @media (min-width: 320px) { body { width: 90%; margin: 0; padding: 0 5%; /* text-align: center; */ } header { margin: 4.2rem 0; } nav { margin: 0 auto 3rem; text-align: center; } footer { text-align: center; } .logo { text-align: center; margin: 1rem auto 3rem; } .logo a { font-size: 2.4rem; } nav a { display: inline; margin: 0 0.6rem; } } @media (min-width: 640px) { body { width: 72rem; margin: 0 auto; padding: 0; } header { margin: 0 0 3rem; padding: 1.2rem 0; } nav { margin: 0; text-align: right; } nav a { margin: 0 0 0 1.2rem; display: inline; } footer a, footer a:visited { color: #499cd4; } /* .eva-ends { max-width: 100%; display: inline; margin: auto; } .eleft { max-width: 50%; margin: 0px; display: block; text-align: left; float: left; } .eright { max-width: 50%; margin: 0px; display: block; text-align: right; float: right; } */ .bleft { text-align: left; display: inline; float: left; } .bright { text-align: right; display: inline; float: right; } .logo { margin: 0; text-align: left; } .logo a { float: left; font-size: 1.8rem; } }