html,body{font-family:"Source Code Pro",Courier New,Monospace;margin:0;background-color:#202020}body{padding-top:6em}header{background-color:#151515;overflow:auto;height:6em;width:100%;position:fixed;top:0;transition:top .2s ease-in-out;z-index:2;border-bottom:1px solid #F5F5F5}.nav-up{top:calc(-6em - 1px)}header h1{float:left;color:#f5f5f5;font-size:2em;margin-top:1em;margin-left:1em;margin-bottom:1em;height:1em}header nav.default a{float:right;text-decoration:none;display:inline-block;width:12.5%;text-align:center;font-size:1.5em;height:1em;padding-top:1.5em;padding-bottom:1.5em}header nav.default a:hover{color:#151515}header nav.mobile{display:none}article{padding:2em 12.5%;overflow:auto}article h2{display:inline-block;width:66.67%;font-size:2.5em;text-align:center;margin-top:0;font-weight:600}article p{font-size:1.25em;color:#e0e0e0}article a:link{color:#6a9fb5}article a:visited,article a:hover,article a:active{color:#aa759f}article.left h2{float:left}article.right h2{float:right}article.left .image{float:right;margin-left:3em}article.right .image{float:left;margin-right:3em}.one{background-color:#202020}.two{background-color:#303030}.three{background-color:#151515}.blue{color:#75b5aa}header .blue:hover{background-color:#75b5aa}.yellow{color:#f4bf75}header .yellow:hover{background-color:#f4bf75}.green{color:#90a959}header .green:hover{background-color:#90a959}.orange{color:#d28445}header .orange:hover{background-color:#d28445}.image{position:relative;width:calc(33.33% - 3em);height:auto;margin-bottom:2em;font-weight:700}.image img{width:100%;vertical-align:top}.image:after,.image:before{position:absolute;opacity:0;transition:all .5s;-webkit-transition:all .5s}.image:after{content:"\a";width:100%;height:100%;top:0;left:0;background:rgba(256,256,256,.6)}.image:before{content:attr(data-content);width:100%;color:#000;z-index:1;bottom:0;padding:4px 10px;text-align:center;background:#FFF;background:linear-gradient(to bottom,transparent 0%,#FFF 100%);box-sizing:border-box;-moz-box-sizing:border-box}.image:hover:after,.image:hover:before{opacity:1}@media only screen and (max-width: 750px),only screen and (max-device-width: 750px){article{padding-left:5%;padding-right:5%}}@media only screen and (max-device-width: 750px){body{padding-top:14em}header{height:14em}.nav-up{top:-14em}header h1{display:block;margin:.2em;text-align:center;font-size:5em;width:calc(100% - .4em);clear:both}header nav.mobile{display:block}header nav.mobile select{font-size:4em;margin:.25em;height:1.25em;width:calc(100% - .5em)}header nav.default{display:none}article h2{font-size:5em;width:100%;clear:both}article.left .image,article.right .image{clear:both;width:50%;margin-left:25%;margin-right:25%}}