/* General Demo Style */ @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
- ,
- after,
- before {
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; }
html { height: 100%; font-size: 62.5%; }
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */ .clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
body { font-family: 'Lato', Calibri, Arial, sans-serif; background: #fff url(../images/bg.jpg); font-weight: 300; font-size: 14px; font-size: 1.4rem; color: #333; -webkit-font-smoothing: antialiased; overflow-y: scroll; overflow-x: hidden; }
a { color: #555; text-decoration: none; }
.container { width: 100%; position: relative; }
.clr { clear: both; padding: 0; height: 0; margin: 0; }
.container > header, .main { width: 80%; max-width: 960px; margin: 0 auto; padding: 0 30px; }
.container > header { padding: 30px; }
.container > header h1 { margin: 0; font-weight: 700; color: #333; float: left; font-size: 36px; font-size: 3.6rem; line-height: 46px; line-height: 4.6rem; }
.container > header h1 span { display: block; color: #444; font-size: 20px; line-height: 28px; line-height: 2.8rem; font-weight: 300; text-shadow: 0 1px 0 rgba(255,255,255,0.5); }
/* Header Style */ .codrops-top { font-size: 11px; font-size: 1.1rem; line-height: 24px; line-height: 2.4rem; background: #fff; background: rgba(255, 255, 255, 0.5); text-transform: uppercase; z-index: 9999; position: relative; box-shadow: 1px 0px 2px rgba(0,0,0,0.2); }
.codrops-top a { padding: 0px 10px; letter-spacing: 1px; color: #333; font-weight: 400; text-shadow: 0 -1px 0 #fff; display: inline-block; }
.codrops-top a:hover { background: rgba(255,255,255,0.8); color: #000; }
.codrops-top span.right { float: right; }
.codrops-top span.right a { float: left; display: block; }
.support-note { clear: both; }
.support-note span{ color: #ac375d; font-size: 16px; font-size: 1.6rem; display: none; font-weight: bold; text-align: center; padding: 5px 0; }
.actions { width: 100%; padding: 0 0 20px 0; }
.actions span { box-shadow: 0 1px 1px rgba(0,0,0,0.2); background: #fff; color: #888; font-weight: 700; font-size: 12px; font-size: 1.2rem; text-align: center; display: inline-block; cursor: pointer; padding: 5px 10px; text-transform: uppercase; margin: 3px; border-radius: 3px;
}
.actions span:hover { background: #f7f7f7; }
.actions span:active { background: #aaa; color: #fff; box-shadow: 0 1px 1px rgba(255,255,255,0.5); }
.actions span.disabled { opacity: 0.8; color: #ddd; }
.light { padding: 60px 0 250px; }
.light span { background: #aaa; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,0.3); box-shadow: inset 0 1px 1px rgba(0,0,0,0.2), 0 1px 1px rgba(255,255,255,0.8); }
.light span:hover { background: #444; }
- nav-prev, #nav-next {
width: 30px; height: 30px; font-size: 18px; line-height: 20px; }
- close {
float: right; }