html { background: url("../img/back-light.png") center 0; -webkit-box-shadow: inset 0 0 100px #FFF, inset 0 0 100px #FFF; -moz-box-shadow: inset 0 0 100px #FFF, inset 0 0 100px #FFF; box-shadow: inset 0 0 100px #FFF, inset 0 0 100px #FFF; } body { padding: 0; margin: 0; color: black; font: 105% Exo, sans-serif; font-weight: 100; } h1, h2, h3, h4 { text-shadow: #FFF 0 -1px 1px, #AAA 0 0 5px; font-weight: 600; } strong { font-weight: 400; } h1 .sub { font-size: 0.5em; } h1 { font-size: 250%; } h2 { font-size: inherit; } p, blockquote, ul { text-shadow: #FFF 0 -1px 1px, #CCC 0 0 3px; } p { text-align: justify; } ul { font-size: 90%; font-weight: 400; } blockquote { font-size: 90%; font-weight: 400; } a, .link, :link { color: inherit; text-decoration: underline; cursor: pointer; font-weight: 400; } a:hover, .link:hover { text-decoration: none; } label { display: inline-block; width: 15em; } /* Classes */ .stripe { background: rgba(255, 255, 255, 0.3); border: 1px solid rgba(255, 255, 255, 0.7); border-width: 1px 0; -webkit-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5); -moz-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5); box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5); } /* Page */ header { position: relative; background: url("../img/back-dark.png") center 0; border-bottom: 1px solid #FFF; -webkit-box-shadow: 0 0 50px #666; -moz-box-shadow: 0 0 50px #666; box-shadow: 0 0 50px #666; margin: 0 0 5em; padding: 1em 0; text-align: center; } header h1 { margin: 0; color: white; font-size: 350%; } header .logo { height: 128px; vertical-align:middle; } header .divider { position: absolute; width: 100%; bottom: -90px; } footer { clear: both; padding: 1em 0; color: #333; text-shadow: #FFF 0 -1px 1px, #999 0 0 5px; text-align: center; font-size: 80%; } section { width: 900px; margin: 0 auto; } #content section.current { opacity: 1; z-index: 1; } hr { background: url("../img/Dividers/Simple.png") center center no-repeat; border: none; height: 5px; } blockquote { margin-left: 5em; } blockquote:before { content: "❝"; position: absolute; margin: -0.5ex 0 0 -1em; font-size: 300%; font-weight: 100; } /* Utilities */ .side { float: right; margin: 1em -10em 1em 1em; } .sidebox { background: url("../img/Dividers/Divider_H.png") center bottom no-repeat; position: relative; float: right; margin: 1em; width: 546px; text-align: center; } .sidebox .clip { overflow: hidden; position: relative; z-index: -1; } .frontpage .sidebox { margin-right: -100px; } .frontpage .sidebox .clip { height: 416px; margin-bottom: 84px; } .hoverShow { display: none; } *:hover>.hoverShow { display: inline-block; } section { position: relative; display: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } section.active { display: block; } a.previous, a.next { display: block; position: absolute; margin: -2.5em 0 0 0; font-size: 150%; font-weight: 400; text-decoration: none; } a.previous { left: 0; } a.previous:before { content: "< "; } a.next { right: 0; text-align: right; } a.next:after { content: " >"; } #ribbon { background: url("../img/ribbon-join-beta.png"); display: block; position: absolute; left: 0; margin-top: -5em; width: 184px; height: 184px; } #frontpage .sidebox { margin-top: -50px; }