@import url("https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css");@import url("https://fonts.googleapis.com/css?family=Roboto");@import url("https://fonts.googleapis.com/css?family=Permanent+Marker");@import url("https://fonts.googleapis.com/css?family=Source+Code+Pro");html{font-size:24px;font-family:BlinkMacSystemFont,-apple-system,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif}body{background:#f4f4f4}h1,h2{font-weight:300}h1{font-size:32px}section{padding:1rem;background:#f9f9f9}section h2{text-align:center}section:nth-child(odd){background:#f0f0f0}section.hero{background:#52b0d8;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}section.hero h1{margin:0}.content{-ms-flex-wrap:wrap;flex-wrap:wrap}.content,.item{display:-ms-flexbox;display:flex}.item{height:200px;width:280px;background:#50514f;margin:.5rem;box-shadow:0 0 5px #ccc;-ms-flex-direction:column;flex-direction:column;position:relative}.item .dark,.item .light{height:50%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}.item.light,.item .light{background:#fff}.item.special:after{content:"\2605";color:#ffe066;position:absolute;font-size:1.2em;left:5px;top:5px}.btn{background:#fff;padding:.8em 1.6em;border-radius:4px;font-size:.8rem;text-decoration:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:#247ba0}.btn svg{margin-right:10px;fill:#247ba0}.btn:hover{background:#50514f;color:#fff}.btn:hover svg{fill:#fff}.show-code{position:absolute;right:5px;top:5px;font-size:.5em;border:0;outline:none;padding:5px;background:#ffe066;cursor:pointer;letter-spacing:1px;font-weight:bolder;border-radius:2px;color:#50514f;text-decoration:none;text-transform:uppercase}.show-code:hover{background:#ffcb00}.code-modal:target{display:-ms-flexbox;display:flex}.code-modal{display:none;position:fixed;background:rgba(80,81,79,.9);top:0;bottom:0;left:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;right:0;z-index:9}.code-modal .modal-content{background:#fff;-ms-flex-preferred-size:25vw;flex-basis:25vw;padding:20px;border-radius:10px;position:relative;font-size:1rem}.code-modal .modal-close{text-decoration:none;position:absolute;right:0;bottom:102%;color:#fff;padding:5px}