/*@import url(http://fonts.googleapis.com/css?family=Abel);*/ body { background-color: #fefdfb; color: #555; font-family: 'Abel', sans-serif; font-size: 14px; font-weight: normal; margin: 0; } a:link, a:visited, a:active { color: inherit; /*text-decoration: none;*/ } a:hover { color: #FC436B; text-decoration: underline; } img { padding: 5px; } .icon, .hide { font-size: 20px; } .right { text-align: right; } .hide { display: none; } #menu { width: 100%; min-height: 35px; background-color: /*#01dddd #B61B82 #03D7CB*/ green; position: fixed; top: 0; left: 0; } #menu a { background-color: inherit; color: #fff; } #menu a:hover { background: inherit; color: #ccc; text-decoration: none; } nav { display: table; table-layout: fixed; width: 70%; margin: 0 auto; } ul#topnav { display: table-row; padding: 0; overflow: hidden; position: relative; bottom: 0; } ul#topnav li { list-style-type: none; display: table-cell; text-align: center; vertical-align: middle; } ul#topnav li a { display: block; padding: 4px 0px; } #container { width: 100%; margin-top: 48px; } #pageheader { display: table; width: 62.5%; margin: auto; } .section { width: 62.5%; border-top: 1px solid #eee; padding: 20px 0; margin: auto; } .pageitem { display: table; width: 100%; margin-bottom: 15px; padding-top: 15px; text-align: center; } .pageitem h1 { font-weight: normal; color: #555; margin: 0; text-align: left; } .pageitem h2 { font-size: 32px; background-color: inherit; color: #444; margin-top: 0; } .pageitem p em { background-color: inherit; color: #444; font-size: 40px; font-style: normal; font-weight: 100; } .pageitem p { padding: 0 75px; margin: 0; font-size: 18px; line-height: 200%; } .col { display: table-cell; } .col ul#sub { float: right; padding: 0; margin: 0; } .col ul#sub li { display: inline; list-style-type: none; text-align: right; } .col ul#sub li a { padding: 5px; background-color: inherit; color: #777; } .col ul#sub li a:hover { color: #FC436B; } #footer { display: table; width: 100%; margin-bottom: 15px; padding: 15px 0; text-align: left; font-size: 13px; color: #999; } #footer p { text-align: left; padding: 0; } ul#bottomnav { display: table-row; padding: 0; } ul#bottomnav li { list-style-type: none; display: table-cell; text-align: left; font-weight: bold; vertical-align: top; } ul#bottomnav li ul { padding: 0; padding-bottom: 20px; } ul#bottomnav li li { display: list-item; font-weight: 100; } #credits { display: table; width: 100%; text-align: left; font-size: 12px; color: #999; line-height: 100%; } #show-menu { display: none; } .responsive { background-color: inherit; color: #fff; text-align: left; font-weight: normal; font-size: 1.5em; padding: 0; position: absolute; top: 10%; left: 5%; display: none; } @media screen and (max-width: 700px) { /* menu */ ul#topnav { display: none; } .hide, .responsive { display: block; } .icon { display: none; } .logo { position: absolute; top: 10%; right: 50%; } .search { position: absolute; top: 10%; right: 5%; } #show-menu:checked~ul#topnav { display: block; position: absolute; top: 100%; width: 100%; margin: 0; overflow: visible; } ul#topnav li { display: block; text-align: left; margin: 0 0 1px -15%; background-color: #FC436B; } ul#topnav li a { padding-left: 20px; } .pageitem p { padding: 0; } .col { float: left; margin: auto; width: 100%; text-align: center; } .col ul#sub { clear: both; float: none; margin: auto; } .col ul#sub li { text-align: center; } ul#bottomnav { display: list-item; list-style-type: none; } ul#bottomnav li { display: block; text-align: center; } #credits p { text-align: center; } }