html,body{ margin: 0; padding: 0; font-family: "Lato", Arial, Verdana; font-size: 20px; height: 100%; background-color: #fff; width: 100%; color:#222222; } body.hidden{ overflow: hidden; } *{ -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } h1 { font-family: Helvetica, Arial, Verdana; font-weight:normal; font-size:92px; color:#222222; } header#top{ position: fixed; top: 0; left: 0; width: 100%; z-index: 100; overflow: hidden; } header#top #logo{ float: left; margin: 16px 0 0 30px; font-weight: normal; font-size: 45px; color: white; text-transform: uppercase; text-shadow: 0 0 15px rgba(0,0,0,0.5); } .pagewrap{ height: 100%; } .pageblock{ width: 100%; } .pagewrap .fb-like{ position: fixed; left: 30px; top: 75px; z-index: 100; } .pagewrap .githubbuttons{ position: fixed; left: 220px; top: 75px; z-index: 100; } .pagewrap .copy{ font-size: 10px; bottom: 20px; left: 30px; z-index: 100; position: absolute; color: white; } .pagewrap .copy a,.pagewrap .copy a:hover{ color: white; } .pageblock#fullscreen{ height: 100%; background: none; color: white; } .pageblock#fullscreen h1{ color: white; font-size: 72px; margin: 0; padding: 0; font-family: 'sxehwcmaax-blackblack', Helvetica, Arial, Verdana; font-weight:normal; } .pageblock#fullscreen .slider{ width: 100%; height: 100%; overflow: hidden; position: relative; } .pageblock#fullscreen .slider .slide{ width: 100%; height: 100%; top: 0; left: 0; float: left; position: absolute; } .pageblock#fullscreen .slider .slide .slidecontent{ position: absolute; top: 50%; width: 100%; margin-top: -150px; text-align: center; } .pageblock#fullscreen .slider .slide .slidecontent h1{ text-shadow: 0 0 15px rgba(0,0,0,0.5); font-weight: bold; font-size: 120px; margin: 20px 0 30px 0; padding: 0; line-height: 115px; } .pageblock#fullscreen .slider .slide .slidecontent .headersur{ font-size: 30px; text-shadow: 0 0 10px rgba(0,0,0,0.5); color: #f0f0f0; font-style: italic; display: block; } .pageblock#fullscreen .slider .slide .slidecontent .button{ padding: 10px 25px; border: 3px solid white; text-transform: uppercase; background: transparent; background: rgba(0,0,0,.2); color: white; font-size: 15px; font-weight: bold; display: inline-block; cursor: pointer; letter-spacing: 1px; margin: 20px 0; line-height: 20px; } .pageblock#fullscreen .slider .slide .slidecontent .button a,.pageblock#fullscreen .slider .slide .slidecontent .button a:hover{ text-decoration: none !important; color: white; } .pageblock#fullscreen .slider .slide .slidecontent .button:hover{ background: rgba(0,0,0,.3); } .pageblock#fullscreen .slider .slide .slidecontent .text{ width: 900px; margin: 0 auto; line-height: 28px; } .pageblock#fullscreen .slider .slide .slidecontent .text a{ color: white; text-decoration: underline; } .pageblock#fullscreen .slider .slide .slidecontent .text a:hover{ text-decoration: none; } .pageblock#fullscreen .slider .slide .slidecontent .text xmp{ font-size: 13px; text-align: left; border: 1px solid white; background: rgba(0,0,0,0.1); padding: 10px 15px; } .pageblock#fullscreen #slideposition{ position: absolute; bottom: 50px; left: 50%; } .pageblock#fullscreen #slideposition ul{ list-style-type: none; margin: 0; padding: 0; } .pageblock#fullscreen #slideposition ul li.indicator{ display: inline-block; height: 10px; width: 10px; background: #222; margin: 0px 7px; padding: 0; -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; overflow: hidden; cursor: pointer; } .pageblock#fullscreen #slideposition ul li.indicator.active{ background: white; }