// Generated by compass-jquery-plugin/gem-tasks/jqtouch.rake * { margin: 0; padding: 0; } a { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none; } #jqt { -webkit-text-size-adjust: none; -webkit-user-select: none; bottom: 0; font-family: "Helvetica Neue", Helvetica; left: 0; position: absolute; right: 0; top: 0; .selectable, input, textarea { -webkit-user-select: auto; } &.notransform { -webkit-transform: none !important; } > { * { -webkit-box-sizing: border-box; display: none; left: 0; min-height: 100%; overflow-x: hidden; position: absolute; width: 100%; z-index: 0; } .current { display: block !important; z-index: 10; } } .in, .out { -webkit-animation-duration: 250ms; -webkit-animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; } .in { z-index: 10; } .out { z-index: 0 !important; } &.supports3d { -webkit-perspective: 800; -webkit-transform-style: preserve-3d; > * { -webkit-transform: translate3d(0, 0, 0) rotate(0) scale(1); } } .fade { &.in { -webkit-animation-name: fadeIn; } &.out { -webkit-animation-name: fadeOut; } } .pop { &.in { -webkit-animation-name: popIn; } &.out { -webkit-animation-name: popOut; } } .slideleft { &.in { -webkit-animation-name: slideLeftIn; } &.out { -webkit-animation-name: slideLeftOut; } } .slideright { &.in { -webkit-animation-name: slideRightIn; } &.out { -webkit-animation-name: slideRightOut; } } .slideup { &.in { z-index: 10; -webkit-animation-name: slideUpIn; } &.out { z-index: 0; -webkit-animation-name: slideUpOut; } } .slidedown { &.in { z-index: 0; -webkit-animation-name: slideDownIn; } &.out { z-index: 10; -webkit-animation-name: slideDownOut; } } .flipleft { -webkit-backface-visibility: hidden; &.in { -webkit-animation-name: flipLeftIn; } &.out { -webkit-animation-name: flipLeftOut; } } .flipright { -webkit-backface-visibility: hidden; &.in { -webkit-animation-name: flipRightIn; } &.out { -webkit-animation-name: flipRightOut; } } .swapright { -webkit-animation-duration: .7s; -webkit-transform: perspective(800); -webkit-animation-timing-function: ease-out; &.in { -webkit-animation-name: swapRightIn; } &.out { -webkit-animation-name: swapRightOut; } } .swapleft { -webkit-animation-duration: .7s; -webkit-transform: perspective(800); -webkit-animation-timing-function: ease-out; &.in { -webkit-animation-name: swapLeftIn; } &.out { -webkit-animation-name: swapLeftOut; } } .cubeleft { -webkit-animation-duration: .55s; &.in { -webkit-transform-origin: 100% 50%; -webkit-animation-name: cubeLeftIn; } &.out { -webkit-transform-origin: 0% 50%; -webkit-animation-name: cubeLeftOut; } } .cuberight { -webkit-animation-duration: .55s; &.in { -webkit-transform-origin: 0% 50%; -webkit-animation-name: cubeRightIn; } &.out { -webkit-transform-origin: 100% 50%; -webkit-animation-name: cubeRightOut; } } } /* Fade */ @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* Pop */ @-webkit-keyframes popIn { 0% { -webkit-transform: scale(0.2); opacity: 0; } 100% { -webkit-transform: scale(1); opacity: 1; } } @-webkit-keyframes popOut { 0% { -webkit-transform: scale(1); opacity: 1; } 100% { -webkit-transform: scale(0.2); opacity: 0; } } /* Slide Left */ @-webkit-keyframes slideLeftIn { 0% { -webkit-transform: translateX(100%); } 100% { -webkit-transform: translateX(0); } } @-webkit-keyframes slideLeftOut { 0% { -webkit-transform: translateX(0px); } 100% { -webkit-transform: translateX(-100%); } } /* Slide Right */ @-webkit-keyframes slideRightIn { 0% { -webkit-transform: translateX(-100%); } 100% { -webkit-transform: translateX(0); } } @-webkit-keyframes slideRightOut { 0% { -webkit-transform: translateX(0); } 100% { -webkit-transform: translateX(100%); } } /* Slide Up */ @-webkit-keyframes slideUpIn { 0% { -webkit-transform: translateY(100%); } 100% { -webkit-transform: translateY(0); } } @-webkit-keyframes slideUpOut { 0% { -webkit-transform: translateY(0); } 100% { -webkit-transform: translateY(0); } } /* Slide Down */ @-webkit-keyframes slideDownIn { 0% { -webkit-transform: translateY(0); } 100% { -webkit-transform: translateY(0); } } @-webkit-keyframes slideDownOut { 0% { -webkit-transform: translateY(0); } 100% { -webkit-transform: translateY(100%); } } /* Flip Left */ @-webkit-keyframes flipLeftIn { 0% { -webkit-transform: rotateY(-180deg) scale(0.8); } 100% { -webkit-transform: rotateY(0deg) scale(1); } } @-webkit-keyframes flipLeftOut { 0% { -webkit-transform: rotateY(0deg) scale(1); } 100% { -webkit-transform: rotateY(180deg) scale(0.8); } } /* Flip Right */ @-webkit-keyframes flipRightIn { 0% { -webkit-transform: rotateY(180deg) scale(0.8); } 100% { -webkit-transform: rotateY(0deg) scale(1); } } @-webkit-keyframes flipRightOut { 0% { -webkit-transform: rotateY(0deg) scale(1); } 100% { -webkit-transform: rotateY(-180deg) scale(0.8); } } /* Swap Right */ @-webkit-keyframes swapRightIn { 0% { -webkit-transform: translate3d(0px, 0px, -800px) rotateY(70deg); opacity: 0; } 35% { -webkit-transform: translate3d(-180px, 0px, -400px) rotateY(20deg); opacity: 1; } 100% { -webkit-transform: translate3d(0px, 0px, 0px) rotateY(0deg); opacity: 1; } } @-webkit-keyframes swapRightOut { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotateY(0deg); opacity: 1; } 35% { -webkit-transform: translate3d(180px, 0px, -400px) rotateY(-20deg); opacity: .5; } 100% { -webkit-transform: translate3d(0px, 0px, -800px) rotateY(-70deg); opacity: 0; } } /* Swap Left */ @-webkit-keyframes swapLeftIn { 0% { -webkit-transform: translate3d(0px, 0px, -800px) rotateY(-70deg); opacity: 0; } 35% { -webkit-transform: translate3d(180px, 0px, -400px) rotateY(-20deg); opacity: 1; } 100% { opacity: 1; -webkit-transform: translate3d(0px, 0px, 0px) rotateY(0deg); } } @-webkit-keyframes swapLeftOut { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotateY(0deg); opacity: 1; } 35% { -webkit-transform: translate3d(-180px, 0px, -400px) rotateY(20deg); opacity: .5; } 100% { -webkit-transform: translate3d(0px, 0px, -800px) rotateY(70deg); opacity: 0; } } /* Cube Left */ @-webkit-keyframes cubeLeftIn { 0% { -webkit-transform: rotateY(90deg) translateZ(100%) scale(0.5); opacity: .5; } 100% { -webkit-transform: rotateY(0deg) translateZ(0) scale(1); opacity: 1; } } @-webkit-keyframes cubeLeftOut { 0% { -webkit-transform: rotateY(0deg) translateX(0) scale(1); opacity: 1; } 100% { -webkit-transform: rotateY(-90deg) translateZ(100%) scale(0.5); opacity: .5; } } /* Cube Right */ @-webkit-keyframes cubeRightIn { 0% { -webkit-transform: rotateY(-90deg) translateZ(100%) scale(0.5); opacity: .5; } 100% { -webkit-transform: rotateY(0deg) translateZ(0) scale(1); opacity: 1; } } @-webkit-keyframes cubeRightOut { 0% { -webkit-transform: rotateY(0deg) translateX(0) scale(1); opacity: 1; } 100% { -webkit-transform: rotateY(90deg) translateZ(100%) scale(0.5); opacity: .5; } } /** * * * * * */ .horizontal-scroll { width: 320px; height: 100%; overflow: hidden; padding: 0; .scroll-container { width: 320px; height: 100%; overflow: hidden; padding: 0; } } .horizontal-slide { width: 320px; height: 100%; overflow: hidden; padding: 0; .slide-container { width: 320px; height: 100%; overflow: hidden; padding: 0; } } .landscape { .horizontal-scroll { width: 480px; .scroll-container { width: 480px; } } .horizontal-slide { width: 480px; .slide-container { width: 480px; } } } .profile { .horizontal-scroll { width: 320px; .scroll-container { width: 320px; } } .horizontal-slide { width: 320px; .slide-container { width: 320px; } } } .vertical-scroll, .vertical-slide { position: relative; z-index: 1; overflow: hidden; height: 370px; } .fullscreen.profile { .vertical-scroll, .vertical-slide { height: 420px; } } .landscape { .vertical-scroll, .vertical-slide { height: 230px; } } .fullscreen.landscape { .vertical-scroll, .vertical-slide { height: 255px; } } .vertical-scroll > div, .vertical-slide > div { margin: 0 auto; padding-bottom: 5px; } .fullscreen { .vertical-scroll > div, .vertical-slide > div { padding-bottom: 10px; } .vertical-scroll.use-bottom-toolbar > div, .vertical-slide.use-bottom-toolbar > div { padding-bottom: 0; } } .vertical-scroll.use-bottom-toolbar, .vertical-slide.use-bottom-toolbar { height: 325px !important; } .fullscreen.profile { .vertical-scroll.use-bottom-toolbar, .vertical-slide.use-bottom-toolbar { height: 370px !important; } } .landscape { .vertical-scroll.use-bottom-toolbar, .vertical-slide.use-bottom-toolbar { height: 185px !important; } } .fullscreen.landscape { .vertical-scroll.use-bottom-toolbar, .vertical-slide.use-bottom-toolbar { height: 210px !important; } } #sw-wrapper { position: absolute; z-index: 1000; left: 0; width: 100%; display: inline !important; min-height: 0px !important; font-family: helvetica, sans-serif; background: rgba(0, 0, 0, 0.7); text-align: left; } #sw-header { position: relative; width: 100%; height: 43px; border-top: 1px solid #000; border-bottom: 1px solid #000; background: image_url("jquery/touch/sw/header.png") 0 0 repeat-x; opacity: 0.9; } #sw-cancel, #sw-done { position: absolute; top: 7px; height: 20px; line-height: 20px; padding: 0 5px; margin: 0; border-width: 5px; font-size: 12px; font-weight: bold; text-shadow: rgba(0, 0, 0, 0.8) 0 -1px 0; color: #fff; } #sw-cancel { left: 7px; float: left; -webkit-border-image: image_url("jquery/touch/sw/button-cancel.png") 5; } #sw-done { right: 7px; float: right; -webkit-border-image: image_url("jquery/touch/sw/button-done.png") 5; } .sw-pressed { opacity: 0.4; } #sw-slots-wrapper { position: relative; z-index: 999; display: block; height: 215px; padding: 0 11px; overflow: hidden; } #sw-slots { display: table; width: 100%; background: #fcfcfc; div { display: table-cell; height: 100%; padding-top: 86px; border-left: 2px solid #0d0e0f; background-color: #fcfcfc; background-image: image_url("jquery/touch/sw/slot-border.png"); background-position: 0 0, 100% 0; background-repeat: repeat-y; &:first-child { border: 0; } } ul { padding: 0 0 85px 0; margin: 0; list-style: none; } .sw-right { text-align: right; } .sw-shrink { width: 1%; } .sw-readonly { background: #ddd; } li { border-top: 0px solid black !important; color: black !important; padding: 0 8px; height: 44px; overflow: hidden; font: bold 16px / 44px Helvetica, sans-serif; } } #sw-frame { position: absolute; z-index: 1000; left: 0; right: 0; bottom: 0; height: 183px; border-width: 16px; -webkit-border-image: image_url("jquery/touch/sw/alpha.png") 16; } /* Copyright (C) 2008, 2009 Charles Ying. All Rights Reserved. This distribution is released under the BSD license. http://css-vfx.googlecode.com/ See the README for documentation and license. */ .zflow { -webkit-touch-callout: none; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .gallery div.centering { /* position: absolute; */ -webkit-perspective: 600; -webkit-transform-style: preserve-3d; -webkit-transform: translate3d(0, 0, 0); } .zflow div { &.tray { position: absolute; left: 50%; top: 50%; -webkit-transform-style: preserve-3d; /* -webkit-transform: translate3d(0, 0, 0); */ -webkit-transform: translateX(0px); -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; } &.cell { position: absolute; -webkit-transform-style: preserve-3d; /* -webkit-transform: translate3d(0, 0, 0); */ -webkit-transform: translateX(0px); -webkit-transition-property: -webkit-transform opacity; -webkit-transition-duration: 0.4s; -webkit-transition-timing-function: ease-out; img, canvas { position: absolute; } caption { position: absolute; text-align: left; } } } /* Added the caption style */ /* ##################################################################### jQTouch iCal, 1.0 alpha @created by Bruno Alexandre, 26.03.2010 twitter.com/balexandre balexandre.com bruno.in.dk [at] gmail.com ###################################################################### */ #ical { color: #3F4E5E; float: left; background-color: #fff; width: 320px; table { border-collapse: separate; /*border: 0px solid #9DABCE; border-width: 0px 0px 1px 1px;*/ /*margin: 10px auto;*/ font-size: 20px; } td { background: image_url("jquery/touch/ical/cells.png") repeat scroll 0 0 transparent; border-color: #A3A7AF; border-style: solid; border-width: 0 1px 1px 0; font-weight: bold; height: 43px; position: relative; text-align: center; vertical-align: middle; width: 45px; &:last-child { border-right: 0px; width: 44px; } } th:last-child { border-right: 0px; width: 44px; } td { &.padding { background: image_url("jquery/touch/ical/calpad.jpg"); } &.hasevent {} &.prevmonth, &.nextmonth { color: #89909A; } &.today { background-position: 90px 0px; color: white; } &.selected { background-position: 45px 0px; color: white; } &.date_has_event { background-position: 0px -43px; } &.today_date_has_event { background-position: 90px 43px; color: white; } &.selected_date_has_event { background-position: 45px 43px; color: white; } } thead { background: white image_url("jquery/touch/ical/header.png") repeat-x; th { font-size: 8px; vertical-align: bottom; padding-bottom: 3px; color: #6c6c6c; height: 40px; &:first-child { background-image: image_url("jquery/touch/ical/header_left.png"); cursor: pointer; } &:last-child { background-image: image_url("jquery/touch/ical/header_right.png"); cursor: pointer; } } } tfoot th { background: white image_url("jquery/touch/ical/footer.png") repeat-x; height: 21px; border-bottom: 0; } thead th span { font-size: 20px; height: 30px; left: 45px; position: absolute; text-align: center; top: 50px; width: 230px; z-index: 999; } ul { list-style-type: none; margin: 0; padding: 0; border: 0; width: 320px; -webkit-border-radius: 0px; li { min-height: 30px; font-weight: bold; span { font-size: 10px; padding-right: 10px; } a { display: inline; } } .no-event { color: #ccc; text-align: center; height: 65px; } } .bottom-bar { background: transparent image_url("jquery/touch/ical/bottom_bar.png") no-repeat scroll 0 0; bottom: 0; height: 44px; margin-top: 1px; width: 320px; ul { list-style-type: none; margin: 0; padding: 0; border: 0; width: 320px; height: 40px; } li { display: -webkit-inline-box; padding: 0; margin: 0; margin-top: 5px; } .bottom-bar-today { width: 56px; margin: 0 12px 0 6px; } .bottom-bar-list, .bottom-bar-day, .bottom-bar-month { width: 50px; } } } /*** Events ***/ /** * * * @author Sam Shull * @copyright 2010 Sam Shull * * Special Thanks to Steve Simitzis * * @license * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is * furnished to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in * all copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. * * */ #jqt .jqt-photo { &.jqt-photo-toolbar-hidden .toolbar { opacity: 0; display: none; } .jqt-photo-image-slide { .jqt-photo-not-loaded { background: black image_url("jquery/touch/photo/loading.gif") no-repeat center center; } .jqt-photo-img { max-width: 100%; max-height: 100%; vertical-align: middle; border: none; outline: none; background: #000; } img.jqt-photo-presized { max-width: auto; max-height: auto; } > div { position: relative; .jqt-photo-caption { position: absolute; line-height: 20px; vertical-align: top; width: 100%; z-index: 10; text-align: center; color: #FFF; } } } .jqt-photo-table { height: 100%; background: #000; } height: 100%; width: 100%; overflow: hidden; background: #000; color: #FFF; &.animating { display: block; } .jqt-photo-image-slide > div { display: box; box-orient: horizontal; box-orient: vertical; box-align: stretch; box-pack: center; display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-orient: vertical; -webkit-box-align: stretch; -webkit-box-pack: center; border-spacing: 0 10px 0 0; overflow: hidden; text-align: center; } &.jqt-photo-toolbar-animation-in .toolbar { opacity: 1; } &.jqt-photo-toolbar-animation-out .toolbar { opacity: 0; } .toolbar { width: 100%; position: absolute; top: 0; z-index: 20; background: transparent image_url("jquery/touch/photo/toolbar.png") repeat-x; -webkit-transition-duration: .65s; -webkit-transition-property: opacity; .back { -webkit-border-image: image_url("jquery/touch/photo/btnBack.png") 0 5 0 15; } } .toolbar-bottom { padding: 0; font-size: 30px; text-align: center; vertical-align: top; div { display: inline-block; padding: 0; width: 50px; height: 100%; } } .jqt-photo-prev { background: image_url("jquery/touch/photo/navPrev.png") no-repeat center center; } .jqt-photo-play { background: image_url("jquery/touch/photo/navPlay.png") no-repeat center center; } .jqt-photo-next { background: image_url("jquery/touch/photo/navNext.png") no-repeat center center; } .toolbar-bottom .jqt-photo-pause { display: none; background: image_url("jquery/touch/photo/navPause.png") no-repeat center center; } .jqt-photo-prev.hover { background: -webkit-gradient(radial, 50% 50%, 2, 50% 50%, 25, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0))) no-repeat center center, image_url("jquery/touch/photo/navPrev.png") no-repeat center center; } .jqt-photo-play.hover { background: -webkit-gradient(radial, 50% 50%, 2, 50% 50%, 25, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0))) no-repeat center center, image_url("jquery/touch/photo/navPlay.png") no-repeat center center; } .jqt-photo-next.hover { background: -webkit-gradient(radial, 50% 50%, 2, 50% 50%, 25, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0))) no-repeat center center, image_url("jquery/touch/photo/navNext.png") no-repeat center center; } .toolbar-bottom .jqt-photo-pause.hover { background: -webkit-gradient(radial, 50% 50%, 2, 50% 50%, 25, from(rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0))) no-repeat center center, image_url("jquery/touch/photo/navPause.png") no-repeat center center; } &.jqt-photo-playing { .jqt-photo-pause { display: inline-block; } .jqt-photo-play { display: none; } } } /* animations are part off jqtouch */ /* toolbar */ /* slideshow no images - doesn't look right * / #jqt .jqt-photo .toolbar-bottom{line-height:100%;vertical-align:middle;font-size:1.5em;} #jqt .jqt-photo .jqt-photo-play:before{content:"\25B6";} #jqt .jqt-photo .jqt-photo-prev:before, #jqt .jqt-photo .jqt-photo-next:before{content:"\27A1";} #jqt .jqt-photo .jqt-photo-prev{-webkit-transform:matrix(-1,0,0,1,0,0);}/* webkit doesnt support leftward arrow, so we flip the rightward arrow * / #jqt .jqt-photo .jqt-photo-pause:before{content:"\2759\2759";} #jqt .jqt-photo .toolbar-bottom .jqt-photo-pause{display:none;} /* slideshow images */ /* hovers */ /* */