@font-face{font-weight: normal;font-style: normal;font-family: 'codropsicons';src: url(../fonts/codropsicons/codropsicons.eot);src: url(../fonts/codropsicons/codropsicons.eot?#iefix) format('embedded-opentype'), 		url(../fonts/codropsicons/codropsicons.woff) format('woff'), 		url(../fonts/codropsicons/codropsicons.ttf) format('truetype'), 		url(../fonts/codropsicons/codropsicons.svg#codropsicons) format('svg')}*,*:after,*:before{box-sizing: border-box}.clearfix:before,.clearfix:after{content: '';display: table}.clearfix:after{clear: both}a{color: #4f7f90;text-decoration: none;outline: none}a:hover,a:focus{color: #39545e}section{padding: 1em;text-align: center}.codrops-header{margin: 0 auto;padding: 1em 1em;text-align: center}.codrops-header h1{margin: 0;font-weight: 800;font-size: 4em;line-height: 1.3}.codrops-header h1 span{display: block;padding: 0 0 0 0.1em;font-size: 45%;font-weight: 300;color: #7e959d}.codrops-top{width: 100%;text-transform: uppercase;font-size: 0.69em;line-height: 2.2}.codrops-top a{display: inline-block;padding: 0 1em;text-decoration: none;letter-spacing: 1px}.codrops-top span.right{float: right}.codrops-top span.right a{display: block;float: left}.codrops-icon:before{margin: 0 4px;text-transform: none;font-weight: normal;font-style: normal;font-variant: normal;font-family: 'codropsicons';line-height: 1;speak: none;-webkit-font-smoothing: antialiased}.codrops-icon-drop:before{content: "\e001"}.codrops-icon-prev:before{content: "\e004"}.related{padding: 6em 1em;font-size: 120%}.related>a{border: 1px solid #4f7f90;display: inline-block;text-align: center;margin: 20px 10px;padding: 25px}.related a:hover{border-color: #39545e}.related a img{max-width: 100%;opacity: 0.8}.related a:hover img,.related a:active img{opacity: 1}.related a h3{margin: 0;padding: 0.5em 0 0.3em;max-width: 300px;text-align: left}@media screen and (max-width: 25em){.codrops-header{font-size: 75%}.codrops-icon span{display: none}}