Created
January 27, 2014 23:27
-
-
Save jjcall/8659546 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.jackbox-modal { | |
font: 12px Arial, Helvetica, sans-serif; | |
color: #666; | |
line-height: 18px; | |
background: rgba(0, 0, 0, 0.75); | |
-webkit-box-sizing: content-box; | |
-moz-box-sizing: content-box; | |
-o-box-sizing: content-box; | |
-ms-box-sizing: content-box; | |
box-sizing: content-box; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
-o-user-select: none; | |
user-select: none; | |
} | |
.jackbox-modal * { | |
-webkit-box-sizing: content-box; | |
-moz-box-sizing: content-box; | |
-o-box-sizing: content-box; | |
-ms-box-sizing: content-box; | |
box-sizing: content-box; | |
} | |
.jackbox-container img { | |
max-width: none; | |
} | |
.jackbox-modal h2, .jackbox-modal h3 { | |
font: 24px "Mako", sans-serif; | |
font-weight: normal; | |
color: #444; | |
} | |
.jackbox-title-text { | |
font: 14px "Mako", sans-serif; | |
color: #222; | |
} | |
.jackbox-thumb-tip { | |
background: url(../img/graphics/ie_bg.png); | |
background: rgba(0, 0, 0, 0.75); | |
} | |
.jackbox-thumb-tip-text { | |
font: 12px "Mako", sans-serif; | |
text-transform: uppercase; | |
color: #FFF; | |
} | |
.jackbox-description-text { | |
background-color: #FFF; | |
text-align: left; | |
} | |
.jackbox-html>div { | |
background-color: #f5f5f5; | |
border: 1px solid #e5e5e5; | |
text-align: left; | |
} | |
.jackbox-holder { | |
background-color: #FFF; | |
-webkit-border-radius: 5px; | |
-moz-border-radius: 5px; | |
border-radius: 5px; | |
} | |
.jackbox-container { | |
background: #000; | |
background: -moz-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0, rgba(0, 0, 0, 1) 100%); | |
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(68, 68, 68, 1)), color-stop(100%, rgba(0, 0, 0, 1))); | |
background: -webkit-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0, rgba(0, 0, 0, 1) 100%); | |
background: -o-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0, rgba(0, 0, 0, 1) 100%); | |
background: -ms-radial-gradient(center, ellipse cover, rgba(68, 68, 68, 1) 0, rgba(0, 0, 0, 1) 100%); | |
background: radial-gradient(ellipse at center, rgba(68, 68, 68, 1) 0, rgba(0, 0, 0, 1) 100%); | |
} | |
.jackbox-panel:hover { | |
background-color: #333; | |
} | |
.jackbox-panel-left { | |
background-image: url(../img/graphics/panel_left.png); | |
} | |
.jackbox-panel-right { | |
background-image: url(../img/graphics/panel_right.png); | |
} | |
.jackbox-panel-left:hover { | |
-webkit-box-shadow: 5px 0 10px rgba(0, 0, 0, 0.2); | |
-moz-box-shadow: 5px 0 10px rgba(0, 0, 0, 0.2); | |
box-shadow: 5px 0 10px rgba(0, 0, 0, 0.2); | |
border-right: 1px solid #4d4d4d; | |
background-image: url(../img/graphics/panel_left_over.png); | |
} | |
.jackbox-panel-right:hover { | |
-webkit-box-shadow: -5px 0 10px rgba(0, 0, 0, 0.2); | |
-moz-box-shadow: -5px 0 10px rgba(0, 0, 0, 0.2); | |
box-shadow: -5px 0 10px rgba(0, 0, 0, 0.2); | |
border-left: 1px solid #4d4d4d; | |
background-image: url(../img/graphics/panel_right_over.png); | |
} | |
.jackbox-button { | |
width: 20px; | |
height: 20px; | |
background-size: 20px 20px; | |
background-repeat: no-repeat; | |
} | |
.jackbox-arrow-left { | |
background-image: url(../img/graphics/left_arrow.png); | |
} | |
.jackbox-arrow-right { | |
background-image: url(../img/graphics/right_arrow.png); | |
} | |
.jackbox-info { | |
background-image: url(../img/graphics/info.png); | |
} | |
.jackbox-show-thumbs { | |
background-image: url(../img/graphics/thumbs_show.png); | |
} | |
.jackbox-hide-thumbs { | |
background-image: url(../img/graphics/thumbs_hide.png); | |
} | |
.jackbox-close { | |
background-image: url(../img/graphics/exit.png); | |
} | |
.jackbox-fs { | |
background-image: url(../img/graphics/fullscreen.png); | |
} | |
.jackbox-ns { | |
background-image: url(../img/graphics/normalscreen.png); | |
} | |
.jb-info-inactive, .jackbox-button:hover { | |
opacity: .6; | |
} | |
.jackbox-thumb-panel { | |
background: url(../img/graphics/ie_bg.png); | |
background: rgba(0, 0, 0, 0.75); | |
} | |
.jackbox-thumb-left { | |
width: 20px; | |
height: 20px; | |
margin: -9px 0 0 -30px; | |
background-size: 20px 20px; | |
background-repeat: no-repeat; | |
background-image: url(../img/graphics/thumb_left.png); | |
} | |
.jackbox-thumb-right { | |
width: 20px; | |
height: 20px; | |
margin: -9px 0 0 12px; | |
background-size: 20px 20px; | |
background-repeat: no-repeat; | |
background-image: url(../img/graphics/thumb_right.png); | |
} | |
.jackbox-thumb-left:hover, .jackbox-thumb-right:hover { | |
opacity: .70; | |
} | |
.jackbox-pre-outside { | |
padding: 5px; | |
background: url(../img/graphics/ie_preloader.gif); | |
background: -moz-linear-gradient(top, #FFF 0, #FFF 25%, #444 90%); | |
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFF), color-stop(25%, #FFF), color-stop(90%, #444)); | |
background: -webkit-linear-gradient(top, #FFF 0, #FFF 25%, #444 90%); | |
background: -o-linear-gradient(top, #FFF 0, #FFF 25%, #444 90%); | |
background: -ms-linear-gradient(top, #FFF 0, #FFF 25%, #444 90%); | |
background: linear-gradient(to bottom, #FFF 0, #FFF 25%, #444 90%); | |
} | |
.jackbox-pre-inside { | |
background-color: #444; | |
} | |
.jackbox { | |
position: relative; | |
display: inline-block; | |
} | |
.jackbox-modal { | |
position: fixed; | |
left: 0; | |
top: 0; | |
width: 100%; | |
height: 100%; | |
display: none; | |
z-index: 9999; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
-o-user-select: none; | |
user-select: none; | |
} | |
.jackbox-modal h2 { | |
margin: 0 0 12px -2px; | |
} | |
.jackbox-modal h3 { | |
margin: 0 0 8px -2px; | |
} | |
.jackbox-modal ul { | |
margin: 0; | |
padding: 0; | |
} | |
.jackbox-modal li { | |
margin: 0 0 10px 0; | |
padding: 0; | |
} | |
.jackbox-modal li:last-child { | |
margin-bottom: -10px; | |
} | |
.jackbox-html>div { | |
padding: 16px 20px 16px 20px; | |
box-sizing: border-box; | |
} | |
.jackbox-html>div p { | |
margin: 5px 0 0 0; | |
color: #808080; | |
} | |
.jackbox-title-text { | |
position: absolute; | |
left: 6px; | |
top: 7px; | |
width: 100%; | |
overflow: hidden; | |
text-align: center; | |
white-space: nowrap; | |
z-index: 0; | |
} | |
.jackbox-info-text { | |
display: inline-block; | |
overflow-y: auto; | |
z-index: 999; | |
width: 100%; | |
position: absolute; | |
top: 0; | |
left: 0; | |
} | |
.jackbox-description-text { | |
padding: 14px 17px 19px 17px; | |
} | |
.jackbox-html, .jackbox-wrapper, .jackbox-content, .jackbox-description, .jackbox-hidden-items { | |
display: none; | |
} | |
.jackbox-youtube { | |
visibility: hidden; | |
margin: 0 auto; | |
} | |
.jackbox-html { | |
overflow-y: auto; | |
} | |
.jackbox-modal img { | |
image-rendering: optimizeQuality; | |
} | |
.jackbox-holder { | |
position: absolute; | |
left: 50%; | |
top: 50%; | |
width: 100%; | |
height: 100%; | |
overflow: hidden; | |
opacity: 0; | |
padding: 33px 6px 34px 6px; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
-o-user-select: none; | |
user-select: none; | |
} | |
.jackbox-container { | |
width: 100%; | |
height: 100%; | |
position: relative; | |
overflow: hidden; | |
z-index: 0; | |
text-align: center; | |
} | |
.jackbox-content { | |
margin: 0 auto; | |
} | |
.jackbox-overflow { | |
overflow: hidden!important; | |
} | |
.jackbox-thumb-holder { | |
position: absolute; | |
width: 100%; | |
bottom: 0; | |
left: 0; | |
} | |
.jackbox-thumb-panel { | |
position: absolute; | |
left: 50%; | |
overflow: hidden; | |
white-space: nowrap; | |
padding: 2px 2px 0 2px; | |
} | |
.jackbox-thumb-strip { | |
position: relative; | |
} | |
.jackbox-thumb { | |
overflow: hidden; | |
position: absolute; | |
top: 0; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
-o-user-select: none; | |
user-select: none; | |
} | |
.jackbox-thumb img { | |
cursor: pointer; | |
-ms-filter: "alpha(opacity=0)"; | |
filter: alpha(opacity=0); | |
opacity: 0; | |
-webkit-transition: opacity .4s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: opacity .4s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: opacity .4s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: opacity .4s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: opacity .4s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jb-thumb-fadein img { | |
-ms-filter: "alpha(opacity=50)"; | |
filter: alpha(opacity=50); | |
opacity: .5; | |
} | |
.jb-thumb-active img { | |
-ms-filter: "alpha(opacity=100)"; | |
filter: alpha(opacity=100); | |
opacity: 1; | |
} | |
.jb-thumb-hover img:hover { | |
-ms-filter: "alpha(opacity=100)"; | |
filter: alpha(opacity=100); | |
opacity: 1; | |
} | |
.jb-thumb-active img { | |
cursor: auto; | |
} | |
.jackbox-thumb-left, .jackbox-thumb-right { | |
cursor: pointer; | |
position: absolute; | |
display: none; | |
} | |
.jackbox-top { | |
position: absolute; | |
top: 7px; | |
left: 5px; | |
} | |
.jackbox-top:after { | |
content: ""; | |
position: absolute; | |
top: 26px; | |
left: 1px; | |
width: 100%; | |
height: 1px; | |
background-color: #FFF; | |
display: block; | |
z-index: 999; | |
} | |
.jackbox-bottom { | |
position: relative; | |
white-space: nowrap; | |
z-index: 99; | |
} | |
.jackbox-social { | |
position: absolute; | |
} | |
.jackbox-top-icons { | |
position: absolute; | |
right: -1px; | |
} | |
.jackbox-bottom-icons { | |
position: absolute; | |
right: 0; | |
top: 7px; | |
} | |
.jackbox-controls { | |
position: absolute; | |
left: 0; | |
top: 7px; | |
z-index: 1; | |
} | |
.jackbox-button { | |
cursor: pointer; | |
display: inline-block; | |
} | |
.jackbox-arrow-right { | |
margin-left: 6px; | |
} | |
.jackbox-button-margin { | |
margin-left: 6px; | |
} | |
:-webkit-full-screen .jackbox-fs { | |
display: none!important; | |
} | |
:-moz-full-screen .jackbox-fs { | |
display: none!important; | |
} | |
:-webkit-full-screen .jackbox-ns { | |
display: inline-block!important; | |
} | |
:-moz-full-screen .jackbox-ns { | |
display: inline-block!important; | |
} | |
.jackbox-panel { | |
display: block; | |
cursor: pointer; | |
visibility: hidden; | |
background-position: center center; | |
background-repeat: no-repeat; | |
background-size: 38px 38px; | |
width: 58px; | |
height: 100%; | |
position: absolute; | |
top: 0; | |
-ms-filter: "alpha(opacity=0)"; | |
filter: alpha(opacity=0); | |
opacity: 0; | |
-webkit-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox-panel-left { | |
left: 0; | |
} | |
.jackbox-panel-right { | |
right: 0; | |
} | |
.jackbox-preloader { | |
position: fixed; | |
left: 50%; | |
top: 50%; | |
visibility: hidden; | |
width: 20px; | |
height: 20px; | |
margin: -15px 0 0 -15px; | |
z-index: 9999; | |
} | |
.jackbox-spin-preloader { | |
visibility: visible; | |
-webkit-animation: rotator 1s linear infinite; | |
-moz-animation: rotator 1s linear infinite; | |
-ms-animation: rotator 1s linear infinite; | |
-o-animation: rotator 1s linear infinite; | |
animation: rotator 1s linear infinite; | |
} | |
.jackbox-pre-outside { | |
width: 20px; | |
height: 20px; | |
display: inline-block; | |
position: relative; | |
top: -25%; | |
left: -25%; | |
-moz-border-radius: 50%; | |
-webkit-border-radius: 50%; | |
border-radius: 50%} | |
.jackbox-pre-inside { | |
display: none; | |
width: 20px; | |
height: 20px; | |
display: inline-block; | |
position: absolute; | |
top: 5px; | |
left: 5px; | |
-moz-border-radius: 50%; | |
-webkit-border-radius: 50%; | |
border-radius: 50%; | |
-webkit-transition: background-color .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: background-color .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: background-color .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: background-color .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: background-color .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox-thumb-tip { | |
display: block; | |
position: fixed; | |
overflow: hidden; | |
opacity: 0; | |
z-index: 9999; | |
visibility: hidden; | |
pointer-events: none; | |
padding: 5px 10px 5px 10px; | |
-webkit-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox-thumb-tip-text { | |
white-space: nowrap; | |
display: inline-block; | |
text-transform: uppercase; | |
-webkit-transition: width .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: width .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: width .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: width .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: width .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
@-webkit-keyframes rotator { | |
from { | |
-webkit-transform: rotate(0deg); | |
} | |
50% { | |
-webkit-transform: rotate(180deg); | |
} | |
to { | |
-webkit-transform: rotate(360deg); | |
} | |
}@-moz-keyframes rotator { | |
from { | |
-moz-transform: rotate(0deg); | |
} | |
50% { | |
-moz-transform: rotate(180deg); | |
} | |
to { | |
-moz-transform: rotate(360deg); | |
} | |
}@-o-keyframes rotator { | |
from { | |
-o-transform: rotate(0deg); | |
} | |
50% { | |
-o-transform: rotate(180deg); | |
} | |
to { | |
-o-transform: rotate(360deg); | |
} | |
}@-ms-keyframes rotator { | |
from { | |
-ms-transform: rotate(0deg); | |
} | |
50% { | |
-ms-transform: rotate(180deg); | |
} | |
to { | |
-ms-transform: rotate(360deg); | |
} | |
}@keyframes rotator { | |
from { | |
transform: rotate(0deg); | |
} | |
50% { | |
transform: rotate(180deg); | |
} | |
to { | |
transform: rotate(360deg); | |
} | |
}@media screen and (max-width:600px) { | |
.jackbox-panel, .jackbox-thumb-holder { | |
display: none!important; | |
} | |
.jackbox-show-thumbs, .jackbox-hide-thumbs { | |
width: 0; | |
margin-left: 0; | |
overflow: hidden; | |
} | |
}@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (-o-min-device-pixel-ratio:2/1), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:192dpi), only screen and (min-resolution:2dppx) { | |
.jackbox-arrow-left { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-arrow-right { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-info { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-show-thumbs { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-hide-thumbs { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-close { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-fs { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-ns { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-thumb-left { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-thumb-right { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-panel-left { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-panel-right { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-panel-left:hover { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-panel-right:hover { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
} | |
.jackbox-hover { | |
width: 100%; | |
height: 100%; | |
display: block; | |
position: absolute; | |
background-position: center 75%; | |
background-repeat: no-repeat; | |
background-size: 45px 45px; | |
opacity: 0; | |
-ms-filter: "alpha(opacity=0)"; | |
filter: alpha(opacity=0); | |
-webkit-box-sizing: content-box; | |
-moz-box-sizing: content-box; | |
-o-box-sizing: content-box; | |
-ms-box-sizing: content-box; | |
box-sizing: content-box; | |
-webkit-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox-hover * { | |
-webkit-box-sizing: content-box; | |
-moz-box-sizing: content-box; | |
-o-box-sizing: content-box; | |
-ms-box-sizing: content-box; | |
box-sizing: content-box; | |
} | |
.jackbox-hover:visited { | |
text-decoration: none!} | |
.jackbox-hover-black { | |
background-color: #000; | |
background-color: rgba(0, 0, 0, 0.65); | |
} | |
.jackbox-hover-white { | |
background-color: #FFF; | |
background-color: rgba(255, 255, 255, 0.9); | |
} | |
.jackbox-hover-magnify { | |
background-image: url(../img/graphics/hover_magnify.png); | |
} | |
.jackbox-hover-play { | |
background-image: url(../img/graphics/hover_play.png); | |
} | |
.jackbox-hover-document { | |
background-image: url(../img/graphics/hover_document.png); | |
} | |
.jackbox-hover-blur { | |
background-color: #000; | |
background-color: rgba(255, 255, 255, 0.25); | |
} | |
.jackbox-canvas-blur { | |
position: absolute; | |
top: 0; | |
left: 0; | |
opacity: 0; | |
-ms-filter: "alpha(opacity=0)"; | |
filter: alpha(opacity=0); | |
-webkit-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox:hover>.jackbox-hover { | |
opacity: 1; | |
-ms-filter: "alpha(opacity=100)"; | |
filter: alpha(opacity=100); | |
background-position: center center; | |
} | |
.jackbox:hover>.jackbox-canvas-blur { | |
opacity: 1; | |
-ms-filter: "alpha(opacity=100)"; | |
filter: alpha(opacity=100); | |
} | |
.jackbox>.jackbox-hover-black, .jackbox>.jackbox-hover-blur, .jackbox:visited>.jackbox-hover-black, .jackbox:visited>.jackbox-hover-blur { | |
color: #EEE; | |
} | |
.jackbox>.jackbox-hover-white, .jackbox:visited>.jackbox-hover-white { | |
color: #333; | |
} | |
.jackbox { | |
font: 14px "Mako", sans-serif; | |
text-decoration: none; | |
line-height: 0; | |
} | |
.jackbox-hover p { | |
margin: 0; | |
text-align: left; | |
padding: 10px 10px 0 10px; | |
line-height: normal; | |
} | |
.jackbox-tooltip { | |
position: absolute; | |
display: inline-block; | |
pointer-events: none; | |
-webkit-border-radius: 8px; | |
-moz-border-radius: 8px; | |
border-radius: 8px; | |
border: 1px solid #FFF; | |
border-bottom: 0; | |
background: #f5f5f5; | |
background: -moz-linear-gradient(top, #f5f5f5 0, #e5e5e5 100%); | |
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5f5f5), color-stop(100%, #e5e5e5)); | |
background: -webkit-linear-gradient(top, #f5f5f5 0, #e5e5e5 100%); | |
background: -o-linear-gradient(top, #f5f5f5 0, #e5e5e5 100%); | |
background: -ms-linear-gradient(top, #f5f5f5 0, #e5e5e5 100%); | |
background: linear-gradient(to bottom, #f5f5f5 0, #e5e5e5 100%); | |
-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); | |
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); | |
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); | |
-ms-filter: "alpha(opacity=0)"; | |
filter: alpha(opacity=0); | |
opacity: 0; | |
-webkit-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-moz-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-o-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
-ms-transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
transition: all .6s cubic-bezier(0.230, 1.000, 0.320, 1.000); | |
} | |
.jackbox-tooltip p { | |
font: 14px "Mako", sans-serif; | |
line-height: normal; | |
white-space: nowrap; | |
padding: 6px 10px 7px 10px; | |
margin: 0; | |
color: #444; | |
text-shadow: 1px 1px 0 #FFF; | |
} | |
.jackbox-tooltip p:after { | |
width: 0; | |
height: 0; | |
content: ""; | |
border-left: 10px solid transparent; | |
border-right: 10px solid transparent; | |
border-top: 10px solid #e5e5e5; | |
position: absolute; | |
bottom: -10px; | |
left: 65%} | |
@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (-o-min-device-pixel-ratio:2/1), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:192dpi), only screen and (min-resolution:2dppx) { | |
.jackbox-hover-magnify { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-hover-play { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
.jackbox-hover-document { | |
background-image: url(../img/graphics/retina/[email protected]); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment