.jsp-content {
position: relative;
width: 100%;
height: 100%;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
background-color: rgb(0, 0, 0);
font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
font-weight: bold;
overflow: hidden;
}
.fullscreen {
width: 100% !important;
height: 100% !important;
}
.fullscreen .jsp-content {
height: 100%;
}
.pc.jsp-control-visible .controller {
visibility: visible;
}
.pc.jsp-control-hidden .controller {
visibility: hidden;
}
.mobile.jsp-control-visible .controller {
visibility: visible;
}
.mobile.jsp-control-hidden .controller {
visibility: hidden;
}
.jsp-control-manual.jsp-control-visible .jsp-animation-circle {
visibility: visible;
}
.jsp-control-manual.jsp-control-hidden .jsp-animation-circle {
visibility: hidden;
}
/* .pc.playing .jsp-content > .controller{
visibility: hidden;
transition: visibility 0.5s;
}
.pc.jsp-control-visible.playing .controller {
visibility: visible;
} */
.first .jsp-video-cover {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
-webkit-background-size: contain;
background-color: rgb(0, 0, 0);
cursor: pointer;
}
.jsp-video-cover {
cursor: pointer;
}
.jsp-video-element {
position: absolute;
top: 0;
left: 0;
width: 100%;
cursor: pointer;
height: 100%;
}
.fullscreen .jsp-video-element {
width: 100%;
height: 100%;
}
position: absolute;
top: 0;
.jsp-ad-container {
left: 0;
width: 100%;
height: 100%;
background-size: cover;
}
.adPlaying .jsp-ad-container {
display: block;
}
.adPaused .jsp-ad-container {
display: none;
}
/* 中央ボタン群 */
.paused .jsp-big-play-button {
background-size: 100%;
left: 50%;
background: transparent;
}
.paused .jsp-play-svg {
vertical-align: middle;
display: block;
fill: #F8F8F8;
}
.paused .jsp-pause-svg {
display: none;
}
.playing .jsp-big-play-button {
background-size: 100%;
left: 50%;
background: transparent;
}
.playing .jsp-play-svg {
display: none;
}
.playing .jsp-pause-svg {
vertical-align: middle;
display: block;
fill: #F8F8F8;
}
.jsp-big-play-button:hover {
opacity: 0.6;
}
.jsp-waiting-ready .jsp-big-play-button {
display: none;
}
.jsp-fast-seek-back-button {
background-size: 100%;
left: 30%;
background: transparent;
}
.jsp-fast-seek-back-button:hover .jsp-fast-rewind-svg{
opacity: 0.6;
}
.jsp-fast-rewind-svg {
fill: #F8F8F8;
vertical-align: middle;
}
.jsp-fast-seek-forword-button {
background-size: 100%;
left: 70%;
background: transparent;
}
.jsp-fast-seek-forword-button:hover .jsp-fast-forward-svg{
opacity: 0.6;
}
.jsp-fast-forward-svg {
fill: #F8F8F8;
vertical-align: middle;
height: 100%;
}
.jsp-big-play-button,
.jsp-fast-seek-back-button,
.jsp-fast-seek-forword-button {
cursor: pointer;
position: absolute;
top: 50%;
border: none;
outline: none;
padding: 0;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.jsp-button-ring{
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
background-color: #F8F8F8;
border-radius: 100%;
visibility: hidden;
}
/* .jsp-fast-seek-back-button::before,
.jsp-fast-seek-forword-button::before {
content: attr(data-content);
position: absolute;
width: 100%;
font-size: 0.6em;
color: #F8F8F8;
bottom: 3em;
}
_:-ms-lang(x)::-ms-backdrop,
.jsp-fast-seek-back-button::before,
.jsp-fast-seek-forword-button::before {
margin-top: 0;
} */
.jsp-fast-seek-back-text,
.jsp-fast-seek-forword-text {
visibility: hidden;
}
.jsp-back-skipping .jsp-fast-seek-back-text,
.jsp-forword-skipping .jsp-fast-seek-forword-text {
position: relative;
color: #F8F8F8;
bottom: 4em;
left: 0.5em;
visibility: visible;
}
.jsp-video-element:hover ~ .jsp-big-play-button,
.jsp-video-cover:hover ~ .jsp-big-play-button {
opacity: 0.6;
}
.jsp-animation-circle {
position: absolute;
}
.loading .jsp-animation-circle{
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
/* .loading .jsp-spinner {
color: F8F8F8;
font-size: 2em;
margin: auto;
width: 1em;
height: 1em;
border-radius: 50%;
position: absolute;
text-indent: -9999em;
-webkit-animation: spinner 1.3s infinite linear;
animation: spinner 1.3s infinite linear;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
top: 0;
bottom: 0;
left: 0;
right: 0;
visibility: visible;
border: none;
} */
.loading .controller {
visibility: hidden !important;
}
.small .jsp-big-play-button {
width: 1.2em;
height: 1.2em;
font-size: 1.8em;
margin-left: -0.6em;
margin-top: -0.6em;
}
.small .jsp-fast-seek-back-button,
.small .jsp-fast-seek-forword-button {
width: 1.2em;
height: 1.2em;
font-size: 1.6em;
margin-left: -0.6em;
margin-top: -0.6em;
}
.small.loading .jsp-animation-circle {
width: 3em;
height: 3em;
}
/* .small.loading .jsp-spinner {
font-size: 0.8em;
} */
.small .jsp-fast-seek-back-text,
.small .jsp-fast-seek-forword-text {
font-size: 0.6em;
margin-left: -1.1em;
}
.medium .jsp-big-play-button {
width: 1.4em;
height: 1.4em;
font-size: 2.4em;
margin-left: -0.7em;
margin-top: -0.7em;
}
.medium .jsp-fast-seek-back-button,
.medium .jsp-fast-seek-forword-button {
width: 1.4em;
height: 1.4em;
font-size: 1.8em;
margin-left: -0.7em;
margin-top: -0.7em;
}
.medium .jsp-fast-seek-back-text,
.medium .jsp-fast-seek-forword-text {
font-size: 0.8em;
margin-left: -1.1em;
}
.medium.loading .jsp-animation-circle {
width: 7em;
height: 7em;
}
/* .medium.loading .jsp-spinner {
font-size: 1.0em;
} */
.large .jsp-big-play-button {
width: 1.8em;
height: 1.8em;
font-size: 2.6em;
margin-left: -0.9em;
margin-top: -0.9em;
}
.large .jsp-fast-seek-back-button,
.large .jsp-fast-seek-forword-button {
width: 1.8em;
height: 1.8em;
font-size: 2.0em;
margin-left: -0.9em;
margin-top: -0.9em;
}
.large .jsp-fast-seek-back-text,
.large .jsp-fast-seek-forword-text {
font-size: 0.8em;
margin-left: -1.0em;
}
.large.loading .jsp-animation-circle {
width: 10em;
height: 10em;
}
/* .large.loading .jsp-spinner {
font-size: 1.6em;
} */
.x-large .jsp-big-play-button {
width: 2.0em;
height: 2.0em;
font-size: 4.0em;
margin-left: -1.0em;
margin-top: -1.0em;
}
.x-large .jsp-fast-seek-back-button,
.x-large .jsp-fast-seek-forword-button {
width: 2.0em;
height: 2.0em;
font-size: 3.0em;
margin-left: -1.0em;
margin-top: -1.0em;
}
.x-large .jsp-fast-seek-back-text,
.x-large .jsp-fast-seek-forword-text {
font-size: 1.2em;
margin-left: -1.0em;
}
.x-large.loading .jsp-animation-circle {
width: 20em;
height: 20em;
}
/* .x-large.loading .jsp-spinner {
font-size: 1.8em;
} */
.live-mode .jsp-fast-seek-back-button,
.live-mode .jsp-fast-seek-forword-button {
display: none;
}
/* コントロールバー */
.jsp-bottom {
display: flex;
flex-direction: column;
position: absolute;
width: 100%;
bottom: 0;
height: 62px;
box-sizing: content-box;
}
.jsp-control-base {
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
height: 50px;
background-color: rgba(0, 0, 0, 0.3);
margin: 0 12px;
border-radius: 4px;
}
.jsp-left-controls,
.jsp-right-controls {
display: flex;
}
.jsp-left-controls {
-webkit-justify-content: flex-start;
justify-content: flex-start;
width: 80%;
}
.jsp-right-controls {
-webkit-justify-content: flex-end;
justify-content: flex-end;
width: 20%;
}
.jsp-seek-base {
height: 20px;
cursor: pointer;
bottom: 0px;
margin: -8px 12px 0 12px;
display: flex;
justify-content: space-between;
}
.jsp-play-control {
cursor: pointer;
/* font-size: 1.1em; */
width: 2em;
height: 100%;
border: none;
outline: none;
text-align: center;
flex: none;
margin: 0 0.4rem;
background: transparent;
padding: 0;
}
.playing .jsp-play-control {
}
.jsp-fullscreen-button {
cursor: pointer;
/* font-size: 1.1em; */
text-align: center;
width: 2em;
height: 100%;
border: none;
outline: none;
flex: none;
margin: 0 0.4rem;
background: transparent;
padding: 0;
}
.jsp-fullscreen-svg {
display: block;
fill: #F8F8F8;
}
.jsp-fullscreen-exit-svg {
display: none;
}
.fullscreen .jsp-fullscreen-button {
}
.fullscreen .jsp-fullscreen-svg {
display: none;
}
.fullscreen .jsp-fullscreen-exit-svg {
display: block;
fill: #F8F8F8;
}
.first .jsp-fast-seek-back-button,
.first .jsp-fast-seek-forword-button,
.first .jsp-bottom,
.first .jsp-control-base{
visibility: hidden !important;
}
.jsp-remaining-time {
font-size: 12px;
text-align: center;
height: 16px;
border: none;
outline: none;
flex: none;
color: #F8F8F8;
margin: 0 0.6rem;
margin-top: 16px;
}
.jsp-seek-rail {
bottom: 10px;
width: 100%;
height: 4px;
background-color: #F8F8F8;
opacity: 0.5;
margin-top: 5px;
}
.jsp-seek-inner-rail {
bottom: 11px;
height: 4px;
background-color: #3EEF00;
position: absolute;
left: 12px;
}
.jsp-seek-base .jsp-seek-thumb {
/* display: none; */
visibility: hidden;
}
.pc .jsp-seek-base:hover .jsp-seek-thumb {
margin-top: 0.1em;
width: 0.6em;
height: 0.6em;
background-color: #3EEF00;
position: absolute;
left: 8px;
visibility: visible;
}
.jsp-seek-base .jsp-mouse-display {
display: none;
}
.pc .jsp-seek-base:hover .jsp-mouse-display {
text-align: center;
font-size: 0.8em;
width: 5em;
height: 1.5em;
background-color: #F8F8F8;
position: absolute;
overflow: hidden;
display: block;
margin-top: -1.5em;
margin-left: -3em;
color: #000000;
line-height: 1.5em;
left: 12px;
}
.mobile.seeking .jsp-seek-base .jsp-mouse-display {
text-align: center;
font-size: 0.8em;
width: 5em;
height: 1.5em;
background-color: #F8F8F8;
position: absolute;
overflow: hidden;
display: block;
margin-top: -1.5em;
margin-left: -3em;
color: #000000;
line-height: 1.5em;
}
.live-mode .jsp-seek-base,
.live-mode .jsp-seek-rail,
.live-mode .jsp-seek-inner-rail,
.live-mode .jsp-seek-thumb,
.live-mode .jsp-seek-base:hover .jsp-mouse-display,
.live-mode .jsp-remaining-time {
visibility: hidden;
pointer-events: none;
}
.dvr-mode .jsp-remaining-time {
visibility: hidden;
}
.jsp-volume-wrapper {
display: flex;
margin: 0 0.6rem 0 0.4rem;
}
.jsp-volume-wrapper:hover{
transform: scale(1);
}
.jsp-volume-button {
cursor: pointer;
/* font-size: 1.1em; */
text-align: center;
width: 2em;
height: 100%;
border: none;
outline: none;
flex: none;
margin: 0 0.4rem 0 0;
position: relative;
background: transparent;
padding: 0;
}
.jsp-volume-up-svg {
display: block;
fill: #F8F8F8;
}
.jsp-volume-off-svg {
display: none;
}
.mute .jsp-volume-button {
}
.mute .jsp-volume-up-svg {
display: none;
}
.mute .jsp-volume-off-svg {
display: block;
fill: #F8F8F8;
}
.pc .jsp-volume-base {
width: 0em;
/* height: 2em; */
height: 100%;
position: relative;
cursor: pointer;
transform: scale(0, 1);
transform-origin: left;
transition-duration: 0.3s;
}
.pc .jsp-volume-base .jsp-volume-rail {
width: 100%;
height: 8px;
background-color: #F8F8F8;
opacity: 0.5;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
.pc .jsp-volume-base .jsp-volume-inner-rail {
height: 8px;
background-color: #3EEF00;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
.pc .jsp-volume-base .jsp-volume-thumb {
width: 6px;
height: 18px;
background-color: #f8f8f8;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
left: -0.2rem;
}
.pc .jsp-volume-wrapper:hover .jsp-volume-base {
/* width: 8em; */
display: block;
transform: scale(1);
-webkit-transform: scale(1);
width: 5em;
top: 0;
bottom: 0;
/* margin: auto; */
}
.pc .jsp-volume-wrapper:hover .jsp-volume-thumb {
display: block;
}
.pc.small .jsp-volume-wrapper:hover .jsp-volume-base {
display: none;
}
.pc.small .jsp-volume-wrapper:hover .jsp-volume-thumb {
display: none;
}
/* 設定ボタン */
.jsp-settings-button {
cursor: pointer;
/* font-size: 1.1em; */
text-align: center;
width: 2em;
height: 100%;
border: none;
outline: none;
flex: none;
/* margin: 0 0.4 0 -0.5rem; */
margin-top: 0;
margin-bottom: 0;
margin-left: -0.5rem;
margin-right: 0.4rem;
background: transparent;
line-height: 0;
padding: 0;
}
.jsp-settings-svg {
fill: #F8F8F8;
}
.jsp-arrow-forward-svg,
.jsp-arrow-back-svg {
fill: #F8F8F8;
vertical-align: middle;
height:100%;
width: 1rem;
}
.jsp-settings-base,
.jsp-resolution-base,
.jsp-subtitle-base,
.jsp-speed-base {
background-color: rgba(0, 0, 0, 0.8);
position: absolute;
display: none;
cursor: pointer;
font-weight: 500;
line-height: 2rem;
width: 220px;
height: auto;
padding: 13px 10px 11px 12px;
bottom: 64px;
overflow-y: scroll;
overflow-x: hidden;
right:12px;
}
.settings-shown .jsp-settings-base,
.resolution-shown .jsp-resolution-base,
.subtitle-shown .jsp-subtitle-base,
.speed-shown .jsp-speed-base {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.jsp-settings-box {
display: flex;
justify-content: flex-end;
}
.jsp-settings-box-name {
margin:0 0.5rem;
/* line-height: 2rem; */
width: 100%;
}
.jsp-speed-value {
line-height: 2rem;
width: 100px;
text-align: right;
}
.jsp-resolution-value {
line-height: 2rem;
width: 100px;
text-align: right;
}
.jsp-settings-return {
color: #F8F8F8;
display: flex;
justify-content: flex-start;
border-bottom: thin solid #F8F8F8;
min-height: 2rem;
max-height: 2rem;
}
.jsp-arrow-forward-box,
.jsp-arrow-back-box {
width: 1rem;
line-height: 1.8rem;
display: inline-flex;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
}
.settings-shown.resolution-shown .jsp-settings-base,
.settings-shown.subtitle-shown .jsp-settings-base,
.settings-shown.speed-shown .jsp-settings-base {
display: none;
}
.jsp-resolution-box,
.jsp-subtitle-box,
.jsp-speed-box,
.jsp-resolution-return,
.jsp-subtitle-return,
.jsp-speed-return {
color: #F8F8F8;
width: 100%;
height: 2rem;
display: flex;
justify-content: space-between;
}
.jsp-resolution-label,
.jsp-subtitle-label,
.jsp-speed-label {
/* width: 100%;
text-align: center; */
}
.jsp-resolution-box:hover,
.jsp-subtitle-box:hover,
.jsp-speed-box:hover,
.jsp-settings-item:hover {
background-color: rgba(112, 114, 116, .7);
}
.jsp-settings-item {
display: flex;
justify-content: flex-start;
color: #F8F8F8;
width: 100%;
min-height: 2rem;
max-height: 2rem;
}
.jsp-settings-check-box {
width: 1rem;
line-height: 2rem;
padding-top: 0.5rem;
}
.jsp-check-svg {
display: none;
fill: #F8F8F8;
}
.jsp-check .jsp-check-svg{
display: block;
}
.jsp-settings-item-value {
margin: 0 0.5rem;
line-height: 2rem;
}
.jsp-timeout .jsp-error-cover{
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
color: rgb(255,255,255);
background-color: #000000;
display: flex;
justify-content: center;
align-items: center;
}
/* .mobile.playing .controller {
visibility: hidden !important;
}
.mobile.user-active.playing .controller {
visibility: visible !important;;
}
/* @keyframes spinner {
0%,
100% {
box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em,
-3em 0 0 -1em, -2em -2em 0 0;
}
12.5% {
box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em,
-3em 0 0 -1em, -2em -2em 0 -1em;
}
25% {
box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em,
-3em 0 0 -1em, -2em -2em 0 -1em;
}
37.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em,
-3em 0em 0 -1em, -2em -2em 0 -1em;
}
50% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0,
-3em 0em 0 -1em, -2em -2em 0 -1em;
}
62.5% {
box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em,
-3em 0 0 0, -2em -2em 0 -1em;
}
75% {
box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0,
-3em 0em 0 0.2em, -2em -2em 0 0;
}
87.5% {
box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0,
-3em 0em 0 0, -2em -2em 0 0.2em;
}
} */
.jsp-animation-circle .jsp-animation-circle-child {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.jsp-animation-circle .jsp-animation-circle-child:before {
content: '';
display: block;
margin: 0 auto;
width: 15%;
height: 15%;
background-color: #F8F8F8;
border-radius: 100%;
-webkit-animation: jsp-animation-circleBounceDelay 1.2s infinite ease-in-out both;
animation: jsp-animation-circleBounceDelay 1.2s infinite ease-in-out both;
}
.jsp-animation-circle .jsp-animation-circle2 {
-webkit-transform: rotate(30deg);
-ms-transform: rotate(30deg);
transform: rotate(30deg); }
.jsp-animation-circle .jsp-animation-circle3 {
-webkit-transform: rotate(60deg);
-ms-transform: rotate(60deg);
transform: rotate(60deg); }
.jsp-animation-circle .jsp-animation-circle4 {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg); }
.jsp-animation-circle .jsp-animation-circle5 {
-webkit-transform: rotate(120deg);
-ms-transform: rotate(120deg);
transform: rotate(120deg); }
.jsp-animation-circle .jsp-animation-circle6 {
-webkit-transform: rotate(150deg);
-ms-transform: rotate(150deg);
transform: rotate(150deg); }
.jsp-animation-circle .jsp-animation-circle7 {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg); }
.jsp-animation-circle .jsp-animation-circle8 {
-webkit-transform: rotate(210deg);
-ms-transform: rotate(210deg);
transform: rotate(210deg); }
.jsp-animation-circle .jsp-animation-circle9 {
-webkit-transform: rotate(240deg);
-ms-transform: rotate(240deg);
transform: rotate(240deg); }
.jsp-animation-circle .jsp-animation-circle10 {
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg); }
.jsp-animation-circle .jsp-animation-circle11 {
-webkit-transform: rotate(300deg);
-ms-transform: rotate(300deg);
transform: rotate(300deg); }
.jsp-animation-circle .jsp-animation-circle12 {
-webkit-transform: rotate(330deg);
-ms-transform: rotate(330deg);
transform: rotate(330deg); }
.jsp-animation-circle .jsp-animation-circle2:before {
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s; }
.jsp-animation-circle .jsp-animation-circle3:before {
-webkit-animation-delay: -1s;
animation-delay: -1s; }
.jsp-animation-circle .jsp-animation-circle4:before {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s; }
.jsp-animation-circle .jsp-animation-circle5:before {
-webkit-animation-delay: -0.8s;
animation-delay: -0.8s; }
.jsp-animation-circle .jsp-animation-circle6:before {
-webkit-animation-delay: -0.7s;
animation-delay: -0.7s; }
.jsp-animation-circle .jsp-animation-circle7:before {
-webkit-animation-delay: -0.6s;
animation-delay: -0.6s; }
.jsp-animation-circle .jsp-animation-circle8:before {
-webkit-animation-delay: -0.5s;
animation-delay: -0.5s; }
.jsp-animation-circle .jsp-animation-circle9:before {
-webkit-animation-delay: -0.4s;
animation-delay: -0.4s; }
.jsp-animation-circle .jsp-animation-circle10:before {
-webkit-animation-delay: -0.3s;
animation-delay: -0.3s; }
.jsp-animation-circle .jsp-animation-circle11:before {
-webkit-animation-delay: -0.2s;
animation-delay: -0.2s; }
.jsp-animation-circle .jsp-animation-circle12:before {
-webkit-animation-delay: -0.1s;
animation-delay: -0.1s; }
@-webkit-keyframes jsp-animation-circleBounceDelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
} 40% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes jsp-animation-circleBounceDelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
} 40% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.jsp-animation-ring{
-webkit-animation: jsp-circleBounceDelay 0.3s ease-in-out both;
animation: jsp-circleBounceDelay 0.3s ease-in-out both;
visibility: visible;
}
@-webkit-keyframes jsp-circleBounceDelay {
0%{
-webkit-transform: scale(0.25);
transform: scale(0.25);
opacity:0.3;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity:0;
}
}
@keyframes jsp-circleBounceDelay {
0%{
-webkit-transform: scale(0.25);
transform: scale(0.25);
opacity:0.3;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity:0;
}
}