seq-theme-two-up/css/sequence-theme.two-up.min.css

A two column layout, one for showing content, the other a featured image

@charset "UTF-8";@import url(http://fonts.googleapis.com/css?family=Oswald:400,700|Merriweather:300);body{overflow-x:hidden}.seq{width:100%;max-width:100%;height:100%;overflow:hidden;margin:0 auto;padding:0;font-family:sans-serif;-webkit-text-size-adjust:100%}.seq .seq-canvas,.seq .seq-canvas>*,.seq .seq-screen{margin:0;padding:0;list-style:none}.seq .seq-canvas{white-space:nowrap;font-size:0}.seq .seq-canvas>*{display:inline-block;vertical-align:top;width:100%;font-size:16px}.seq .seq-attribution{position:relative;display:block;margin:0 auto;padding:.5em;text-align:center;line-height:140%}.seq .seq-attribution a{color:#444;text-decoration:none;font-weight:700}.seq .seq-attribution a:focus,.seq .seq-attribution a:hover{color:#000}.seq .seq-preload-circle{fill:#000}.seq .seq-in{z-index:1}.seq.seq-active .seq-nav{display:block}.seq.seq-active .seq-in{z-index:auto}.seq .seq-valign:before{content:"";height:100%}.seq .seq-valign:before,.seq .seq-valign>div{display:inline-block;vertical-align:middle}.seq .seq-nav{display:none;position:absolute;z-index:100;top:200px;left:50%;padding:.5em 1em;text-align:center;background:#000;background:rgba(0,0,0,.6);border-top-left-radius:10px;border-top-right-radius:10px;color:#fff;font-family:Oswald,sans-serif;-webkit-transform:translateX(-50%) translateY(-100%) translateZ(100px);-ms-transform:translateX(-50%) translateY(-100%) translateZ(100px);transform:translateX(-50%) translateY(-100%) translateZ(100px);-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.seq .seq-pagination,.seq .seq-swipe{display:inline-block;vertical-align:top}.seq .seq-swipe{margin-left:.5em}.seq .seq-swipe path{fill:#fff}.seq .seq-next{padding:0;background:0 0;border:0;line-height:1}.seq .seq-pagination{margin:0;padding:0}.seq .seq-pagination a{text-decoration:none}.seq .seq-pagination li{display:inline-block;vertical-align:top;text-align:center;position:relative;cursor:pointer;width:1em;height:1em;margin:0;margin-right:1em;padding:0;border:#fff solid 2px;border-radius:50%;background:rgba(255,255,255,.6);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:background;transition-property:background}.seq .seq-pagination li .numeral{font-size:.6875em;font-weight:700;color:#000;vertical-align:top;line-height:1.45454545em;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:color;transition-property:color;-moz-osx-font-smoothing:grayscale}.seq .seq-pagination li:focus,.seq .seq-pagination li:hover{background:#fff}.seq .seq-pagination li:focus .numeral,.seq .seq-pagination li:hover .numeral{color:#000}.seq .seq-pagination li:before{pointer-events:none;content:"";position:absolute;top:50%;left:50%;background:#fff;border:#fff solid 2px;border-radius:50%;width:1em;height:1em;opacity:0;-webkit-transform:translateX(-50%) translateY(-50%) scale(3);-ms-transform:translateX(-50%) translateY(-50%) scale(3);transform:translateX(-50%) translateY(-50%) scale(3);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;-webkit-transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.seq .seq-pagination li.seq-current{cursor:auto}.seq .seq-pagination li.seq-current:before{opacity:1;-webkit-transform:translateX(-50%) translateY(-50%) scale(1);-ms-transform:translateX(-50%) translateY(-50%) scale(1);transform:translateX(-50%) translateY(-50%) scale(1)}.seq .seq-pagination li:after{pointer-events:none;content:"";position:absolute;top:50%;left:100%;height:2px;width:1.25em;background:#fff;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.seq .seq-pagination li:last-child{margin-bottom:0;margin-right:0}.seq .seq-pagination li:last-child:after{content:none}.seq .seq-next-button,.seq .seq-tooltip{display:none}.seq .seq-content{left:0;right:auto;padding:0 1em;background:#fff;text-align:center;font-size:0;font-family:Merriweather,serif;opacity:0;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-delay:.2s;transition-delay:.2s;-webkit-transition-property:opacity;transition-property:opacity;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.seq .seq-content h2{margin:0;margin-bottom:.2em;font-family:Oswald,sans-serif;font-size:1.625em;font-weight:700}.seq .seq-content h3{margin:0;line-height:160%;font-size:1em;font-weight:300}.seq .seq-content>div{padding:2em 1em;font-size:16px;white-space:normal}.seq .seq-button{display:inline-block;margin-top:2em;padding:.5em 1.2em;border:#000 solid 3px;color:#000;text-decoration:none;text-transform:uppercase;font-family:Oswald,sans-serif;font-size:.875em;font-weight:400;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:color,background;transition-property:color,background}.seq .seq-button:focus,.seq .seq-button:hover{background-color:#000;color:#fff}.seq .seq-feature{height:200px;overflow:hidden;background:#333}.seq .seq-feature>div{width:100%;height:100%;background-repeat:none;background-position:50% 50%;background-size:cover}.seq .seq-feature>div img{display:none}.seq .seq-in .seq-content{opacity:1;-webkit-transform:translateY(0) translateZ(0);-ms-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.seq .seq-out .seq-content{opacity:1;-webkit-transform:translateY(0) translateZ(0);-ms-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.seq.seq-fallback .seq-nav{width:100%;left:0;border-radius:0;margin-top:-40px}.seq.seq-fallback .seq-next-button{display:none!important}.seq.seq-fallback .seq-tooltip{margin-top:-16px}@media only screen and (max-width:768px){.seq.seq-reversed .seq-content{opacity:1;-webkit-transform:translateY(0) translateZ(0);-ms-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}}@media only screen and (min-width:769px){.seq,body,html{height:100%}.seq .seq-canvas>*{overflow:hidden}.seq .seq-attribution{position:absolute;top:0;right:0;max-width:40%;background:#000;background:rgba(0,0,0,.6);color:#fff;text-align:left}.seq .seq-attribution a{color:#ccc}.seq .seq-attribution a:focus,.seq .seq-attribution a:hover{color:#fff}.seq.seq-active .seq-next-button{display:block}.seq .seq-next-button{cursor:pointer;position:absolute;z-index:10;bottom:1em;left:50%;width:66px;color:#fff;-webkit-transform:translateX(-50%) translateZ(100px);-ms-transform:translateX(-50%) translateZ(100px);transform:translateX(-50%) translateZ(100px);-webkit-transition-duration:.1s;transition-duration:.1s;-webkit-transition-property:-webkit-transform;transition-property:transform}.seq.seq-no-touch .seq-next-button:hover{-webkit-transform:translateX(-50%) translateZ(100px) scale(1.2);-ms-transform:translateX(-50%) translateZ(100px) scale(1.2);transform:translateX(-50%) translateZ(100px) scale(1.2)}.seq .seq-canvas,.seq .seq-canvas>*,.seq .seq-screen{position:absolute;height:100%;width:100%;margin:0;padding:0;list-style:none}.seq .seq-canvas{white-space:normal}.seq .seq-half{position:absolute;top:0;bottom:0;width:50%}.seq .seq-nav{top:50%;left:auto;right:1em;height:auto;width:1em;background:0 0;-webkit-transform:translateY(-50%) translateZ(100px);-ms-transform:translateY(-50%) translateZ(100px);transform:translateY(-50%) translateZ(100px)}.seq .seq-pagination li{display:block;margin:0;margin-bottom:1em;font-size:16px}.seq .seq-pagination li:hover .seq-tooltip{opacity:1;visibility:visible;-webkit-transform:translateY(-50%) translateZ(0);-ms-transform:translateY(-50%) translateZ(0);transform:translateY(-50%) translateZ(0)}.seq .seq-pagination li:after{left:50%;top:100%;width:2px;height:1.25em;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)}.seq .seq-tooltip{cursor:default;pointer-events:none;white-space:nowrap;opacity:0;visibility:hidden;display:block;position:absolute;top:50%;right:1em;margin-right:1em;padding:.5em 1em;background:#fff;font-family:Oswald,sans-serif;font-size:.875em;font-weight:400;color:#000;-webkit-transform:translateY(-30%) translateZ(0);-ms-transform:translateY(-30%) translateZ(0);transform:translateY(-30%) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:-webkit-transform,opacity;transition-property:transform,opacity}.seq .seq-swipe,.seq.seq-touch .seq-tooltip{display:none}.seq .seq-feature{left:auto;right:0;height:auto;-webkit-transform:translateY(100%) translateZ(0);-ms-transform:translateY(100%) translateZ(0);transform:translateY(100%) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:-webkit-transform;transition-property:transform}.seq .seq-feature>div{-webkit-transform:translateY(-80%) translateZ(0);-ms-transform:translateY(-80%) translateZ(0);transform:translateY(-80%) translateZ(0);-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:-webkit-transform;transition-property:transform}.seq .seq-content{-webkit-transform:translateY(100%) translateZ(0);-ms-transform:translateY(100%) translateZ(0);transform:translateY(100%) translateZ(0);-webkit-transition-property:-webkit-transform,opacity;transition-property:transform,opacity;-webkit-transition-delay:0s;transition-delay:0s}.seq .seq-in .seq-content,.seq .seq-in .seq-feature,.seq .seq-in .seq-feature>div{-webkit-transform:translateY(0) translateZ(0);-ms-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.seq .seq-out .seq-feature,.seq .seq-out .seq-feature>div{-webkit-transform:translateY(0) translateZ(0);-ms-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.seq .seq-out .seq-content{-webkit-transform:translateY(-100%) translateZ(0);-ms-transform:translateY(-100%) translateZ(0);transform:translateY(-100%) translateZ(0)}.seq.seq-reversed .seq-canvas>:first-of-type,.seq.seq-reversed .seq-canvas>:last-of-type{-webkit-transition-delay:.5s;transition-delay:.5s;-webkit-transition-property:opacity,-webkit-transform,z-index!important;transition-property:opacity,transform,z-index!important}.seq.seq-fallback .seq-nav{width:1em;left:auto;margin-top:0}}@media only screen and (min-height:400px){.seq .seq-next-button{bottom:2em}}@media only screen and (min-width:769px) and (min-height:400px){.seq .seq-content h2{font-size:2.25em}}@media only screen and (min-height:520px) and (max-width:768px){.seq .seq-nav{top:300px}.seq .seq-feature{height:300px}}@media only screen and (min-height:620px) and (max-width:768px){.seq .seq-nav{top:400px}.seq .seq-feature{height:400px}}