diff options
| author | Julie Lala <jules@okfoc.us> | 2015-04-09 06:02:55 -0400 |
|---|---|---|
| committer | Julie Lala <jules@okfoc.us> | 2015-04-09 06:02:55 -0400 |
| commit | 36da66908e8b124c4846a82ad4ccc2d1749e0b15 (patch) | |
| tree | 0b46b2b9e18f1155d0474cafa23d76c2b8046df6 /site/public/style.css | |
| parent | c65de768ccd5111567732854ca4ce50dbeebd6ea (diff) | |
moving assets
Diffstat (limited to 'site/public/style.css')
| -rw-r--r-- | site/public/style.css | 845 |
1 files changed, 0 insertions, 845 deletions
diff --git a/site/public/style.css b/site/public/style.css deleted file mode 100644 index 2ca71b4..0000000 --- a/site/public/style.css +++ /dev/null @@ -1,845 +0,0 @@ -@font-face { - font-family: 'BellGothic-Light'; - src: url('fonts/BellGotLig.eot'); -} - -@font-face { - font-family: 'BellGothic-Light'; - src: url('fonts/BellGotLig.woff') format('woff'), - url('fonts/BellGotLig.svg#BellGothic-Light') format('svg'); -} - -@font-face { - font-family: 'BellGothic-Bold'; - src: url('fonts/BellGotBol.eot'); -} - -@font-face { - font-family: 'BellGothic-Bold'; - src: url('fonts/BellGotBol.woff') format('woff'), - url('fonts/BellGotBol.svg#BellGothic-Bold') format('svg'); -} -.loading * { - -webkit-transition: none !important; - -moz-transition: none !important; - -ms-transition: none !important; - -o-transition: none !important; -} - - -*, *:active{ - outline:0; - box-sizing: border-box; -} -::selection { - background: #000; - color:white; -} -::-moz-selection { - background: #000; - color:white; -} -html,body{ - width:100%; - height:100%; - margin:0; - padding:0; - box-sizing: border-box; - text-rendering: optimizeLegibility; -} -body { - background: #eee; - font-family: 'BellGothic-Light'; - font-size:16px; -} -/*! Flickity v1.0.0 -http://flickity.metafizzy.co ----------------------------------------------- */ - -.flickity-enabled { - position: relative; -} - -.flickity-enabled:focus { outline: none; } - -.flickity-viewport { - overflow: hidden; - position: relative; - height: 100%; -} - -.flickity-slider { - position: absolute; - width: 100%; - height: 100%; -} - -/* draggable - -.flickity-enabled.is-draggable { --webkit-user-select: none; --moz-user-select: none; --ms-user-select: none; -user-select: none; -} - -.flickity-enabled.is-draggable .flickity-viewport { -cursor: move; -cursor: -webkit-grab; -cursor: grab; -} - -.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { -cursor: -webkit-grabbing; -cursor: grabbing; -} -*/ - -/* ---- previous/next buttons ---- */ - -.flickity-prev-next-button { - position: absolute; - top: 50%; - width: 44px; - height: 44px; - border: none; - border-radius: 50%; - background: white; - background: hsla(0, 0%, 100%, 0.75); - cursor: pointer; - /* vertically center */ - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); -} - -.flickity-prev-next-button:hover { background: white; } - -.flickity-prev-next-button:focus { - outline: none; - box-shadow: 0 0 0 5px #09F; -} - -.flickity-prev-next-button:active { - filter: alpha(opacity=60); /* IE8 */ - opacity: 0.6; -} - -.flickity-prev-next-button.previous { left: 10px; } -.flickity-prev-next-button.next { right: 10px; } -/* right to left */ -.flickity-rtl .flickity-prev-next-button.previous { - left: auto; - right: 10px; -} -.flickity-rtl .flickity-prev-next-button.next { - right: auto; - left: 10px; -} - -.flickity-prev-next-button:disabled { - filter: alpha(opacity=30); /* IE8 */ - opacity: 0.3; - cursor: auto; -} - -.flickity-prev-next-button svg { - position: absolute; - left: 20%; - top: 20%; - width: 60%; - height: 60%; -} - -.flickity-prev-next-button .arrow { - fill: #333; -} - -/* color & size if no SVG - IE8 and Android 2.3 */ -.flickity-prev-next-button.no-svg { - color: #333; - font-size: 26px; -} - -/* ---- page dots ---- */ - -.flickity-page-dots { - position: absolute; - width: 100%; - bottom: -25px; - padding: 0; - margin: 0; - list-style: none; - text-align: center; - line-height: 1; -} - -.flickity-rtl .flickity-page-dots { direction: rtl; } - -.flickity-page-dots .dot { - display: inline-block; - width: 10px; - height: 10px; - margin: 0 8px; - background: #333; - border-radius: 50%; - filter: alpha(opacity=25); /* IE8 */ - opacity: 0.25; - cursor: pointer; -} - -.flickity-page-dots .dot.is-selected { - filter: alpha(opacity=100); /* IE8 */ - opacity: 1; -} -#scene { - position: absolute; - transition: 0.2s margin-left, 0.2s opacity; - top: 0; - left: 0; - width: 100%; - height: 100%; - cursor: -webkit-grab; - cursor: -moz-grab; - cursor: grab; -} -#scene:active { - cursor: -webkit-grabbing; - cursor: -moz-grabbing; -} - -nav { - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - z-index:6; - color:black; - font-size:0.8em; - text-transform: uppercase; - display: table; - background: white; - height:100vh; - position: fixed; - width: 160px; - left:0; - opacity:0.8; - -moz-transform: translateX(-160px) scale(0.7, 1) skewY(-5deg); - -webkit-transform: translateX(-160px) scale(0.7, 1) skewY(-5deg); - transform: translateX(-160px) scale(0.7, 1) skewY(-5deg); - -moz-transition: 0.2s -webkit-transform, 0.4s opacity; - -webkit-transition: 0.2s -webkit-transform, 0.4s opacity; - transition: 0.2s transform, 0.4s opacity; -} -.toplogo { - width:130px; - margin: 55px 7px 0px 7px; - opacity: 0.8; - margin-bottom: 0.6em; - border-top: 1px solid #222; - padding-top: 10px; -} -.toplogo:hover { - cursor:pointer; - opacity:1; -} -.menuActive nav { - opacity:1; - -moz-transform:translateX(0%)scale(1)skewY(0deg); - -webkit-transform:translateX(0%)scale(1)skewY(0deg); - transform:translateX(0%)scale(1)skewY(0deg); -} - -nav .top, nav .middle, nav .bottom { - display: table-row; - width: 100%; - overflow:hidden; -} - -nav .top { - background: ghostwhite; -} - -nav .top .cat:first-child { - margin-top:30px; -} -nav .middle { - background: #ddd; -} - -nav .bottom { - width: 100%; - background: #44D3D3; -} -nav a { - text-decoration:none; - display:inline-block; - width:100%; - color:black; -} - -nav .cat:hover { - cursor:pointer; - background:#eee; -} - - -nav a.active:hover { - cursor:default; -} -nav .cat { - padding: 3px 0 3px 10px; -} - -nav .cat.active { - cursor: default; - display: inline-block; - font-family: 'BellGothic-Bold'; -} -nav .top .cat.active:hover { - background:transparent; -} - -.middle .cat.active, .bottom .cat.active { - background:#eee; - width:100%; - font-family: 'BellGothic-Light'; -} - -nav .sub { - display:inline; - overflow:hidden; - max-height:0; - transition:0.7s max-height linear; - width:100%; -} - -nav .sub.active { - display: inline-block; - max-height:180px; -} - -nav .sub a { - height:0; - max-height:0; - position:absolute; - display:inline-block; - overflow:hidden; - width:0; - opacity:0; - cursor:pointer; - float: left; - -moz-transform:translateY(-5px)scale(0.7, 0.9)skew(30deg); - -webkit-transform:translateY(-5px)scale(0.7, 0.9)skew(30deg); - transform:translateY(-5px)scale(0.7, 0.9)skew(30deg); - -moz-transition:0.7s -moz-transform linear, 0.2s opacity ease-in, 0.4s max-height linear; - -webkit-transition:0.7s -webkit-transform linear, 0.2s opacity ease-in, 0.4s max-height linear; - transition:0.7s transform linear, 0.2s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(1) { - transition:0.2s transform linear, 0.2s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(2) { - transition:0.4s transform linear, 0.4s opacity ease-in, 0.4s max-height linear; -} -nav .sub a:nth-child(3) { - transition:0.6s transform linear, 0.6s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(4) { - transition:0.8s transform linear, 0.8s opacity ease-in, 0.4s max-height linear; -} -nav .sub a:nth-child(5) { - transition:1s transform linear, 1s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(6) { - transition:1.1s transform linear, 1.1s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(7) { - transition:1.2s transform linear, 1.2s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(8) { - transition:1.3s transform linear, 1.3s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(9) { - transition:1.4s transform linear, 1.4s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(10) { - transition:1.5s transform linear, 1.5s opacity ease-in, 0.4s max-height linear; -} - -nav .sub a:nth-child(11) { - transition:1.6s transform linear, 1.6s opacity ease-in, 0.4s max-height linear; -} - - -nav .sub.active a { - height:auto; - position:relative; - width:100%; - max-height:40px; - padding: 3px 0 5px 20px; - opacity:1; - -webkit-transform:translateY(0)scale(1)skew(0deg); - -moz-transform:translateY(0)scale(1)skew(0deg); - transform:translateY(0)scale(1)skew(0deg); -} - -nav a.active, nav .sub a:hover { - text-decoration:none; - background:#eee; - color:black; -} - -.entry { - color: #333; - float: left; - padding: 40px 20px; - border-bottom: 0; - margin-bottom: 2em; - display: inline-block; - width: 80%; - width: calc(87% - 80px); - margin-left: 160px; -} -.entry h1{ - margin-bottom: 1.2em; - border-bottom: 1px solid; - font-size: 0.6em; - letter-spacing:0.1em; -} -.entry span{ - float: left; - width: 100%; -} - -.postname { - border-bottom: 1px solid #999; - padding: 20px 0px 0.6em 2px; - margin-bottom: 1em; - font-size: 1em; -} - - -.credit { - margin: 4em 0px 0px 0px; - padding: 11px 0px; - border-top: 1px solid; - float: left; - width: 100%; - color: #909090; -} - -.credit a { - display:inline-block; - opacity:0.9; -} -.credit a:hover { - opacity:1; -} - -.credit a img { - width:18px; -} - -.mx-object3d .image{ - box-shadow:5px -10px 20px rgba(0,0,0,0.1); -} - - -.entry h1 { - margin-bottom: 10px; - border-bottom: 0px solid; - -} - -.entry span div.content { - max-width:100%; - font-size: 0.8em; - line-height: 1.5em; - float:left; - padding-top:20px; - border-top:1px solid #999; - width:100%; - -webkit-column-count: 3; - -moz-column-count: 3; - column-count: 3; -} -.entry span div.content div { - width:50%; - -webkit-column-count: 3; - -moz-column-count: 3; - column-count: 3; -} - - -#scene_container { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - overflow: hidden; -} -#entry_container { - position: absolute; - top: 0; left: 0; - height: 100%; - overflow: auto; - transition: left 0.2s linear, opacity 0.2s; - width: 100%; -} - - -.entry.page img{ - max-width:100%; - max-height: 420px; -} - -.gallery { - width: 100%; - height: 60vh; - overflow: hidden; - float:left; - display:inline-block; - cursor: url(images/next.png), auto!important; - background: url(images/dither.gif); -} -.cell { - display:inline-block; - height:100%; - cursor: url(images/next.png), auto!important; -} -.cell.video { - width: 80%; - background-size: cover; - background-position: center center; -} -.cell.video.playing { - background: black !important; -} -.cell.video.playing .play { - display: none; -} -.cell.video .play { - background-image: url(images/play-button2.png); - background-size: contain; - background-repeat: no-repeat; - background-position: center center; - position: absolute; - cursor: pointer !important; - top: 50%; - left: 50%; - -webkit-transform: translateX(-50%) translateY(-50%); - transform: translateX(-50%) translateY(-50%); - width: 100px; - height: 100px; - opacity: 0.7; - z-index: 4; -} -.cell.video .play:hover { - opacity: 1.0; -} -.cell iframe { - width: 100%; - height: 100%; - opacity:0.2; - -webkit-transition:0.4s opacity ease-in; - transition:0.4s opacity ease-in; - pointer-events: none; -} -.cell iframe { - height: 200%; - -webkit-transform: translateY(-25%); - transform: translateY(-25%); -} -.fullscreen { - text-align: right; -} - -:-webkit-full-screen #okgallery { - width: 100%; - height: 100%; -} - -.gallery:fullscreen, -*:-webkit-full-screen .gallery, -*:fullscreen .gallery { - width: 100%; - height: 100%; -} - -:-webkit-full-screen #okgallery { - width: 100%; - height: 100%; -} -.full-screen #okgallery { - width: 100%; - height: 100%; -} -:-webkit-full-screen .cell.video, -.full-screen .cell.video { - width: 100%; -} - -.caption { - background: rgb(223, 223, 223); - text-transform: uppercase; - float: left; - clear: both; - width: 100%; - padding: 2px; - font-size: 0.67em; - margin-bottom: 10px; -} -.caption:after { - content:"VIEW IN FULLSCREEN"; - text-align:right; - float: right; - opacity:0.5; - cursor:pointer; -} -.caption:hover { - background:#222; - color:#222; - cursor:pointer; -} -.caption:hover::after { - color:white; - opacity:1; -} -.cell img { - max-height:100%; - opacity:0.0; - transition:0.4s opacity ease-in; -} -.cell img.loaded { - opacity: 0.2; -} -.cell.is-selected img, .cell.is-selected iframe { - opacity:1; - pointer-events: auto; -} -.cell .mask { - z-index: 2; - width: 100%; - height: 100%; - position: absolute; - top: 0; left: 0; -} -.cell.playing .mask { - pointer-events: none; -} -.logo { - position: fixed; - right: 10px; - bottom: 10px; - width: 6%; - max-width:120px; - min-width: 45px; -} -.logo img { - width:100%; -} -.toggleRapper { - width: 50px; - position: fixed; - top: 0; - left: 0; - padding: 25px 4px; - z-index: 5555; - cursor: pointer; - height: 20px; -} -.menuToggle { - display:block; - height:3px; - width:30px; - background:black; - position:relative; - cursor: pointer; - transition:all 0.2s; -} -.menuToggle:before { - content:''; - position:absolute; - top:-10px; - width:30px; - height:3px; - background:#000; - transition:all 0.2s; -} -.menuToggle:after { - content:''; - position:absolute; - top:10px; - width:30px; - height:3px; - background:#000; - transition:all 0.2s; -} -.menuActive .menuToggle { - background:transparent; -} - -.menuActive .menuToggle:before { - -webkit-transform:rotate(45deg); - -moz-transform:rotate(45deg); - transform:rotate(45deg); - top:0; -} - -.menuActive .menuToggle:after { - -webkit-transform:rotate(-45deg); - -moz-transform:rotate(-45deg); - transform:rotate(-45deg); - top:0; -} - -.project { - float: left; - width: 33.33333%; - height: 220px; - padding: 10px; - cursor: pointer; - opacity: 0.0; - font-size: 0.8em; - max-width: 300px; - transition: 0.1s opacity ease-in; - transition-delay:0.4s; -} -.ready .project:hover { - opacity: 1.0; -} -.project img { - width: 100%; -} -.ready .project { - opacity: 0.8; -} -.done.ready .project { - transition-delay: 0; -} -.project:nth-child(1) { - transition-delay:0.05s; -} -.project:nth-child(2) { - transition-delay:0.1s; -} -.project:nth-child(3) { - transition-delay:0.15s; -} -.project:nth-child(4) { - transition-delay:0.2s; -} -.project:nth-child(5) { - transition-delay:0.25s; -} -.project:nth-child(6) { - transition-delay:0.3s; -} -.project:nth-child(7) { - transition-delay:0.35s; -} - -#entry_container.visible { - top: 0%; -} - -.postname, .gallery, .mainimg, .caption, .content, .credit { - -webkit-transform-origin: 100% 10%; - transform-origin: 100% 10%; - -webkit-transform: rotateY(90deg) ; - transform: rotateY(90deg); -} -.ready .postname, .ready .gallery, .ready .mainimg, .ready .caption, .ready .content, .ready .credit { - -webkit-transform: rotateY(0deg); - transform: rotateY(0deg); -} - -.postname { - -webkit-transition: -webkit-transform 0.2s; - transition: transform 0.2s; - -webkit-transition-delay: 0.0s; - transition-delay: 0.0s; -} -.gallery, .mainimg { - -webkit-transition: -webkit-transform 0.2s; - transition: transform 0.1s; - -webkit-transition-delay: 0.1s; - transition-delay: 0.1s; -} -.caption { - -webkit-transition: -webkit-transform 0.2s; - transition: transform 0.2s; - -webkit-transition-delay: 0.2s; - transition-delay: 0.2s; -} -.content { - -webkit-transition: -webkit-transform 0.2s; - transition: transform 0.2s; - -webkit-transition-delay: 0.3s; - transition-delay: 0.3s; -} -.credit { - -webkit-transition: -webkit-transform 0.2s; - transition: transform 0.2s; - -webkit-transition-delay: 0.4s; - transition-delay: 0.4s; -} - - - -@media (max-width:1200px) { - .entry span div.content { - -webkit-column-count: 2; - -moz-column-count: 2; - column-count: 2; - } - -} - -@media (max-width:600px) { - .entry span div.content { - -webkit-column-count: 1; - -moz-column-count: 1; - column-count: 1; - } - #entry_container .entry { - width:100%; - margin-left:0; - } - .logo img { - width:50px; - } - .gallery{ - height:37vh; - } - .caption:after { - content:""; - } - .project { - width: 100%; - padding: 0 0 0 25px; - height: 260px; - } - .menuActive #entry_container { - left:160px; - } - body{ - font-size: 18px; - } -} -.mobile .cell iframe { - position: fixed; /* REALLY WEIRD, vimeo won't play without this! */ - width: 80%; - opacity:0.2; - transition:0.4s opacity ease-in; - z-index: 2; -} |
