/*!
* fullPage 2.9.4
* https://github.com/alvarotrigo/fullPage.js
* MIT licensed
*
* Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
*/
html.fp-enabled,
.fp-enabled body {
margin: 0;
padding: 0;
overflow: hidden;
-webkit-tap-highlight-color: transparent
}
#superContainer {
height: 100%;
position: relative;
-ms-touch-action: none;
touch-action: none
}
.fp-section {
position: relative;
box-sizing: border-box
}
.fp-slide {
float: left
}
.fp-slide,
.fp-slidesContainer {
height: 100%;
display: block
}
.fp-slides {
z-index: 1;
height: 100%;
overflow: hidden;
position: relative;
transition: all 0.3s ease-out
}
.fp-section.fp-table,
.fp-slide.fp-table {
display: table;
table-layout: fixed;
width: 100%
}
.fp-tableCell {
display: table-cell;
vertical-align: middle;
width: 100%;
height: 100%
}
.fp-slidesContainer {
float: left;
position: relative
}
.fp-controlArrow {
-webkit-user-select: none;
-moz-user-select: none;
-khtml-user-select: none;
-ms-user-select: none;
position: absolute;
z-index: 4;
top: 50%;
cursor: pointer;
width: 0;
height: 0;
border-style: solid;
margin-top: -38px;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.fp-controlArrow.fp-prev {
left: 15px;
width: 0;
border-width: 38.5px 34px 38.5px 0;
border-color: transparent #fff transparent transparent
}
.fp-controlArrow.fp-next {
right: 15px;
border-width: 38.5px 0 38.5px 34px;
border-color: transparent transparent transparent #fff
}
.fp-scrollable {
overflow: hidden;
position: relative
}
.fp-scroller {
overflow: hidden
}
.iScrollIndicator {
border: 0 !important
}
.fp-notransition {
transition: none !important
}
#fp-nav {
position: fixed;
z-index: 100;
margin-top: -32px;
top: 50%;
opacity: 1;
-webkit-transform: translate3d(0, 0, 0)
}
#fp-nav.right {
right: 17px
}
#fp-nav.left {
left: 17px
}
.fp-slidesNav {
position: absolute;
z-index: 4;
left: 50%;
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.fp-slidesNav.bottom {
bottom: 17px
}
.fp-slidesNav.top {
top: 17px
}
#fp-nav ul,
.fp-slidesNav ul {
margin: 0;
padding: 0
}
#fp-nav ul li,
.fp-slidesNav ul li {
display: block;
width: 14px;
height: 13px;
margin: 7px;
position: relative
}
.fp-slidesNav ul li {
display: inline-block
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
display: block;
position: relative;
z-index: 1;
width: 100%;
height: 100%;
cursor: pointer;
text-decoration: none
}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
height: 12px;
width: 12px;
margin: -6px 0 0 -6px;
border-radius: 100%
}
#fp-nav ul li a span,
.fp-slidesNav ul li a span {
border-radius: 50%;
position: absolute;
z-index: 1;
height: 4px;
width: 4px;
border: 0;
background: #333;
left: 50%;
top: 50%;
margin: -2px 0 0 -2px;
transition: all 0.1s ease-in-out
}
#fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span {
width: 10px;
height: 10px;
margin: -5px 0px 0px -5px
}
#fp-nav ul li .fp-tooltip {
position: absolute;
top: -2px;
color: #fff;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
white-space: nowrap;
max-width: 220px;
overflow: hidden;
display: block;
opacity: 0;
width: 0;
cursor: pointer
}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active+.fp-tooltip {
transition: opacity 0.2s ease-in;
width: auto;
opacity: 1
}
#fp-nav ul li .fp-tooltip.right {
right: 20px
}
#fp-nav ul li .fp-tooltip.left {
left: 20px
}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell {
height: auto !important
}
.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
height: auto !important
}
.video-js .vjs-big-play-button .vjs-icon-placeholder:before,
.vjs-button>.vjs-icon-placeholder:before,
.video-js .vjs-modal-dialog,
.vjs-modal-dialog .vjs-modal-dialog-content {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.video-js .vjs-big-play-button .vjs-icon-placeholder:before,
.vjs-button>.vjs-icon-placeholder:before {
text-align: center
}
@font-face {
font-family: VideoJS;
src: url("font/VideoJS.eot?#iefix") format("eot")
}
@font-face {
font-family: VideoJS;
src: url(data:application/font-woff;charset=utf-8;base64,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) format("woff"), url(data:application/x-font-ttf;charset=utf-8;base64,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FjY3PgE3LgEnIwYfAR4BFw4BBTM/ARUzESMGAyUVJwMchM2UWwgNq4JHrQgBAapUaAoJcWMBfiIhDiMrAQJLMB0BBAokNAIBPmMiIQ4iLAECSzAeAQUKJDQBP2MiIQ4iLAECSzAeAQUKJDQBAT75g+5B4arNLNIBJ44ByQL9BQ9mvYCKwA8FBQMDwwJVTGdzBf6VB8IHNR08lld9uT4LCRA/qGNxvUwHNR08lld9uT4LCRA/qGNxvUwHNR08lld9uT4LCRA/qGNxvVJkAWUDDEf+tYP5AQAAAAEAAAAABiAGtgAbAAABBAADER4BFzMRITU2ADcWABcVIREzPgE3EQIAA4D+4v6FBwJ/X+D+1QYBJ97eAScG/tXgX38CB/6FBrUH/oX+4v32X38CAlWV3gEnBgb+2d6V/asCf18CCgEeAXsAAAAAEADGAAEAAAAAAAEABwAAAAEAAAAAAAIABwAHAAEAAAAAAAMABwAOAAEAAAAAAAQABwAVAAEAAAAAAAUACwAcAAEAAAAAAAYABwAnAAEAAAAAAAoAKwAuAAEAAAAAAAsAEwBZAAMAAQQJAAEADgBsAAMAAQQJAAIADgB6AAMAAQQJAAMADgCIAAMAAQQJAAQADgCWAAMAAQQJAAUAFgCkAAMAAQQJAAYADgC6AAMAAQQJAAoAVgDIAAMAAQQJAAsAJgEeVmlkZW9KU1JlZ3VsYXJWaWRlb0pTVmlkZW9KU1ZlcnNpb24gMS4wVmlkZW9KU0dlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAFYAaQBkAGUAbwBKAFMAUgBlAGcAdQBsAGEAcgBWAGkAZABlAG8ASgBTAFYAaQBkAGUAbwBKAFMAVgBlAHIAcwBpAG8AbgAgADEALgAwAFYAaQBkAGUAbwBKAFMARwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABzAHYAZwAyAHQAdABmACAAZgByAG8AbQAgAEYAbwBuAHQAZQBsAGwAbwAgAHAAcgBvAGoAZQBjAHQALgBoAHQAdABwADoALwAvAGYAbwBuAHQAZQBsAGwAbwAuAGMAbwBtAAAAAgAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAfAAABAgEDAQQBBQEGAQcBCAEJAQoBCwEMAQ0BDgEPARABEQESARMBFAEVARYBFwEYARkBGgEbARwBHQEeAR8EcGxheQtwbGF5LWNpcmNsZQVwYXVzZQt2b2x1bWUtbXV0ZQp2b2x1bWUtbG93CnZvbHVtZS1taWQLdm9sdW1lLWhpZ2gQZnVsbHNjcmVlbi1lbnRlcg9mdWxsc2NyZWVuLWV4aXQGc3F1YXJlB3NwaW5uZXIJc3VidGl0bGVzCGNhcHRpb25zCGNoYXB0ZXJzBXNoYXJlA2NvZwZjaXJjbGUOY2lyY2xlLW91dGxpbmUTY2lyY2xlLWlubmVyLWNpcmNsZQJoZAZjYW5jZWwGcmVwbGF5CGZhY2Vib29rBWdwbHVzCGxpbmtlZGluB3R3aXR0ZXIGdHVtYmxyCXBpbnRlcmVzdBFhdWRpby1kZXNjcmlwdGlvbgVhdWRpbwAAAAAA) format("truetype");
font-weight: normal;
font-style: normal
}
.vjs-icon-play,
.video-js .vjs-big-play-button .vjs-icon-placeholder:before,
.video-js .vjs-play-control .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-play:before,
.video-js .vjs-big-play-button .vjs-icon-placeholder:before,
.video-js .vjs-play-control .vjs-icon-placeholder:before {
content: "\f101"
}
.vjs-icon-play-circle {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-play-circle:before {
content: "\f102"
}
.vjs-icon-pause,
.video-js .vjs-play-control.vjs-playing .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-pause:before,
.video-js .vjs-play-control.vjs-playing .vjs-icon-placeholder:before {
content: "\f103"
}
.vjs-icon-volume-mute,
.video-js .vjs-mute-control.vjs-vol-0 .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-volume-mute:before,
.video-js .vjs-mute-control.vjs-vol-0 .vjs-icon-placeholder:before {
content: "\f104"
}
.vjs-icon-volume-low,
.video-js .vjs-mute-control.vjs-vol-1 .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-volume-low:before,
.video-js .vjs-mute-control.vjs-vol-1 .vjs-icon-placeholder:before {
content: "\f105"
}
.vjs-icon-volume-mid,
.video-js .vjs-mute-control.vjs-vol-2 .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-volume-mid:before,
.video-js .vjs-mute-control.vjs-vol-2 .vjs-icon-placeholder:before {
content: "\f106"
}
.vjs-icon-volume-high,
.video-js .vjs-mute-control .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-volume-high:before,
.video-js .vjs-mute-control .vjs-icon-placeholder:before {
content: "\f107"
}
.vjs-icon-fullscreen-enter,
.video-js .vjs-fullscreen-control .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-fullscreen-enter:before,
.video-js .vjs-fullscreen-control .vjs-icon-placeholder:before {
content: "\f108"
}
.vjs-icon-fullscreen-exit,
.video-js.vjs-fullscreen .vjs-fullscreen-control .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-fullscreen-exit:before,
.video-js.vjs-fullscreen .vjs-fullscreen-control .vjs-icon-placeholder:before {
content: "\f109"
}
.vjs-icon-square {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-square:before {
content: "\f10a"
}
.vjs-icon-spinner {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-spinner:before {
content: "\f10b"
}
.vjs-icon-subtitles,
.video-js .vjs-subtitles-button .vjs-icon-placeholder,
.video-js .vjs-subs-caps-button .vjs-icon-placeholder,
.video-js.video-js:lang(en-GB) .vjs-subs-caps-button .vjs-icon-placeholder,
.video-js.video-js:lang(en-IE) .vjs-subs-caps-button .vjs-icon-placeholder,
.video-js.video-js:lang(en-AU) .vjs-subs-caps-button .vjs-icon-placeholder,
.video-js.video-js:lang(en-NZ) .vjs-subs-caps-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-subtitles:before,
.video-js .vjs-subtitles-button .vjs-icon-placeholder:before,
.video-js .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js.video-js:lang(en-GB) .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js.video-js:lang(en-IE) .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js.video-js:lang(en-AU) .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js.video-js:lang(en-NZ) .vjs-subs-caps-button .vjs-icon-placeholder:before {
content: "\f10c"
}
.vjs-icon-captions,
.video-js .vjs-captions-button .vjs-icon-placeholder,
.video-js:lang(en) .vjs-subs-caps-button .vjs-icon-placeholder,
.video-js:lang(fr-CA) .vjs-subs-caps-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-captions:before,
.video-js .vjs-captions-button .vjs-icon-placeholder:before,
.video-js:lang(en) .vjs-subs-caps-button .vjs-icon-placeholder:before,
.video-js:lang(fr-CA) .vjs-subs-caps-button .vjs-icon-placeholder:before {
content: "\f10d"
}
.vjs-icon-chapters,
.video-js .vjs-chapters-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-chapters:before,
.video-js .vjs-chapters-button .vjs-icon-placeholder:before {
content: "\f10e"
}
.vjs-icon-share {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-share:before {
content: "\f10f"
}
.vjs-icon-cog {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-cog:before {
content: "\f110"
}
.vjs-icon-circle,
.video-js .vjs-play-progress,
.video-js .vjs-volume-level {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-circle:before,
.video-js .vjs-play-progress:before,
.video-js .vjs-volume-level:before {
content: "\f111"
}
.vjs-icon-circle-outline {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-circle-outline:before {
content: "\f112"
}
.vjs-icon-circle-inner-circle {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-circle-inner-circle:before {
content: "\f113"
}
.vjs-icon-hd {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-hd:before {
content: "\f114"
}
.vjs-icon-cancel,
.video-js .vjs-control.vjs-close-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-cancel:before,
.video-js .vjs-control.vjs-close-button .vjs-icon-placeholder:before {
content: "\f115"
}
.vjs-icon-replay,
.video-js .vjs-play-control.vjs-ended .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-replay:before,
.video-js .vjs-play-control.vjs-ended .vjs-icon-placeholder:before {
content: "\f116"
}
.vjs-icon-facebook {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-facebook:before {
content: "\f117"
}
.vjs-icon-gplus {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-gplus:before {
content: "\f118"
}
.vjs-icon-linkedin {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-linkedin:before {
content: "\f119"
}
.vjs-icon-twitter {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-twitter:before {
content: "\f11a"
}
.vjs-icon-tumblr {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-tumblr:before {
content: "\f11b"
}
.vjs-icon-pinterest {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-pinterest:before {
content: "\f11c"
}
.vjs-icon-audio-description,
.video-js .vjs-descriptions-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-audio-description:before,
.video-js .vjs-descriptions-button .vjs-icon-placeholder:before {
content: "\f11d"
}
.vjs-icon-audio,
.video-js .vjs-audio-button .vjs-icon-placeholder {
font-family: VideoJS;
font-weight: normal;
font-style: normal
}
.vjs-icon-audio:before,
.video-js .vjs-audio-button .vjs-icon-placeholder:before {
content: "\f11e"
}
.video-js {
display: block;
vertical-align: top;
box-sizing: border-box;
color: #fff;
background-color: #000;
position: relative;
padding: 0;
font-size: 10px;
line-height: 1;
font-weight: normal;
font-style: normal;
font-family: Arial, Helvetica, sans-serif
}
.video-js:-moz-full-screen {
position: absolute
}
.video-js:-webkit-full-screen {
width: 100% !important;
height: 100% !important
}
.video-js[tabindex="-1"] {
outline: none
}
.video-js *,
.video-js * :before,
.video-js * :after {
box-sizing: inherit
}
.video-js ul {
font-family: inherit;
font-size: inherit;
line-height: inherit;
list-style-position: outside;
margin-left: 0;
margin-right: 0;
margin-top: 0;
margin-bottom: 0
}
.video-js.vjs-fluid,
.video-js.vjs-16-9,
.video-js.vjs-4-3 {
width: 100%;
max-width: 100%;
height: 0
}
.video-js.vjs-16-9 {
padding-top: 56.25%
}
.video-js.vjs-4-3 {
padding-top: 75%
}
.video-js.vjs-fill {
width: 100%;
height: 100%
}
.video-js .vjs-tech {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
body.vjs-full-window {
padding: 0;
margin: 0;
height: 100%;
overflow-y: auto
}
.vjs-full-window .video-js.vjs-fullscreen {
position: fixed;
overflow: hidden;
z-index: 1000;
left: 0;
top: 0;
bottom: 0;
right: 0
}
.video-js.vjs-fullscreen {
width: 100% !important;
height: 100% !important;
padding-top: 0 !important
}
.video-js.vjs-fullscreen.vjs-user-inactive {
cursor: none
}
.vjs-hidden {
display: none !important
}
.vjs-disabled {
opacity: 0.5;
cursor: default
}
.video-js .vjs-offscreen {
height: 1px;
left: -9999px;
position: absolute;
top: 0;
width: 1px
}
.vjs-lock-showing {
display: block !important;
opacity: 1;
visibility: visible
}
.vjs-no-js {
padding: 20px;
color: #fff;
background-color: #000;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
text-align: center;
width: 300px;
height: 150px;
margin: 0px auto
}
.vjs-no-js a,
.vjs-no-js a:visited {
color: #66A8CC
}
.video-js .vjs-big-play-button {
font-size: 3em;
line-height: 1.5em;
height: 1.5em;
width: 1.5em;
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-top: -0.75em;
margin-left: -0.75em;
padding: 0;
cursor: pointer;
opacity: 1;
border: 0.06666em solid #fff;
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.7);
border-radius: 50%;
transition: all 0.4s
}
.vjs-big-play-centered .vjs-big-play-button {
top: 50%;
left: 50%;
margin-top: -0.75em;
margin-left: -1.5em
}
.video-js:hover .vjs-big-play-button,
.video-js .vjs-big-play-button:focus {
border-color: #fff;
background-color: #73859f;
background-color: rgba(115, 133, 159, 0.5);
transition: all 0s
}
.vjs-controls-disabled .vjs-big-play-button,
.vjs-has-started .vjs-big-play-button,
.vjs-using-native-controls .vjs-big-play-button,
.vjs-error .vjs-big-play-button {
display: none
}
.vjs-has-started.vjs-paused.vjs-show-big-play-button-on-pause .vjs-big-play-button {
display: block
}
.video-js button {
background: none;
border: none;
color: inherit;
display: inline-block;
overflow: visible;
font-size: inherit;
line-height: inherit;
text-transform: none;
text-decoration: none;
transition: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.video-js .vjs-control.vjs-close-button {
cursor: pointer;
height: 3em;
position: absolute;
right: 0;
top: 0.5em;
z-index: 2
}
.video-js .vjs-modal-dialog {
background: rgba(0, 0, 0, 0.8);
background: linear-gradient(180deg, rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0));
overflow: auto;
box-sizing: content-box
}
.video-js .vjs-modal-dialog>* {
box-sizing: border-box
}
.vjs-modal-dialog .vjs-modal-dialog-content {
font-size: 1.2em;
line-height: 1.5;
padding: 20px 24px;
z-index: 1
}
.vjs-menu-button {
cursor: pointer
}
.vjs-menu-button.vjs-disabled {
cursor: default
}
.vjs-workinghover .vjs-menu-button.vjs-disabled:hover .vjs-menu {
display: none
}
.vjs-menu .vjs-menu-content {
display: block;
padding: 0;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
overflow: auto;
box-sizing: content-box
}
.vjs-menu .vjs-menu-content>* {
box-sizing: border-box
}
.vjs-scrubbing .vjs-menu-button:hover .vjs-menu {
display: none
}
.vjs-menu li {
list-style: none;
margin: 0;
padding: 0.2em 0;
line-height: 1.4em;
font-size: 1.2em;
text-align: center;
text-transform: lowercase
}
.vjs-menu li.vjs-menu-item:focus,
.vjs-menu li.vjs-menu-item:hover {
background-color: #73859f;
background-color: rgba(115, 133, 159, 0.5)
}
.vjs-menu li.vjs-selected,
.vjs-menu li.vjs-selected:focus,
.vjs-menu li.vjs-selected:hover {
background-color: #fff;
color: #2B333F
}
.vjs-menu li.vjs-menu-title {
text-align: center;
text-transform: uppercase;
font-size: 1em;
line-height: 2em;
padding: 0;
margin: 0 0 0.3em 0;
font-weight: bold;
cursor: default
}
.vjs-menu-button-popup .vjs-menu {
display: none;
position: absolute;
bottom: 0;
width: 10em;
left: -3em;
height: 0em;
margin-bottom: 1.5em;
border-top-color: rgba(43, 51, 63, 0.7)
}
.vjs-menu-button-popup .vjs-menu .vjs-menu-content {
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.7);
position: absolute;
width: 100%;
bottom: 1.5em;
max-height: 15em
}
.vjs-workinghover .vjs-menu-button-popup:hover .vjs-menu,
.vjs-menu-button-popup .vjs-menu.vjs-lock-showing {
display: block
}
.video-js .vjs-menu-button-inline {
transition: all 0.4s;
overflow: hidden
}
.video-js .vjs-menu-button-inline:before {
width: 2.222222222em
}
.video-js .vjs-menu-button-inline:hover,
.video-js .vjs-menu-button-inline:focus,
.video-js .vjs-menu-button-inline.vjs-slider-active,
.video-js.vjs-no-flex .vjs-menu-button-inline {
width: 12em
}
.vjs-menu-button-inline .vjs-menu {
opacity: 0;
height: 100%;
width: auto;
position: absolute;
left: 4em;
top: 0;
padding: 0;
margin: 0;
transition: all 0.4s
}
.vjs-menu-button-inline:hover .vjs-menu,
.vjs-menu-button-inline:focus .vjs-menu,
.vjs-menu-button-inline.vjs-slider-active .vjs-menu {
display: block;
opacity: 1
}
.vjs-no-flex .vjs-menu-button-inline .vjs-menu {
display: block;
opacity: 1;
position: relative;
width: auto
}
.vjs-no-flex .vjs-menu-button-inline:hover .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline:focus .vjs-menu,
.vjs-no-flex .vjs-menu-button-inline.vjs-slider-active .vjs-menu {
width: auto
}
.vjs-menu-button-inline .vjs-menu-content {
width: auto;
height: 100%;
margin: 0;
overflow: hidden
}
.video-js .vjs-control-bar {
display: none;
width: 100%;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 3.0em;
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.7)
}
.vjs-has-started .vjs-control-bar {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
visibility: visible;
opacity: 1;
transition: visibility 0.1s, opacity 0.1s
}
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
visibility: visible;
opacity: 0;
transition: visibility 1s, opacity 1s
}
.vjs-controls-disabled .vjs-control-bar,
.vjs-using-native-controls .vjs-control-bar,
.vjs-error .vjs-control-bar {
display: none !important
}
.vjs-audio.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
opacity: 1;
visibility: visible
}
.vjs-has-started.vjs-no-flex .vjs-control-bar {
display: table
}
.video-js .vjs-control {
position: relative;
text-align: center;
margin: 0;
padding: 0;
height: 100%;
width: 4em;
-webkit-flex: none;
-ms-flex: none;
flex: none
}
.vjs-button>.vjs-icon-placeholder:before {
font-size: 1.8em;
line-height: 1.67
}
.video-js .vjs-control:focus:before,
.video-js .vjs-control:hover:before,
.video-js .vjs-control:focus {
text-shadow: 0em 0em 1em white
}
.video-js .vjs-control-text {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px
}
.vjs-no-flex .vjs-control {
display: table-cell;
vertical-align: middle
}
.video-js .vjs-custom-control-spacer {
display: none
}
.video-js .vjs-progress-control {
cursor: pointer;
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
min-width: 4em
}
.vjs-live .vjs-progress-control {
display: none
}
.vjs-no-flex .vjs-progress-control {
width: auto
}
.video-js .vjs-progress-holder {
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;
transition: all 0.2s;
height: 0.3em
}
.video-js .vjs-progress-control .vjs-progress-holder {
margin: 0 10px
}
.video-js .vjs-progress-control:hover .vjs-progress-holder {
font-size: 1.666666666666666666em
}
.video-js .vjs-progress-holder .vjs-play-progress,
.video-js .vjs-progress-holder .vjs-load-progress,
.video-js .vjs-progress-holder .vjs-load-progress div {
position: absolute;
display: block;
height: 100%;
margin: 0;
padding: 0;
width: 0;
left: 0;
top: 0
}
.video-js .vjs-play-progress {
background-color: #fff
}
.video-js .vjs-play-progress:before {
font-size: 0.9em;
position: absolute;
right: -0.5em;
top: -0.333333333333333em;
z-index: 1
}
.video-js .vjs-load-progress {
background: #bfc7d3;
background: rgba(115, 133, 159, 0.5)
}
.video-js .vjs-load-progress div {
background: white;
background: rgba(115, 133, 159, 0.75)
}
.video-js .vjs-time-tooltip {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 0.3em;
color: #000;
float: right;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
padding: 6px 8px 8px 8px;
pointer-events: none;
position: relative;
top: -3.4em;
visibility: hidden;
z-index: 1
}
.video-js .vjs-progress-holder:focus .vjs-time-tooltip {
display: none
}
.video-js .vjs-progress-control:hover .vjs-time-tooltip,
.video-js .vjs-progress-control:hover .vjs-progress-holder:focus .vjs-time-tooltip {
display: block;
font-size: 0.6em;
visibility: visible
}
.video-js .vjs-progress-control .vjs-mouse-display {
display: none;
position: absolute;
width: 1px;
height: 100%;
background-color: #000;
z-index: 1
}
.vjs-no-flex .vjs-progress-control .vjs-mouse-display {
z-index: 0
}
.video-js .vjs-progress-control:hover .vjs-mouse-display {
display: block
}
.video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display {
visibility: hidden;
opacity: 0;
transition: visibility 1s, opacity 1s
}
.video-js.vjs-user-inactive.vjs-no-flex .vjs-progress-control .vjs-mouse-display {
display: none
}
.vjs-mouse-display .vjs-time-tooltip {
color: #fff;
background-color: #000;
background-color: rgba(0, 0, 0, 0.8)
}
.video-js .vjs-slider {
position: relative;
cursor: pointer;
padding: 0;
margin: 0 0.45em 0 0.45em;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: #73859f;
background-color: rgba(115, 133, 159, 0.5)
}
.video-js .vjs-slider:focus {
text-shadow: 0em 0em 1em white;
box-shadow: 0 0 1em #fff
}
.video-js .vjs-mute-control {
cursor: pointer;
-webkit-flex: none;
-ms-flex: none;
flex: none;
padding-left: 2em;
padding-right: 2em;
padding-bottom: 3em
}
.video-js .vjs-volume-control {
cursor: pointer;
margin-right: 1em;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.video-js .vjs-volume-control.vjs-volume-horizontal {
width: 5em
}
.video-js .vjs-volume-panel .vjs-volume-control {
visibility: visible;
opacity: 0;
width: 1px;
height: 1px;
margin-left: -1px
}
.vjs-no-flex .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
}
.vjs-no-flex .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.vjs-no-flex .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical .vjs-volume-level {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
}
.video-js .vjs-volume-panel {
transition: width 1s
}
.video-js .vjs-volume-panel:hover .vjs-volume-control,
.video-js .vjs-volume-panel:active .vjs-volume-control,
.video-js .vjs-volume-panel:focus .vjs-volume-control,
.video-js .vjs-volume-panel .vjs-volume-control:hover,
.video-js .vjs-volume-panel .vjs-volume-control:active,
.video-js .vjs-volume-panel .vjs-volume-control:focus,
.video-js .vjs-volume-panel .vjs-mute-control:hover~.vjs-volume-control,
.video-js .vjs-volume-panel .vjs-mute-control:active~.vjs-volume-control,
.video-js .vjs-volume-panel .vjs-mute-control:focus~.vjs-volume-control,
.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active {
visibility: visible;
opacity: 1;
position: relative;
transition: visibility 0.1s, opacity 0.1s, height 0.1s, width 0.1s, left 0s, top 0s
}
.video-js .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-mute-control:hover~.vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-mute-control:active~.vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-mute-control:focus~.vjs-volume-control.vjs-volume-horizontal,
.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal {
width: 5em;
height: 3em
}
.video-js .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-mute-control:hover~.vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-mute-control:active~.vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-mute-control:focus~.vjs-volume-control.vjs-volume-vertical,
.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-vertical {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}
.video-js .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-volume-control:hover.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-volume-control:focus.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-mute-control:hover~.vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-mute-control:hover~.vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-mute-control:active~.vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-mute-control:active~.vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-mute-control:focus~.vjs-volume-control.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-mute-control:focus~.vjs-volume-control.vjs-volume-vertical .vjs-volume-level,
.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-vertical .vjs-volume-bar,
.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-vertical .vjs-volume-level {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}
.video-js .vjs-volume-panel.vjs-volume-panel-horizontal:hover,
.video-js .vjs-volume-panel.vjs-volume-panel-horizontal:focus,
.video-js .vjs-volume-panel.vjs-volume-panel-horizontal:active,
.video-js .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active {
width: 9em;
transition: width 0.1s
}
.video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {
height: 8em;
width: 3em;
left: -3.5em;
transition: visibility 1s, opacity 1s, height 1s 1s, width 1s 1s, left 1s 1s, top 1s 1s
}
.video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
transition: visibility 1s, opacity 1s, height 1s 1s, width 1s, left 1s 1s, top 1s 1s
}
.video-js.vjs-no-flex .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
width: 5em;
height: 3em;
visibility: visible;
opacity: 1;
position: relative;
transition: none
}
.video-js.vjs-no-flex .vjs-volume-control.vjs-volume-vertical,
.video-js.vjs-no-flex .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {
position: absolute;
bottom: 3em;
left: 0.5em
}
.video-js .vjs-volume-panel {
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
.video-js .vjs-volume-bar {
margin: 1.35em 0.45em
}
.vjs-volume-bar.vjs-slider-horizontal {
width: 5em;
height: 0.3em
}
.vjs-volume-bar.vjs-slider-vertical {
width: 0.3em;
height: 5em;
margin: 1.35em auto
}
.video-js .vjs-volume-level {
position: absolute;
bottom: 0;
left: 0;
background-color: #fff
}
.video-js .vjs-volume-level:before {
position: absolute;
font-size: 0.9em
}
.vjs-slider-vertical .vjs-volume-level {
width: 0.3em
}
.vjs-slider-vertical .vjs-volume-level:before {
top: -0.5em;
left: -0.3em
}
.vjs-slider-horizontal .vjs-volume-level {
height: 0.3em
}
.vjs-slider-horizontal .vjs-volume-level:before {
top: -0.3em;
right: -0.5em
}
.video-js .vjs-volume-panel.vjs-volume-panel-vertical {
width: 4em
}
.vjs-volume-bar.vjs-slider-vertical .vjs-volume-level {
height: 100%
}
.vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
width: 100%
}
.video-js .vjs-volume-vertical {
width: 3em;
height: 8em;
bottom: 8em;
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.7)
}
.video-js .vjs-volume-horizontal .vjs-menu {
left: -2em
}
.vjs-poster {
display: inline-block;
vertical-align: middle;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: contain;
background-color: #000000;
cursor: pointer;
margin: 0;
padding: 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%
}
.vjs-poster img {
display: block;
vertical-align: middle;
margin: 0 auto;
max-height: 100%;
padding: 0;
width: 100%
}
.vjs-has-started .vjs-poster {
display: none
}
.vjs-audio.vjs-has-started .vjs-poster {
display: block
}
.vjs-using-native-controls .vjs-poster {
display: none
}
.video-js .vjs-live-control {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;
font-size: 1em;
line-height: 3em
}
.vjs-no-flex .vjs-live-control {
display: table-cell;
width: auto;
text-align: left
}
.video-js .vjs-time-control {
-webkit-flex: none;
-ms-flex: none;
flex: none;
font-size: 1em;
line-height: 3em;
min-width: 2em;
width: auto;
padding-left: 1em;
padding-right: 1em
}
.vjs-live .vjs-time-control {
display: none
}
.video-js .vjs-current-time,
.vjs-no-flex .vjs-current-time {
display: none
}
.vjs-no-flex .vjs-remaining-time.vjs-time-control.vjs-control {
width: 0px !important;
white-space: nowrap
}
.video-js .vjs-duration,
.vjs-no-flex .vjs-duration {
display: none
}
.vjs-time-divider {
display: none;
line-height: 3em
}
.vjs-live .vjs-time-divider {
display: none
}
.video-js .vjs-play-control .vjs-icon-placeholder {
cursor: pointer;
-webkit-flex: none;
-ms-flex: none;
flex: none
}
.vjs-text-track-display {
position: absolute;
bottom: 3em;
left: 0;
right: 0;
top: 0;
pointer-events: none
}
.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
bottom: 1em
}
.video-js .vjs-text-track {
font-size: 1.4em;
text-align: center;
margin-bottom: 0.1em;
background-color: #000;
background-color: rgba(0, 0, 0, 0.5)
}
.vjs-subtitles {
color: #fff
}
.vjs-captions {
color: #fc6
}
.vjs-tt-cue {
display: block
}
video::-webkit-media-text-track-display {
-ms-transform: translateY(-3em);
-webkit-transform: translateY(-3em);
transform: translateY(-3em)
}
.video-js.vjs-user-inactive.vjs-playing video::-webkit-media-text-track-display {
-ms-transform: translateY(-1.5em);
-webkit-transform: translateY(-1.5em);
transform: translateY(-1.5em)
}
.video-js .vjs-fullscreen-control {
cursor: pointer;
-webkit-flex: none;
-ms-flex: none;
flex: none
}
.vjs-playback-rate>.vjs-menu-button,
.vjs-playback-rate .vjs-playback-rate-value {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.vjs-playback-rate .vjs-playback-rate-value {
pointer-events: none;
font-size: 1.5em;
line-height: 2;
text-align: center
}
.vjs-playback-rate .vjs-menu {
width: 4em;
left: 0em
}
.vjs-error .vjs-error-display .vjs-modal-dialog-content {
font-size: 1.4em;
text-align: center
}
.vjs-error .vjs-error-display:before {
color: #fff;
content: 'X';
font-family: Arial, Helvetica, sans-serif;
font-size: 4em;
left: 0;
line-height: 1;
margin-top: -0.5em;
position: absolute;
text-shadow: 0.05em 0.05em 0.1em #000;
text-align: center;
top: 50%;
vertical-align: middle;
width: 100%
}
.vjs-loading-spinner {
display: none;
position: absolute;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
opacity: 0.85;
text-align: left;
border: 6px solid rgba(43, 51, 63, 0.7);
box-sizing: border-box;
background-clip: padding-box;
width: 50px;
height: 50px;
border-radius: 25px
}
.vjs-seeking .vjs-loading-spinner,
.vjs-waiting .vjs-loading-spinner {
display: block
}
.vjs-loading-spinner:before,
.vjs-loading-spinner:after {
content: "";
position: absolute;
margin: -6px;
box-sizing: inherit;
width: inherit;
height: inherit;
border-radius: inherit;
opacity: 1;
border: inherit;
border-color: transparent;
border-top-color: white
}
.vjs-seeking .vjs-loading-spinner:before,
.vjs-seeking .vjs-loading-spinner:after,
.vjs-waiting .vjs-loading-spinner:before,
.vjs-waiting .vjs-loading-spinner:after {
-webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, vjs-spinner-fade 1.1s linear infinite;
animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, vjs-spinner-fade 1.1s linear infinite
}
.vjs-seeking .vjs-loading-spinner:before,
.vjs-waiting .vjs-loading-spinner:before {
border-top-color: white
}
.vjs-seeking .vjs-loading-spinner:after,
.vjs-waiting .vjs-loading-spinner:after {
border-top-color: white;
-webkit-animation-delay: 0.44s;
animation-delay: 0.44s
}
@keyframes vjs-spinner-spin {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg)
}
}
@-webkit-keyframes vjs-spinner-spin {
100% {
-webkit-transform: rotate(360deg)
}
}
@keyframes vjs-spinner-fade {
0% {
border-top-color: #73859f
}
20% {
border-top-color: #73859f
}
35% {
border-top-color: white
}
60% {
border-top-color: #73859f
}
100% {
border-top-color: #73859f
}
}
@-webkit-keyframes vjs-spinner-fade {
0% {
border-top-color: #73859f
}
20% {
border-top-color: #73859f
}
35% {
border-top-color: white
}
60% {
border-top-color: #73859f
}
100% {
border-top-color: #73859f
}
}
.vjs-chapters-button .vjs-menu ul {
width: 24em
}
.video-js .vjs-subs-caps-button+.vjs-menu .vjs-captions-menu-item .vjs-menu-item-text .vjs-icon-placeholder {
position: absolute
}
.video-js .vjs-subs-caps-button+.vjs-menu .vjs-captions-menu-item .vjs-menu-item-text .vjs-icon-placeholder:before {
font-family: VideoJS;
content: "\f10d";
font-size: 1.5em;
line-height: inherit
}
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-custom-control-spacer {
-webkit-flex: auto;
-ms-flex: auto;
flex: auto
}
.video-js.vjs-layout-tiny:not(.vjs-fullscreen).vjs-no-flex .vjs-custom-control-spacer {
width: auto
}
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-progress-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-descriptions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-tiny:not(.vjs-fullscreen) .vjs-audio-button {
display: none
}
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-descriptions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-subtitles-button,
.video-js.vjs-layout-x-small:not(.vjs-fullscreen) .vjs-audio-button {
display: none
}
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-current-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-time-divider,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-duration,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-remaining-time,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-playback-rate,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-mute-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-control,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-chapters-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-descriptions-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-captions-button,
.video-js.vjs-layout-small:not(.vjs-fullscreen) .vjs-subtitles-button .vjs-audio-button {
display: none
}
.vjs-modal-dialog.vjs-text-track-settings {
background-color: #2B333F;
background-color: rgba(43, 51, 63, 0.75);
color: #fff;
height: 70%
}
.vjs-text-track-settings .vjs-modal-dialog-content {
display: table
}
.vjs-text-track-settings .vjs-track-settings-colors,
.vjs-text-track-settings .vjs-track-settings-font,
.vjs-text-track-settings .vjs-track-settings-controls {
display: table-cell
}
.vjs-text-track-settings .vjs-track-settings-controls {
text-align: right;
vertical-align: bottom
}
.vjs-text-track-settings fieldset {
margin: 5px;
padding: 3px;
border: none
}
.vjs-text-track-settings fieldset span {
display: inline-block;
margin-left: 5px
}
.vjs-text-track-settings legend {
color: #fff;
margin: 0 0 5px 0
}
.vjs-text-track-settings .vjs-label {
position: absolute;
clip: rect(1px 1px 1px 1px);
clip: rect(1px, 1px, 1px, 1px);
display: block;
margin: 0 0 5px 0;
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden
}
.vjs-track-settings-controls button:focus,
.vjs-track-settings-controls button:active {
outline-style: solid;
outline-width: medium;
background-image: linear-gradient(0deg, #fff 88%, #73859f 100%)
}
.vjs-track-settings-controls button:hover {
color: rgba(43, 51, 63, 0.75)
}
.vjs-track-settings-controls button {
background-color: #fff;
background-image: linear-gradient(-180deg, #fff 88%, #73859f 100%);
color: #2B333F;
cursor: pointer;
border-radius: 2px
}
.vjs-track-settings-controls .vjs-default-button {
margin-right: 1em
}
@media print {
.video-js>*:not(.vjs-tech):not(.vjs-poster) {
visibility: hidden
}
}
@media \0screen {
.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
content: ""
}
}
@media \0screen {
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
visibility: hidden
}
}
@font-face {
font-family: 'Porsche Franklin Gothic Cond';
font-weight: normal;
font-style: normal;
src: url("../fonts/PorscheFranklinGothicCond.eot");
src: url("../fonts/PorscheFranklinGothicCond.woff") format("woff"), url("../fonts/PorscheFranklinGothicCond.ttf") format("truetype"), url("../fonts/PorscheFranklinGothicCond.svg#PorscheFranklinGothic-Cond") format("svg"), url("../fonts/PorscheFranklinGothicCond.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'Porsche News Gothic';
font-weight: normal;
font-style: normal;
src: url("../fonts/PorscheNewsGothicRegular.eot");
src: url("../fonts/PorscheNewsGothicRegular.woff") format("woff"), url("../fonts/PorscheNewsGothicRegular.ttf") format("truetype"), url("../fonts/PorscheNewsGothicRegular.svg#PorscheNewsGothic-Regular") format("svg"), url("../fonts/PorscheNewsGothicRegular.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'Porsche News Gothic';
font-weight: 700;
font-style: normal;
src: url("../fonts/PorscheNewsGothicBold.eot");
src: url("../fonts/PorscheNewsGothicBold.woff") format("woff"), url("../fonts/PorscheNewsGothicBold.ttf") format("truetype"), url("../fonts/PorscheNewsGothicBold.svg#PorscheNewsGothic-Bold") format("svg"), url("../fonts/PorscheNewsGothicBold.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'PORSCHEMOTORSPORTEXTENDED';
font-weight: normal;
font-style: normal;
src: url("../fonts/PORSCHEMOTORSPORTEXTENDED.eot");
src: url("../fonts/PORSCHEMOTORSPORTEXTENDED.woff") format("woff"), url("../fonts/PORSCHEMOTORSPORTEXTENDED.ttf") format("truetype"), url("../fonts/PORSCHEMOTORSPORTEXTENDED.svg#PORSCHEMOTORSPORTEXTENDED") format("svg"), url("../fonts/PORSCHEMOTORSPORTEXTENDED.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'PCCA ICON';
font-weight: normal;
font-style: normal;
src: url("../fonts/PCCAIcon.eot");
src: url("../fonts/PCCAIcon.woff") format("woff"), url("../fonts/PCCAIcon.ttf") format("truetype"), url("../fonts/PCCAIcon.svg#pcca") format("svg"), url("../fonts/PCCAIcon.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'Porsche Next W La';
font-weight: normal;
font-style: normal;
src: url("../fonts/PorscheNextWLa-Regular.eot");
src: url("../fonts/PorscheNextWLa-Regular.woff") format("woff"), url("../fonts/PorscheNextWLa-Regular.ttf") format("truetype"), url("../fonts/PorscheNextWLa-Regular.eot?#iefix") format("embedded-opentype")
}
@font-face {
font-family: 'Porsche Next W La';
font-weight: 700;
font-style: normal;
src: url("../fonts/PorscheNextWLa-Bold.eot");
src: url("../fonts/PorscheNextWLa-Bold.woff") format("woff"), url("../fonts/PorscheNextWLa-Bold.ttf") format("truetype"), url("../fonts/PorscheNextWLa-Bold.eot?#iefix") format("embedded-opentype")
}
@-webkit-keyframes MenuBackgroundHide {
0% {
z-index: 84;
opacity: 1
}
90% {
z-index: 84;
opacity: 0
}
}
@keyframes MenuBackgroundHide {
0% {
z-index: 84;
opacity: 1
}
90% {
z-index: 84;
opacity: 0
}
}
@-webkit-keyframes MenuBackgroundShow {
0% {
opacity: 0
}
90% {
opacity: 1
}
}
@keyframes MenuBackgroundShow {
0% {
opacity: 0
}
90% {
opacity: 1
}
}
* {
line-height: 130%;
margin: 0;
padding: 0
}
*,
::after,
::before {
box-sizing: inherit
}
html {
font-family: Arial, Roboto, sans-serif;
font-size: 10px;
box-sizing: border-box;
background-color: #fff
}
body {
overflow: hidden
}
@media all and (max-width: 767px) {
body {
overflow: auto;
-webkit-overflow-scrolling: touch
}
}
img,
svg {
line-height: 0;
display: block;
width: 100%;
height: auto
}
ul {
list-style: none
}
button {
position: relative;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
button .loading {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
width: 100%;
height: 100%;
transition: opacity .5s;
opacity: 0
}
button .loading.show {
opacity: 1
}
.sk-spinner-pulse {
position: absolute;
top: 50%;
left: 50%;
width: 40px;
height: 40px;
margin-top: -20px;
margin-left: -20px;
-webkit-animation: sk-pulseScaleOut 1.0s infinite ease-in-out;
animation: sk-pulseScaleOut 1.0s infinite ease-in-out;
border-radius: 100%;
background-color: #fff
}
@-webkit-keyframes sk-pulseScaleOut {
0% {
-webkit-transform: scale(0);
transform: scale(0)
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0
}
}
@keyframes sk-pulseScaleOut {
0% {
-webkit-transform: scale(0);
transform: scale(0)
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0
}
}
a {
text-decoration: none
}
a img {
border: none;
outline: none
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
font-weight: 400
}
.clearfix::after {
display: table;
clear: both;
content: ''
}
h1,
.h1 {
font-size: 4.2rem
}
@media all and (max-width: 767px) {
h1,
.h1 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h1,
.h1 {
font-size: 2.4rem
}
}
h2,
.h2 {
font-size: 3.6rem
}
@media all and (max-width: 767px) {
h2,
.h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h2,
.h2 {
font-size: 2.4rem
}
}
h3,
.h3 {
font-size: 3.2rem
}
@media all and (max-width: 767px) {
h3,
.h3 {
font-size: 2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h3,
.h3 {
font-size: 2.4rem
}
}
h4,
.h4 {
font-size: 2.4rem
}
@media all and (max-width: 767px) {
h4,
.h4 {
font-size: 1.6rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h4,
.h4 {
font-size: 1.6rem
}
}
h5,
.h5 {
font-size: 2rem
}
@media all and (max-width: 767px) {
h5,
.h5 {
font-size: 1.6rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h5,
.h5 {
font-size: 1.6rem
}
}
h6,
.h6 {
font-size: 1.6rem
}
@media all and (max-width: 767px) {
h6,
.h6 {
font-size: 1.6rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
h6,
.h6 {
font-size: 1.6rem
}
}
p,
.p1 {
font-size: 1.4rem
}
@media all and (max-width: 767px) {
p,
.p1 {
font-size: 1.2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
p,
.p1 {
font-size: 1.2rem
}
}
.p2 {
font-size: 1.3rem
}
@media all and (max-width: 767px) {
.p2 {
font-size: 1.2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.p2 {
font-size: 1.2rem
}
}
.p3 {
font-size: 1.2rem
}
@media all and (max-width: 767px) {
.p3 {
font-size: 1rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.p3 {
font-size: 1rem
}
}
.pcca-icon:before {
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.icon-facebook:before {
content: '\6d'
}
.icon-twitter:before {
content: '\70'
}
.icon-instagram:before {
content: '\75'
}
.icon-weibo:before {
content: '\77'
}
.icon-wechat:before {
content: '\78'
}
.icon-youku:before {
content: '\41'
}
.icon-youtube:before {
content: '\67'
}
.icon-calendar:before {
content: '\63'
}
.icon-search:before {
content: '\6b'
}
.icon-files:before {
content: '\6e'
}
.icon-download:before {
content: '\6a'
}
.icon-add:before {
content: '\61'
}
.icon-remove:before {
content: '\66'
}
.icon-play:before {
content: '\7a'
}
.fp-controlArrow {
font-size: 1.4rem;
z-index: 55;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
margin-top: 8px;
padding: 0;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
text-align: center;
color: #fff;
border: none;
background-color: #000;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
@media all and (max-width: 767px) {
.fp-controlArrow {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.fp-controlArrow {
display: none
}
}
.fp-controlArrow:before {
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.fp-controlArrow.fp-prev {
right: 24px;
left: inherit;
width: 48px;
height: 48px;
margin-top: -56px
}
.fp-controlArrow.fp-prev:before {
content: '\76'
}
.fp-controlArrow.fp-next {
right: 24px;
width: 48px;
height: 48px
}
.fp-controlArrow.fp-next:before {
content: '\65'
}
.slider-btn {
font-size: 1.4rem;
position: absolute;
z-index: 55;
top: 50%;
overflow: hidden;
width: 48px;
height: 48px;
margin-top: 8px;
padding: 24px;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
text-align: center;
color: #fff;
border: none;
background-color: #000
}
.slider-btn:before {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slider-btn.prev-btn {
right: 24px;
left: inherit;
margin-top: -56px
}
@media all and (max-width: 767px) {
.slider-btn.prev-btn {
position: fixed;
top: 64px;
right: 16px;
margin: 0
}
}
.slider-btn.prev-btn:before {
content: '\76'
}
.slider-btn.next-btn {
right: 24px
}
@media all and (max-width: 767px) {
.slider-btn.next-btn {
position: fixed;
top: 112px;
right: 16px;
margin: 0
}
}
.slider-btn.next-btn:before {
content: '\65'
}
span.DTA {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.page-header .logo {
position: fixed;
z-index: 80;
width: 100%;
height: 65px;
padding: 0 32px 0 16px;
background-color: #fff
}
@media all and (max-width: 767px) {
.page-header .logo {
/*position: static;*/
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .logo {
padding-left: 32px
}
}
.page-header .logo img {
display: block;
float: left;
width: auto;
height: 100%
}
.page-header .page-border {
position: fixed;
z-index: 81;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none
}
@media all and (max-width: 767px) {
.page-header .page-border {
display: none
}
}
.page-header .page-border div {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-style: solid
}
.page-header .page-border .black {
border-width: 16px;
border-color: #fff;
border-top: none
}
.page-header .page-border .gray {
border-width: 0;
border-color: #f5f5f5
}
.page-header .menu-nav-container {
position: fixed;
z-index: 85;
width: 100vw;
height: 0
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container {
top: 0
}
}
.page-header .menu-nav-container.close .page-nav {
height: 48px;
margin-top: 8px;
padding-right: 0;
padding-left: 0;
border-top: none
}
.page-header .menu-nav-container.close .subnav-container .subnav {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
pointer-events: auto;
opacity: 1
}
.page-header .menu-nav-container.close .page-menu .button {
background-color: #000
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container.close .page-menu .button {
right: 16px
}
}
.page-header .menu-nav-container.close .page-menu .button .search-btn {
opacity: 0
}
.page-header .menu-nav-container.close .page-menu .button .hamburger {
opacity: 1
}
.page-header .menu-nav-container .page-nav {
position: relative;
float: right;
overflow: hidden;
height: 48px;
margin-top: 8px;
margin-right: 64px;
padding: 0 16px;
transition: padding 1s cubic-bezier(0.77, 0, 0.175, 1);
background-color: #fff
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-nav {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .page-nav {
display: none
}
}
.page-header .menu-nav-container .page-nav ul {
height: 100%;
padding: 6px 0;
transition: all 1s cubic-bezier(0.77, 0, 0.175, 1)
}
.page-header .menu-nav-container .page-nav ul li {
font-size: 1.4rem;
float: left;
overflow: hidden;
height: 100%;
margin: 0 16px;
transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-header .menu-nav-container .page-nav ul li {
margin: 0 12px
}
}
.page-header .menu-nav-container .page-nav ul li a {
display: table-cell;
height: 3.6rem;
vertical-align: middle;
white-space: nowrap;
color: #9b9b9b
}
.page-header .menu-nav-container .page-nav ul li a:hover {
color: #ea212e
}
.page-header .menu-nav-container .page-nav ul li a:hover span {
color: #ea212e
}
.page-header .menu-nav-container .page-nav ul li.current a {
color: #000
}
.page-header .menu-nav-container .page-nav ul li.current a span {
color: #000
}
.page-header .menu-nav-container .page-nav ul li.lang {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.page-header .menu-nav-container .page-nav ul li.lang span {
color: #9b9b9b
}
.page-header .menu-nav-container .page-nav ul li.lang.en .en {
color: #000
}
.page-header .menu-nav-container .page-nav ul li.lang.cn .cn {
color: #000
}
.page-header .menu-nav-container .page-nav.homepage a,
.page-header .menu-nav-container .page-nav.search-page a {
color: #000
}
.page-header .menu-nav-container .subnav-container {
position: relative;
float: right;
overflow: hidden;
margin-right: -1px
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .subnav-container {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .subnav-container {
margin-right: 64px
}
}
.page-header .menu-nav-container .subnav-container .subnav {
height: 48px;
margin-top: 8px;
padding-left: 12px;
transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform: translateX(100vw);
-ms-transform: translateX(100vw);
transform: translateX(100vw);
pointer-events: none;
opacity: 0;
background-color: #ea212e
}
.page-header .menu-nav-container .subnav-container .subnav:before {
position: relative;
top: 19px;
left: 8px;
float: left;
color: #fff;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.page-header .menu-nav-container .subnav-container .subnav.filter:before {
content: '\71'
}
.page-header .menu-nav-container .subnav-container .subnav.anchor:before {
content: '\45'
}
.page-header .menu-nav-container .subnav-container .subnav ul {
float: left;
padding: 0 10px;
transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
height: 100%
}
.page-header .menu-nav-container .subnav-container .subnav ul.nav2 {
background-color: #323232
}
.page-header .menu-nav-container .subnav-container .subnav ul li {
font-size: 1.4rem;
height: 100%;
display: block;
float: left;
overflow: hidden;
margin: 0 10px;
transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
white-space: nowrap;
color: #f5f5f5;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.page-header .menu-nav-container .subnav-container .subnav ul li a {
display: block;
color: #f5f5f5;
line-height: 100%
}
.page-header .menu-nav-container .subnav-container .subnav ul li a:hover {
color: #fff
}
.page-header .menu-nav-container .subnav-container .subnav ul li.current {
color: #fff
}
.page-header .menu-nav-container .subnav-container .subnav ul li.current a {
color: #fff
}
.page-header .menu-nav-container .page-menu .background {
position: fixed;
z-index: -1;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
pointer-events: none;
opacity: 0;
background-color: rgba(255, 255, 255, 0.7);
-webkit-animation: MenuBackgroundHide .5s;
animation: MenuBackgroundHide .5s
}
.page-header .menu-nav-container .page-menu .button {
position: absolute;
z-index: 89;
top: 8px;
right: 16px;
overflow: hidden;
width: 48px;
height: 48px;
transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
background-color: #ea212e
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .button {
right: 0;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
background-color: #000
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .page-menu .button {
background-color: #000
}
}
.page-header .menu-nav-container .page-menu .button .search-btn {
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding: 12px;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
color: #fff
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .button .search-btn {
display: none;
opacity: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .page-menu .button .search-btn {
display: none;
opacity: 0
}
}
.page-header .menu-nav-container .page-menu .button .hamburger {
position: relative;
width: 100%;
height: 100%;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
opacity: 0
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .button .hamburger {
opacity: 1
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .page-menu .button .hamburger {
opacity: 1
}
}
.page-header .menu-nav-container .page-menu .button .hamburger .hamburger-piece {
position: absolute;
overflow: hidden;
width: 20px
}
.page-header .menu-nav-container .page-menu .button .hamburger .hamburger-piece.top-bun {
top: 17px;
left: 14px;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform-origin: 10px 1px;
-ms-transform-origin: 10px 1px;
transform-origin: 10px 1px
}
.page-header .menu-nav-container .page-menu .button .hamburger .hamburger-piece.meat {
top: 23px;
left: 14px;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform-origin: 10px 1px;
-ms-transform-origin: 10px 1px;
transform-origin: 10px 1px
}
.page-header .menu-nav-container .page-menu .button .hamburger .hamburger-piece.bottom-bun {
top: 29px;
left: 14px;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform-origin: 10px 1px;
-ms-transform-origin: 10px 1px;
transform-origin: 10px 1px
}
.page-header .menu-nav-container .page-menu .button .hamburger .hamburger-piece .whole {
width: 100%;
height: 2px;
background-color: #fff
}
.page-header .menu-nav-container .page-menu .button:hover .search-btn {
-webkit-transform: scale(1.05, 1.05);
-ms-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05)
}
.page-header .menu-nav-container .page-menu .button:hover .top-bun {
-webkit-transform: translate(2px, 0);
-ms-transform: translate(2px, 0);
transform: translate(2px, 0)
}
.page-header .menu-nav-container .page-menu .button:hover .meat {
-webkit-transform: translate(-3px, 0);
-ms-transform: translate(-3px, 0);
transform: translate(-3px, 0)
}
.page-header .menu-nav-container .page-menu .button:hover .bottom-bun {
-webkit-transform: translate(1px, 0);
-ms-transform: translate(1px, 0);
transform: translate(1px, 0)
}
.page-header .menu-nav-container .page-menu .container {
position: absolute;
z-index: 88;
top: 0;
right: -100vw;
min-width: 50vw;
height: 100vh;
transition: right 0.8s cubic-bezier(0.77, 0, 0.175, 1);
display: flex;
flex-direction: column;
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container {
width: 100vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-header .menu-nav-container .page-menu .container {
width: 100vw
}
}
.page-header .menu-nav-container .page-menu .container .upper {
display: table;
width: 100%;
padding: 80px 112px 32px;
background-color: #ea212e
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .upper {
padding: 64px 32px 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-header .menu-nav-container .page-menu .container .upper {
padding: 80px 64px 32px
}
}
.page-header .menu-nav-container .page-menu .container .upper .home-btn {
font-size: 1.4rem;
position: absolute;
top: 32px;
color: #fff;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.page-header .menu-nav-container .page-menu .container .upper .home-btn a {
color: #fff
}
.page-header .menu-nav-container .page-menu .container .upper .search-container {
display: table-cell;
height: 9.7vh;
padding: 16px 0;
vertical-align: bottom;
color: #fff;
border-bottom: 1px solid #fff
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .upper .search-container {
padding: 8px 0
}
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .icon-search {
line-height: 24px;
float: left;
width: 24px;
height: 24px
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .search {
line-height: 24px;
float: left;
width: 80%;
height: 24px;
padding: 0 16px;
color: #fff;
border: none;
border-radius: 0;
outline: none;
background: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .upper .search-container .search {
padding: 0 8px
}
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .search::-webkit-input-placeholder {
opacity: .5;
color: #fff
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .search:-ms-input-placeholder {
opacity: .5;
color: #fff
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .search::-moz-placeholder {
opacity: .5;
color: #fff
}
.page-header .menu-nav-container .page-menu .container .upper .search-container .search:-moz-placeholder {
opacity: .5;
color: #fff
}
.page-header .menu-nav-container .page-menu .container .lower {
position: relative;
padding: 32px 112px;
background-color: #fff;
flex: 1 1 auto;
display: flex;
flex-direction: column;
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower {
padding: 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-header .menu-nav-container .page-menu .container .lower {
padding: 32px 64px
}
}
.page-header .menu-nav-container .page-menu .container .lower ul li {
color: #000
}
.page-header .menu-nav-container .page-menu .container .lower ul.menu-list {
margin-bottom: 40px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700;
flex: 1 1 auto;
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower ul.menu-list {
margin-bottom: 24px
}
}
.page-header .menu-nav-container .page-menu .container .lower ul.menu-list li {
font-size: 3.2vh;
display: table
}
.page-header .menu-nav-container .page-menu .container .lower ul.menu-list li a {
display: table-cell;
vertical-align: middle;
color: #000
}
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list {
position: absolute;
right: 16px;
bottom: 32px
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list {
position: static;
margin-bottom: 24px
}
}
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list li {
color: #fff;
font-size: 1.6rem;
font-weight: 900;
line-height: 48px;
display: inline-block;
width: 48px;
height: 48px;
text-align: center;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list li {
font-size: 1.4rem;
line-height: 32px;
width: 32px;
height: 32px
}
}
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list li.current {
background-color: #ea212e
}
.page-header .menu-nav-container .page-menu .container .lower ul.lang-list li a {
color: #fff
}
.page-header .menu-nav-container .page-menu .container .lower ul.social-list {
line-height: 0
}
.page-header .menu-nav-container .page-menu .container .lower ul.social-list li {
display: inline-block;
width: 20px;
height: 20px;
margin-right: 16px
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower ul.social-list li {
width: 16px;
height: 16px
}
}
.page-header .menu-nav-container .page-menu .container .lower ul.social-list li:before {
font-size: 2rem
}
@media all and (max-width: 767px) {
.page-header .menu-nav-container .page-menu .container .lower ul.social-list li:before {
font-size: 1.6rem
}
}
.page-header .menu-nav-container .page-menu.open .background {
z-index: 80;
pointer-events: auto;
opacity: 1;
-webkit-animation: MenuBackgroundShow .5s;
animation: MenuBackgroundShow .5s
}
.page-header .menu-nav-container .page-menu.open .container {
right: 0vw;
pointer-events: auto;
}
.page-header .menu-nav-container .page-menu.open .button {
background-color: #ea212e
}
.page-header .menu-nav-container .page-menu.open .button .search-btn {
opacity: 0
}
.page-header .menu-nav-container .page-menu.open .button .hamburger {
opacity: 1
}
.page-header .menu-nav-container .page-menu.open .button .top-bun {
top: 23px !important;
left: 23px !important;
width: 11px;
-webkit-transform: rotateZ(45deg);
-ms-transform: rotate(45deg);
transform: rotateZ(45deg)
}
.page-header .menu-nav-container .page-menu.open .button .meat {
top: 23px !important;
width: 17px
}
.page-header .menu-nav-container .page-menu.open .button .bottom-bun {
top: 23px !important;
left: 23px !important;
width: 11px;
-webkit-transform: rotateZ(-45deg);
-ms-transform: rotate(-45deg);
transform: rotateZ(-45deg)
}
.page-header .menu-nav-container .page-menu.open .button:hover .top-bun {
top: 23px;
left: 25px;
width: 11px;
-webkit-transform: rotateZ(45deg);
-ms-transform: rotate(45deg);
transform: rotateZ(45deg)
}
.page-header .menu-nav-container .page-menu.open .button:hover .meat {
top: 23px;
-webkit-transform: scaleX(1.15);
-ms-transform: scaleX(1.15);
transform: scaleX(1.15)
}
.page-header .menu-nav-container .page-menu.open .button:hover .bottom-bun {
top: 23px;
left: 25px;
width: 11px;
-webkit-transform: rotateZ(-45deg);
-ms-transform: rotate(-45deg);
transform: rotateZ(-45deg)
}
.page-footer {
position: relative;
width: 100%;
padding: 64px 64px 32px;
color: #323232;
background-color: #f5f5f5 !important;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.page-footer {
padding: 80px 16px 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer {
padding: 40px 32px 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer {
padding: 64px 48px 32px
}
}
.page-footer a {
color: #323232
}
.page-footer .partners {
width: 800px;
margin: 0 auto 40px;
text-align: center
}
@media all and (max-width: 767px) {
.page-footer .partners {
width: 100%;
margin-bottom: 48px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners {
width: 456px;
margin-bottom: 64px
}
}
.page-footer .partners li {
float: left;
margin-bottom: 32px
}
.page-footer .partners li.partner1 {
width: 16.75%
}
@media all and (max-width: 767px) {
.page-footer .partners li.partner1 {
width: 29.38596%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners li.partner1 {
width: 29.38596%
}
}
.page-footer .partners li.partner2 {
width: 18.0625%;
margin-left: 5.5%
}
@media all and (max-width: 767px) {
.page-footer .partners li.partner2 {
width: 31.57895%;
margin-left: 9.86842%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners li.partner2 {
width: 31.57895%;
margin-left: 9.86842%
}
}
.page-footer .partners li.partner3 {
width: 7%;
margin-left: 8.4375%
}
@media all and (max-width: 767px) {
.page-footer .partners li.partner3 {
width: 12.2807%;
margin-left: 15.35088%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners li.partner3 {
width: 12.2807%;
margin-left: 15.35088%
}
}
.page-footer .partners li.partner4 {
width: 14%;
margin-left: 8.4375%
}
@media all and (max-width: 767px) {
.page-footer .partners li.partner4 {
width: 24.5614%;
margin-left: 19.73684%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners li.partner4 {
width: 24.5614%;
margin-left: 19.73684%
}
}
.page-footer .partners li.partner5 {
width: 13.25%;
margin-left: 8.4375%
}
@media all and (max-width: 767px) {
.page-footer .partners li.partner5 {
width: 23.24561%;
margin-left: 15.35088%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .partners li.partner5 {
width: 23.24561%;
margin-left: 15.35088%
}
}
@media all and (max-width: 767px) {
.page-footer .row {
position: relative;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse
}
}
.page-footer .social-list {
line-height: 0;
float: left;
margin-top: 12px;
margin-bottom: 44px
}
@media all and (max-width: 767px) {
.page-footer .social-list {
margin-top: 0;
margin-bottom: 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .social-list {
margin-top: 0;
margin-bottom: 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .social-list {
margin-top: 8px;
margin-bottom: 40px
}
}
.page-footer .social-list li {
display: inline-block;
width: 24px;
height: 24px;
margin-right: 16px
}
@media all and (max-width: 767px) {
.page-footer .social-list li {
width: 20px;
height: 20px;
margin-right: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .social-list li {
width: 20px;
height: 20px;
margin-right: 20px
}
}
.page-footer .social-list li:before {
font-size: 2.4rem
}
@media all and (max-width: 767px) {
.page-footer .social-list li:before {
font-size: 2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .social-list li:before {
font-size: 2rem
}
}
.page-footer .newsletter {
position: relative;
float: right;
margin-bottom: 32px;
text-align: right
}
@media all and (max-width: 767px) {
.page-footer .newsletter {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 32px;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .newsletter {
margin-bottom: 64px
}
}
.page-footer .newsletter .button {
font-weight: 700;
line-height: 48px;
width: 160px;
height: 48px;
margin-left: 32px;
text-align: center;
color: #fff;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.page-footer .newsletter .button {
line-height: 40px;
width: 20vw;
height: 40px;
margin-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .newsletter .button {
line-height: 40px;
width: 112px;
height: 40px;
margin-left: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .newsletter .button {
line-height: 40px;
width: 128px;
height: 40px;
margin-left: 16px
}
}
.page-footer .newsletter .button:hover {
background-color: #ea212e
}
.page-footer .newsletter .email {
line-height: 47px;
display: block;
float: left;
width: 30vw;
height: 47px;
padding: 0 8px;
text-align: left;
border: none;
border-bottom: 1px solid #323232;
border-radius: 0;
outline: none;
background: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.page-footer .newsletter .email {
font-size: 1rem;
line-height: 39px;
height: 40px;
padding-left: 4px;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .newsletter .email {
line-height: 39px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .newsletter .email {
line-height: 39px
}
}
.page-footer .newsletter .tag {
line-height: 47px;
position: absolute;
top: 0;
left: 0;
width: 30vw;
padding: 0 8px;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
text-align: left;
opacity: 0;
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
.page-footer .newsletter .tag {
line-height: 39px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .newsletter .tag {
line-height: 39px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .newsletter .tag {
line-height: 39px
}
}
.page-footer .newsletter .tag span {
display: none
}
.page-footer .newsletter .tag span.wrong {
color: #ea212e
}
.page-footer .newsletter .tag.wrong {
opacity: 1
}
.page-footer .newsletter .tag.wrong .wrong {
display: inline
}
.page-footer .newsletter .tag.success {
opacity: 1
}
.page-footer .newsletter .tag.success .success {
display: inline
}
.page-footer .copyright {
float: left
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .copyright {
font-size: 1rem
}
}
.page-footer .links {
position: relative;
float: right
}
@media all and (max-width: 767px) {
.page-footer .links {
position: static
}
}
.page-footer .links li {
line-height: 16px;
float: left;
margin-right: 32px
}
@media all and (max-width: 767px) {
.page-footer .links li {
font-size: 1rem;
margin-right: 16px;
margin-bottom: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .links li {
font-size: 1rem;
margin-right: 20px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .links li {
font-size: 1rem;
margin-right: 16px
}
}
.page-footer .links li.icon-calendar {
margin-right: 16px;
padding-right: 16px;
border-right: 1px solid #323232
}
@media all and (max-width: 767px) {
.page-footer .links li.icon-calendar {
width: 100%;
margin-right: 0;
margin-bottom: 16px;
padding-right: 0;
border-right: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.page-footer .links li.icon-calendar {
position: absolute;
top: -32px;
right: 0;
margin-right: 0;
padding-right: 0;
border-right: none
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .links li.icon-calendar {
margin-right: 8px;
padding-right: 8px
}
}
.page-footer .links li.icon-calendar:before {
top: 1px;
margin-right: 8px
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.page-footer .links li.icon-calendar:before {
margin-right: 8px
}
}
.page-footer .links li.lang {
width: 24px;
height: 16px;
margin-right: 0;
background-size: cover
}
@media all and (max-width: 767px) {
.page-footer .links li.lang {
position: absolute;
right: 0;
bottom: 0;
margin-bottom: 0
}
}
.page-footer .links li.lang.cn {
background-image: url(../img/nation/CHN.jpg)
}
@media only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 1.5),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
.page-footer .links li.lang.cn {
background-image: url(../img/nation/CHN@2x.jpg)
}
}
.page-footer .links li.lang.en {
background-image: url(../img/nation/USA.jpg)
}
@media only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 1.5),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
.page-footer .links li.lang.en {
background-image: url(../img/nation/USA@2x.jpg)
}
}
.scroll-down-tag {
font-size: 1rem;
font-weight: 700;
position: fixed;
z-index: 10;
right: 32px;
bottom: 0;
transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform: matrix(0, -1, 1, 0, 0, -96);
-ms-transform: matrix(0, -1, 1, 0, 0, -96);
transform: matrix(0, -1, 1, 0, 0, -96);
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
pointer-events: none;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.scroll-down-tag {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.scroll-down-tag {
display: none
}
}
.scroll-down-tag.hide {
opacity: 0
}
.scroll-down-tag:before {
font-size: 1.2rem;
top: 2px;
margin-right: 8px;
content: '\76';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.scroll-top-tag {
font-size: 1rem;
font-weight: 700;
position: absolute;
top: 0;
right: 0;
width: 64px;
cursor: pointer;
-webkit-transform: matrix(0, 1, -1, 0, 32, 16);
-ms-transform: matrix(0, 1, -1, 0, 32, 16);
transform: matrix(0, 1, -1, 0, 32, 16);
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.scroll-top-tag:before {
font-size: 1.2rem;
top: 2px;
margin-right: 8px;
content: '\76';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.page-main {
width: 100%;
min-height: 60vh
}
.page-main .section {
overflow: hidden;
max-height: 100vh
}
.page-main .more {
font-weight: 700;
line-height: 100%;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.page-main .more a {
color: #000
}
.page-main .more a:after {
top: 2px;
margin-left: 8px;
content: '\65';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.page-container {
width: 100%;
padding-top: 65px;
padding-bottom: 16px;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
@media all and (max-width: 767px) {
.page-container {
padding-top: 0;
padding-bottom: 0
}
}
.half-container {
position: relative;
float: left;
width: 50%;
height: 100vh
}
@media all and (max-width: 767px) {
.half-container.upper {
float: none;
width: 100%;
height: auto
}
.half-container.lower {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.half-container.upper {
position: absolute;
top: 0;
float: none;
width: 100%;
height: 50vh
}
.half-container.lower {
position: absolute;
top: 50vh;
float: none;
width: 100%;
height: 50vh
}
}
.half-container.pull-right {
float: right
}
.half-container .half-list {
width: 100%
}
.half-container .half-list li {
width: 100%;
height: 100vh
}
.half-container .media {
background-position: center;
background-size: cover
}
.overlay-container {
position: fixed;
z-index: 900;
top: 0;
left: 0;
display: none;
width: 100%;
height: 100%
}
.overlay-container.show .revealer .layer {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%)
}
.overlay-container.show .revealer .layer:first-child {
transition-delay: .1s
}
.overlay-container.show .revealer .layer:last-child {
transition-delay: .15s
}
.overlay-container.show .overlay {
display: block;
opacity: 1
}
.overlay-container .revealer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.overlay-container .revealer .layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.overlay-container .revealer .layer:first-child {
background-color: #ea212e
}
.overlay-container .revealer .layer:last-child {
background-color: #fff
}
.overlay-container .overlay {
position: relative;
height: 100%;
opacity: 0;
background-color: #fff
}
@media all and (max-width: 767px) {
.overlay-container .overlay {
overflow: auto;
-webkit-overflow-scrolling: touch
}
}
.overlay-container .overlay .scroll-bar {
opacity: 0
}
@media all and (max-width: 767px) {
.overlay-container .overlay .scroll-bar {
display: none
}
}
.close-btn {
position: absolute;
z-index: 999;
top: 50%;
left: 32px;
width: 48px;
height: 48px;
margin-top: -24px;
cursor: pointer;
background-color: #ea212e
}
@media all and (max-width: 767px) {
.close-btn {
position: fixed;
top: 16px;
right: 16px;
left: auto;
margin-top: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.close-btn {
top: 16px;
right: 16px;
left: auto;
margin-top: 0
}
}
.close-btn .hamburger {
position: absolute;
top: 50%;
left: 50%;
width: 20px;
height: 20px;
margin-top: -10px;
margin-left: -10px;
transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1)
}
.close-btn .hamburger-piece {
position: absolute;
top: 50%;
left: 50%;
overflow: hidden;
width: 20px;
height: 2px;
margin-top: -1px;
margin-left: -10px;
background-color: #fff
}
.close-btn .top-bun {
-webkit-transform: rotateZ(45deg);
-ms-transform: rotate(45deg);
transform: rotateZ(45deg)
}
.close-btn .bottom-bun {
-webkit-transform: rotateZ(-45deg);
-ms-transform: rotate(-45deg);
transform: rotateZ(-45deg)
}
.close-btn:hover .hamburger {
-webkit-transform: rotateZ(270deg);
-ms-transform: rotate(270deg);
transform: rotateZ(270deg)
}
.news-date {
font-size: 1.8rem;
font-weight: 700;
display: table;
margin-bottom: 16px;
color: #e1e1e1;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.news-date {
font-size: 1.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.news-date {
font-size: 1.4rem
}
}
.news-date span {
display: table-cell;
padding-bottom: 16px;
padding-left: 8px;
vertical-align: bottom
}
.news-date span.day {
font-size: 12rem;
font-weight: 400;
line-height: 90px;
padding-left: 0;
border-bottom: 4px solid #ea212e;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.news-date span.day {
font-size: 10rem;
line-height: 75px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.news-date span.day {
font-size: 10rem;
line-height: 75px
}
}
#homeBanner .media {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh
}
@media all and (max-width: 767px) {
#homeBanner .media {
height: 100vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .media {
height: auto
}
}
#homeBanner .media img,
#homeBanner .media svg,
#homeBanner .media video {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media all and (max-width: 767px) {
#homeBanner .media img,
#homeBanner .media svg,
#homeBanner .media video {
width: auto;
height: 100%;
-webkit-transform: translate(-50%, -50.2%);
-ms-transform: translate(-50%, -50.2%);
transform: translate(-50%, -50.2%)
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .media img,
#homeBanner .media svg,
#homeBanner .media video {
top: 0;
left: 0;
width: 100%;
height: auto;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
@media (min-width: 992px) and (min-aspect-ratio: 1600 / 1024) {
#homeBanner .media img,
#homeBanner .media svg,
#homeBanner .media video {
width: 100%
}
}
@media (min-width: 992px) and (max-aspect-ratio: 1600 / 1024) {
#homeBanner .media img,
#homeBanner .media svg,
#homeBanner .media video {
width: auto;
height: 100%
}
}
#homeBanner .slider-info {
position: absolute;
bottom: 48px;
left: 48px;
width: 60%
}
@media all and (max-width: 767px) {
#homeBanner .slider-info {
bottom: 16px;
left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .slider-info {
bottom: 32px;
left: 32px
}
}
#homeBanner .slider-info h1 {
margin-bottom: 16px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .slider-info h1 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .slider-info h1 {
font-size: 3.6rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .slider-info h1 {
font-size: 3.6rem
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .slider-info h1 {
font-size: 5.6rem
}
}
@media all and (min-width: 1600px) {
#homeBanner .slider-info h1 {
font-size: 6.4rem
}
}
#homeBanner .slider-info .more a {
color: #fff
}
#homeBanner .slide {
position: relative;
overflow: hidden
}
@media all and (max-width: 767px) {
#homeBanner .slide.video .jp-video {
height: 100vw
}
}
#homeBanner .slide.video .jp-mute-container {
position: absolute;
top: 65px;
right: 16px;
float: none;
margin: 0
}
#homeBanner .slide.video .jp-mute-container .jp-mute {
line-height: 1;
margin: 0;
padding: 16px;
cursor: pointer;
color: #fff
}
#homeBanner .slide.live.noflash #liveContainer {
display: none
}
#homeBanner .slide.live.noflash .flash-tag {
display: block
}
#homeBanner .slide.live.noflash .slider-bg {
display: block
}
#homeBanner .slide.live.block #liveContainer {
display: none
}
#homeBanner .slide.live.block .flash-tag {
display: none !important
}
#homeBanner .slide.live.block .slider-bg {
display: block
}
#homeBanner .slide.live.block .slider-info {
display: -ms-flexbox;
display: flex
}
#homeBanner .slide.live.mobile #liveContainer {
display: block
}
#homeBanner .slide.live.mobile .flash-tag {
display: none !important
}
#homeBanner .slide.live.mobile .slider-bg {
display: none
}
#homeBanner .slide.live.mobile .slider-info {
/* display: -webkit-flex;
display: -ms-flexbox;
display: flex*/
}
/*
#homeBanner .slide.live.block #liveContainer {
display: none
}
#homeBanner .slide.live.block .flash-tag {
display: none !important
}
#homeBanner .slide.live.block .slider-bg {
display: block
}
#homeBanner .slide.live.block .slider-info {
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}*/
#homeBanner .slide.live .flash-tag {
position: absolute;
top: 50%;
display: none;
width: 100%;
text-align: center;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .slide.live .flash-tag {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .slide.live .flash-tag {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .slide.live .flash-tag {
font-size: 2.4rem
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .slide.live .flash-tag {
font-size: 3.6rem
}
}
@media all and (min-width: 1600px) {
#homeBanner .slide.live .flash-tag {
font-size: 3.6rem
}
}
#homeBanner .slide.live .slider-bg {
display: none
}
#homeBanner .slide.live .slider-info {
position: absolute;
top: 0;
left: 0;
display: none;
width: 100%;
height: 100%;
padding: 0 10vw;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
#homeBanner .slide.live .slider-info h1 {
text-decoration: underline
}
#homeBanner .slide.live .slider-info .more {
display: none
}
#homeBanner #liveContainer {
width: 100%;
height: 100%
}
@media all and (max-width: 767px) {
#homeBanner #liveContainer {
/*height: 0*/
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner #liveContainer {
/*height: 0*/
}
}
#homeBanner .video-js {
width: 100%;
height: 100%
}
#homeBanner .video-js.vjs-tech {
left: 50%;
width: 100%;
height: 100%;
}
@media all and (min-width:992px) and (max-width: 1024px) {
#homeBanner .video-js.m3u8 .vjs-tech {
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
}
.vjs-resize-manager {
position: absolute;
}
#homeBanner .live-icon {
line-height: 1;
position: absolute;
top: 81px;
right: 32px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#homeBanner .live-icon span {
display: block;
float: left;
width: 12px;
height: 12px;
margin: 1px 8px 1px 0;
border-radius: 50%;
background-color: #ea212e
}
#homeBanner .banner-info {
position: absolute;
z-index: 5;
bottom: 0;
display: none;
width: 100%;
padding: 64px 48px;
pointer-events: none;
color: #fff;
background-image: url(../img/home_banner_info_bg.png);
background-repeat: repeat-x;
background-position: bottom;
background-size: auto 100%
}
@media all and (max-width: 767px) {
#homeBanner .banner-info {
height: 100%;
padding: 81px 16px 16px;
background-size: auto 30%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info {
padding: 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info {
padding: 48px
}
}
#homeBanner .banner-info .logo {
width: 100%;
height: 48px
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .logo {
position: absolute;
top: 16px;
left: 16px
}
}
#homeBanner .banner-info .logo img {
width: auto;
height: 100%
}
#homeBanner .banner-info .title {
line-height: 100%;
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .title {
font-size: 1rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .title {
font-size: 1.2rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .title {
font-size: 1.4rem
}
}
#homeBanner .banner-info .season-info {
float: left;
padding-top: 24px
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .season-info {
position: absolute;
bottom: 16px;
left: 16px;
width: 45%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .season-info {
width: 30%
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .season-info {
width: 35%
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .season-info {
width: 35%
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .season-info {
width: 32%
}
}
#homeBanner .banner-info .season-info .info {
margin-bottom: 16px
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .season-info .info {
height: 75px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .season-info .info {
height: 92px
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .season-info .info {
height: 122px
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .season-info .info {
height: 140px
}
}
#homeBanner .banner-info .season-info .date {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .season-info .date {
font-size: 2.4rem;
margin-bottom: 8px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .season-info .date {
font-size: 3rem;
line-height: 30px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .season-info .date {
font-size: 3.6rem;
line-height: 30px
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .season-info .date {
font-size: 4.8rem;
line-height: 43.75px
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .season-info .date {
font-size: 4.8rem;
line-height: 50px
}
}
#homeBanner .banner-info .season-info .circuit,
#homeBanner .banner-info .season-info .location {
line-height: 100%;
margin-bottom: 8px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .season-info .circuit,
#homeBanner .banner-info .season-info .location {
font-size: 1.2rem;
margin-bottom: 4px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .season-info .circuit,
#homeBanner .banner-info .season-info .location {
font-size: 1.6rem;
margin-bottom: 4px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .season-info .circuit,
#homeBanner .banner-info .season-info .location {
font-size: 2rem
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .season-info .circuit,
#homeBanner .banner-info .season-info .location {
font-size: 2rem
}
}
#homeBanner .banner-info .season-info .more {
font-size: 1.4rem;
font-weight: 700;
line-height: 100%;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .season-info .more {
font-size: 1rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .season-info .more {
font-size: 1rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .season-info .more {
font-size: 1.2rem
}
}
#homeBanner .banner-info .season-info .more a {
color: #fff
}
#homeBanner .banner-info .count-down {
float: left;
padding-top: 24px;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
opacity: 0
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .count-down {
position: absolute;
right: 16px;
bottom: 16px;
width: 45%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .count-down {
width: 70%
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .count-down {
width: 65%
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .count-down {
width: 65%
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .count-down {
width: 68%
}
}
#homeBanner .banner-info .count-down.ready {
opacity: 1
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .count-down .title {
margin-bottom: 20px
}
}
#homeBanner .banner-info .count-down .num {
line-height: 100%;
float: left;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .count-down .num {
font-size: 1rem;
margin-right: 3vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .count-down .num {
font-size: 1rem;
margin-right: 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .count-down .num {
font-size: 1.2rem;
margin-right: 48px
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .count-down .num {
margin-right: 64px
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .count-down .num {
margin-right: 72px
}
}
#homeBanner .banner-info .count-down .num:last-child {
margin-right: 0
}
#homeBanner .banner-info .count-down .num span {
display: block;
margin-top: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeBanner .banner-info .count-down .num span {
font-size: 11vw;
margin-bottom: 8px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .banner-info .count-down .num span {
font-size: 10rem;
line-height: 75px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeBanner .banner-info .count-down .num span {
font-size: 14rem;
line-height: 92px
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
#homeBanner .banner-info .count-down .num span {
font-size: 16.4rem;
line-height: 122px
}
}
@media all and (min-width: 1600px) {
#homeBanner .banner-info .count-down .num span {
font-size: 20rem;
line-height: 140px
}
}
#homeBanner .timer-bar {
position: absolute;
z-index: 6;
bottom: 16px;
left: 0;
width: 100%;
height: 4px;
-webkit-transform: scale(0, 1);
-ms-transform: scale(0, 1);
transform: scale(0, 1);
background-color: #ea212e
}
@media all and (max-width: 767px) {
#homeBanner .timer-bar {
bottom: 0;
height: 2px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeBanner .timer-bar {
bottom: 0
}
}
#homeBanner .timer-bar.left {
-webkit-transform-origin: left;
-ms-transform-origin: left;
transform-origin: left
}
#homeBanner .timer-bar.right {
-webkit-transform-origin: right;
-ms-transform-origin: right;
transform-origin: right
}
#homeRanking {
float: left;
width: 50%;
height: 65vh;
padding: 32px;
background-color: #f5f5f5
}
@media all and (min-width: 1400px) {
#homeRanking {
padding-right: 64px;
padding-left: 64px
}
}
@media all and (max-width: 767px) {
#homeRanking {
width: 100%;
height: 60vh;
padding: 16px 16px 32px
}
}
@media all and (max-width: 767px) {
#homeRanking .tabs {
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
}
#homeRanking .tabs li {
float: left;
width: 160px;
padding: 16px 0;
cursor: pointer;
text-align: center;
color: #9b9b9b
}
@media all and (max-width: 767px) {
#homeRanking .tabs li {
width: 96px;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking .tabs li {
width: 96px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeRanking .tabs li {
width: 144px
}
}
#homeRanking .tabs li.current {
color: #ea212e;
background-color: #fff
}
#homeRanking .tabs li h5 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#homeRanking table {
font-weight: 700;
width: 100%;
background-color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#homeRanking table .col-1 {
width: 70px
}
@media all and (max-width: 767px) {
#homeRanking table .col-1 {
width: 40px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table .col-1 {
width: 40px
}
}
#homeRanking table .col-2 {
width: 15%;
max-width: 100px;
text-align: center
}
@media all and (max-width: 767px) {
#homeRanking table .col-4 {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table .col-4 {
display: none
}
}
#homeRanking table .col-5 {
width: 60px
}
#homeRanking table.current tr {
display: table-row
}
#homeRanking table tr {
display: none
}
#homeRanking table th {
height: 46px;
padding: 8px 0 8px 32px;
text-align: left
}
@media all and (max-width: 767px) {
#homeRanking table th {
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table th {
padding-left: 16px
}
}
#homeRanking table th:last-child {
padding: 8px 32px 8px 0
}
@media all and (max-width: 767px) {
#homeRanking table th:last-child {
padding-right: 16px;
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table th:last-child {
padding-right: 16px;
padding-left: 16px
}
}
#homeRanking table tbody tr:nth-child(2n-1) {
background-color: #f5f5f5
}
#homeRanking table tbody tr:nth-child(-n+3) .index {
background-color: #ea212e
}
#homeRanking table tbody tr td:last-child {
padding: 8px 32px 8px 0
}
@media all and (max-width: 767px) {
#homeRanking table tbody tr td:last-child {
padding-right: 16px;
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table tbody tr td:last-child {
padding-right: 16px;
padding-left: 16px
}
}
#homeRanking table td {
height: 46px;
padding: 8px 0 8px 32px
}
@media all and (max-width: 767px) {
#homeRanking table td {
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking table td {
padding-left: 16px
}
}
#homeRanking table td.num {
font-weight: 400;
text-align: center
}
#homeRanking table td img {
width: auto;
height: 100%
}
#homeRanking table td .index {
line-height: 26px;
display: block;
width: 26px;
text-align: center;
color: #fff;
background-color: #000
}
#homeRanking .more {
margin-top: 16px;
padding-left: 32px
}
@media all and (max-width: 767px) {
#homeRanking .more {
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeRanking .more {
padding-left: 16px
}
}
#homeDT {
position: relative;
display: table;
float: left;
overflow: hidden;
width: 50%;
height: 65vh;
background-color: #fff
}
@media all and (max-width: 767px) {
#homeDT {
width: 100%;
height: 100vw
}
}
#homeDT .content {
position: relative;
z-index: 2;
display: table-cell;
width: 100%;
padding: 0 25%;
text-align: center;
vertical-align: middle
}
#homeDT .content h1 {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeDT .content h1 {
font-size: 2.7rem
}
}
#homeDT .content p {
margin-bottom: 16px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#homeDT .content .more,
#homeDT .content .more a {
color: #323232
}
#homeDT .background {
position: absolute;
z-index: 1;
top: 50%;
width: 100%;
height: 50vw;
margin-top: -25vw;
background-repeat: no-repeat;
background-position: center;
background-size: cover
}
@media all and (max-width: 767px) {
#homeDT .background {
top: 0;
left: 50%;
width: 65vh;
height: 100%;
margin-top: 0;
margin-left: -32.5vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeDT .background {
top: 0;
left: 50%;
width: 65vh;
height: 100%;
margin-top: 0;
margin-left: -32.5vh
}
}
#homeDTVideoContainer {
width: 100%;
height: 100%;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
opacity: 0
}
#homeDTVideoContainer.playing {
opacity: 1
}
#homeDTVideoContainer .video-js {
width: 100%;
height: 100%
}
#homeDTVideoContainer .video-js .vjs-tech {
width: 100%;
height: 100%
}
#homeFans {
position: relative;
overflow: hidden;
width: 100%;
height: 35vh;
background-color: #fff
}
@media all and (max-width: 767px) {
#homeFans {
overflow: scroll;
height: 53.33333vw;
-webkit-overflow-scrolling: touch
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans {
overflow: scroll;
height: 25.33333vw;
-webkit-overflow-scrolling: touch
}
}
#homeFans .fans-list {
position: absolute;
left: 0;
width: 152vw;
height: 100%;
transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1)
}
@media all and (max-width: 767px) {
#homeFans .fans-list {
position: relative;
width: 320vw;
transition: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list {
position: relative;
transition: none
}
}
#homeFans .fans-list.show-more {
-webkit-transform: translateX(-52vw);
-ms-transform: translateX(-52vw);
transform: translateX(-52vw)
}
@media all and (max-width: 767px) {
#homeFans .fans-list.show-more {
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list.show-more {
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
#homeFans .fans-list li {
position: relative;
float: left;
overflow: hidden;
width: 38vw;
height: 100%
}
@media all and (max-width: 767px) {
#homeFans .fans-list li {
width: 80vw
}
}
#homeFans .fans-list li a:hover .hover {
opacity: 1
}
#homeFans .fans-list li.enter {
display: table;
overflow: hidden;
padding-left: 48px;
color: #fff;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#homeFans .fans-list li.enter {
padding-left: 24px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list li.enter {
padding-left: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeFans .fans-list li.enter {
padding-left: 32px
}
}
#homeFans .fans-list li.enter .content {
display: table-cell;
vertical-align: middle
}
#homeFans .fans-list li.enter h1 {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeFans .fans-list li.enter h1 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list li.enter h1 {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeFans .fans-list li.enter h1 {
font-size: 2.7rem
}
}
#homeFans .fans-list li.enter p {
width: 70%;
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#homeFans .fans-list li.enter p {
width: 90%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list li.enter p {
width: 90%
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeFans .fans-list li.enter p {
width: 85%
}
}
#homeFans .fans-list li.enter .more,
#homeFans .fans-list li.enter .more a {
color: #fff
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeFans .fans-list li.enter .more,
#homeFans .fans-list li.enter .more a {
font-size: 1.2rem
}
}
#homeFans .fans-list li .picture {
position: absolute;
z-index: 1;
overflow: hidden;
width: 100%;
height: 100%;
background-position: center;
background-size: cover
}
#homeFans .fans-list li .shadow {
position: absolute;
z-index: 2;
bottom: 0;
left: 0;
width: 100%;
height: 25%;
background-image: url(../img/shadow.png);
background-size: auto 100%
}
#homeFans .fans-list li .title {
position: absolute;
z-index: 4;
bottom: 8px;
width: 100%;
padding: 16px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#homeFans .fans-list li .hover {
position: absolute;
z-index: 3;
top: -.5%;
left: -.5%;
width: 101%;
height: 101%;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
opacity: 0;
background-color: rgba(234, 33, 46, 0.9)
}
#homeFans .fans-list li .hover:before {
font-size: 4rem;
position: absolute;
top: 45%;
left: 50%;
padding: 20px 40px;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.7)
}
@media all and (max-width: 767px) {
#homeFans .fans-list li .hover:before {
font-size: 2rem;
padding: 10px 20px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeFans .fans-list li .hover:before {
font-size: 2rem;
padding: 10px 20px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeFans .fans-list li .hover:before {
font-size: 2rem;
padding: 10px 20px
}
}
#homeNews {
position: relative;
background-color: #fff;
padding-top: 80px;
max-height: none;
}
@media all and (max-width: 991px) {
#homeNews {
/*max-height: none;*/
padding-top: 0;
padding-bottom: 70px;
/*padding: 16px;*/
/*background-color: #f5f5f5*/
}
/* #homeNews .fp-tableCell {
position: relative
}*/
}
/*
#homeNews .half-container {
z-index: 2
}
@media all and (max-width: 767px) {
#homeNews .half-container {
float: none;
overflow: hidden;
width: 100%;
height: 309.6vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .half-container {
float: none;
width: 100%;
height: 309.6vh
}
}
@media all and (max-width: 767px) {
#homeNews .half-container.news-container {
position: absolute;
z-index: 2;
top: 40vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .half-container.news-container {
position: absolute;
z-index: 3;
top: 50vh
}
}
@media all and (max-width: 767px) {
#homeNews .half-container .half-list {
-webkit-transform: none !important;
-ms-transform: none !important;
transform: none !important
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .half-container .half-list {
-webkit-transform: none !important;
-ms-transform: none !important;
transform: none !important
}
}*/
/*#homeNews .news {
display: table;
overflow: hidden;
padding: 0 96px
}*/
/*@media all and (max-width: 767px) {
#homeNews .news {
display: block;
height: 60vh;
margin-top: 40vh;
padding: 24px 16px;
border-bottom: 16px solid #f5f5f5;
background-color: #fff
}
#homeNews .news:last-child {
border-bottom: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .news {
height: 50vh;
margin-top: 50vh;
padding: 0 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeNews .news {
padding: 0 48px
}
}
#homeNews .news:first-child {
margin-top: 0
}
#homeNews .news .content {
display: table-cell;
vertical-align: middle
}
#homeNews .news h3 {
line-height: 100%;
margin-bottom: 40px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeNews .news h3 {
margin-bottom: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homeNews .news h3 {
font-size: 2.7rem
}
}
#homeNews .news p {
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#homeNews .news-bar {
position: absolute;
top: 0;
left: 50%;
width: 4px;
height: 100vh;
margin-left: -4px;
-webkit-transform-origin: top;
-ms-transform-origin: top;
transform-origin: top;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#homeNews .news-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .news-bar {
display: none
}
}
#homeNews .pics-list {
position: absolute;
top: -200vh
}
#homeNews .pics-list li.more {
display: none;
}
@media all and (max-width: 767px) {
#homeNews .pics-list {
position: relative;
top: 0;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse
}
#homeNews .pics-list li.more {
display: block;
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .pics-list {
position: relative;
top: 0
}
}
#homeNews .pics-list li {
position: relative;
overflow: hidden
}
@media all and (max-width: 767px) {
#homeNews .pics-list li {
overflow: initial;
height: 40vh;
margin-bottom: 60vh;
-webkit-overflow-scrolling: touch
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .pics-list li {
overflow: initial;
height: 50vh;
margin-bottom: 50vh;
-webkit-overflow-scrolling: touch
}
}
#homeNews .pics-list img {
position: relative;
top: 50%;
left: 50%;
width: auto;
height: 100%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
#homeNews .pics-list .more-btn {
position: absolute;
z-index: 100;
top: 50%;
left: 32px;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 48px;
height: 48px;
margin-top: -24px;
cursor: pointer;
text-align: center;
background-color: #ea212e;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
@media all and (max-width: 767px) {
#homeNews .pics-list .more-btn {
top: 100%;
right: 0;
left: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .pics-list .more-btn {
top: 100%;
right: 32px;
left: auto
}
}
#homeNews .pics-list .more-btn:before {
font-size: 1.6rem;
content: '\65';
color: #fff;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
#homeNews .more {
height: 96px;
background-color: #323232
}
@media all and (max-width: 767px) {
#homeNews .more {
height: 9.6vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .more {
height: 9.6vh
}
}
#homeNews .more a {
color: #fff
}
#homeNews .more a:after {
content: ''
}
#homeNews .more h5 {
line-height: 96px;
text-align: center;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#homeNews .more h5 {
line-height: 9.6vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homeNews .more h5 {
line-height: 9.6vh
}
}*/
.news-page {
overflow: hidden;
width: 100%;
height: 100vh;
background-color: #fff
}
@media all and (max-width: 767px) {
.news-page {
overflow: auto;
/*height: auto;*/
-webkit-overflow-scrolling: touch
}
}
.news-page .news-container {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.news-page .news-container .news {
float: left;
width: 33.33333%;
background-color: #fff
}
@media all and (max-width: 767px) {
.news-page .news-container{
padding-top: 65px;
}
.news-page .news-container .news {
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.news-page .news-container .news {
width: 50%
}
}
.news-page .news-container .news.grayBG {
background-color: #f5f5f5
}
.news-page .news-container .news .upper {
position: relative
}
.news-page .news-container .news .lower {
position: relative;
height: 280px;
padding: 32px
}
@media all and (max-width: 767px) {
.news-page .news-container .news .lower {
height: auto;
padding: 16px 16px 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.news-page .news-container .news .lower {
height: 256px;
padding: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.news-page .news-container .news .lower {
height: 256px;
padding: 24px
}
}
.news-page .news-container .news .lower h4 {
line-height: 100%;
margin-bottom: 24px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.news-page .news-container .news .lower h4 {
font-size: 1.6rem
}
}
.news-page .news-container .news .lower p {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.news-page .news-container .news .lower p {
font-size: 1.2rem
}
}
.news-page .news-container .news .thumb {
width: 100%;
min-height: 22.22222vw
}
.news-page .news-container .news .news-date {
font-size: 1.3rem;
position: absolute;
bottom: 16px;
left: 32px;
margin-bottom: 0;
color: #fff
}
@media all and (max-width: 767px) {
.news-page .news-container .news .news-date {
bottom: 0;
left: 16px
}
}
.news-page .news-container .news .news-date .day {
font-size: 8rem;
line-height: 64px;
border-bottom: none
}
.news-page .list-nav {
width: 100%;
height: 96px;
text-align: center;
background-color: #323232
}
@media all and (max-width: 767px) {
.news-page .list-nav {
height: 64px
}
}
.news-page .list-nav li {
display: inline-block;
padding: 0 64px
}
@media all and (max-width: 767px) {
.news-page .list-nav li {
padding: 0 32px
}
}
.news-page .list-nav li.h5 {
line-height: 96px;
text-align: center;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.news-page .list-nav li.h5 {
line-height: 64px
}
}
.news-page .list-nav li.h5 a {
color: #fff
}
#homepageOverlay .pics-container,
#newsOverlay .pics-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#homepageOverlay .pics-container,
#newsOverlay .pics-container {
float: none;
overflow: auto;
width: 100%;
height: 56vw;
-webkit-overflow-scrolling: touch
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .pics-container,
#newsOverlay .pics-container {
float: none;
width: 100%;
height: 56vw
}
}
#homepageOverlay .pics-container .pics-list,
#newsOverlay .pics-container .pics-list {
width: 100%;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
@media all and (max-width: 767px) {
#homepageOverlay .pics-container .pics-list,
#newsOverlay .pics-container .pics-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100%;
overflow: auto;
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .pics-container .pics-list,
#newsOverlay .pics-container .pics-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100%;
overflow: auto;
}
}
#homepageOverlay .pics-container .pics-list li,
#newsOverlay .pics-container .pics-list li {
height: auto
}
@media all and (max-width: 767px) {
#homepageOverlay .pics-container .pics-list li,
#newsOverlay .pics-container .pics-list li {
float: left;
width: auto;
height: 100%
}
#homepageOverlay .pics-container .pics-list li img,
#newsOverlay .pics-container .pics-list li img {
width: auto;
height: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .pics-container .pics-list li,
#newsOverlay .pics-container .pics-list li {
float: left;
width: auto;
height: 100%
}
#homepageOverlay .pics-container .pics-list li img,
#newsOverlay .pics-container .pics-list li img {
width: auto;
height: 100%
}
}
#homepageOverlay .post-container,
#newsOverlay .post-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#homepageOverlay .post-container,
#newsOverlay .post-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .post-container,
#newsOverlay .post-container {
float: none;
width: 100%;
height: 58vh
}
}
#homepageOverlay .post-container .post,
#newsOverlay .post-container .post {
padding: 64px 96px 64px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#homepageOverlay .post-container .post,
#newsOverlay .post-container .post {
padding: 48px 16px 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .post-container .post,
#newsOverlay .post-container .post {
padding: 80px 48px 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homepageOverlay .post-container .post,
#newsOverlay .post-container .post {
padding: 80px 64px 64px
}
}
#homepageOverlay .post-container .post h3,
#newsOverlay .post-container .post h3 {
line-height: 100%;
margin-bottom: 32px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#homepageOverlay .post-container .post h3,
#newsOverlay .post-container .post h3 {
font-size: 2.7rem
}
}
#homepageOverlay .post-container .post .content,
#newsOverlay .post-container .post .content {
font-size: 1.4rem;
margin-bottom: 64px
}
#homepageOverlay .post-container .post .content p,
#newsOverlay .post-container .post .content p {
margin-bottom: 24px
}
#homepageOverlay .post-container .post .content p.table-head,
#newsOverlay .post-container .post .content p.table-head {
margin-bottom: 8px
}
#homepageOverlay .post-container .post .content table,
#newsOverlay .post-container .post .content table {
width: 100%;
margin-bottom: 24px;
border-spacing: 0;
border-collapse: collapse;
border: none
}
#homepageOverlay .post-container .post .content table td,
#newsOverlay .post-container .post .content table td {
padding: 2px;
border: 0.5px solid #d2d2d2
}
#homepageOverlay .post-container .post .content table p,
#newsOverlay .post-container .post .content table p {
font-size: 1.3rem;
margin-bottom: 0
}
#homepageOverlay .post-container .post .list-nav,
#newsOverlay .post-container .post .list-nav {
margin-bottom: 24px
}
#homepageOverlay .post-container .post .list-nav li,
#newsOverlay .post-container .post .list-nav li {
position: relative;
padding: 8px 0
}
#homepageOverlay .post-container .post .list-nav li:hover .line,
#newsOverlay .post-container .post .list-nav li:hover .line {
width: 100%
}
#homepageOverlay .post-container .post .list-nav .line,
#newsOverlay .post-container .post .list-nav .line {
position: absolute;
top: 0;
width: 16px;
height: 2px;
transition: width 0.5s cubic-bezier(0.77, 0, 0.175, 1);
background-color: #ea212e
}
#homepageOverlay .post-container .post .list-nav .prev-btn,
#newsOverlay .post-container .post .list-nav .prev-btn {
float: right;
text-align: right
}
#homepageOverlay .post-container .post .list-nav .prev-btn .line,
#newsOverlay .post-container .post .list-nav .prev-btn .line {
right: 0
}
#homepageOverlay .post-container .post .list-nav .next-btn,
#newsOverlay .post-container .post .list-nav .next-btn {
float: left
}
#homepageOverlay .post-container .post .list-nav .next-btn .line,
#newsOverlay .post-container .post .list-nav .next-btn .line {
left: 0
}
#homepageOverlay .post-container .post .list-nav .hide,
#newsOverlay .post-container .post .list-nav .hide {
display: none
}
#homepageOverlay .post-container .post .download-btn,
#newsOverlay .post-container .post .download-btn {
line-height: 24px;
float: left
}
@media all and (max-width: 767px) {
#homepageOverlay .post-container .post .download-btn,
#newsOverlay .post-container .post .download-btn {
display: none
}
}
#homepageOverlay .post-container .post .download-btn:before,
#newsOverlay .post-container .post .download-btn:before {
font-size: 1.8rem;
top: 5px;
margin-right: 8px;
color: #d2d2d2
}
#homepageOverlay .post-container .post .download-btn.hide,
#newsOverlay .post-container .post .download-btn.hide {
display: none
}
#homepageOverlay .post-container .post .download-btn a,
#newsOverlay .post-container .post .download-btn a {
color: #323232
}
#homepageOverlay .post-container .post .share-list,
#newsOverlay .post-container .post .share-list {
float: right
}
#homepageOverlay .post-container .post .share-list li,
#newsOverlay .post-container .post .share-list li {
float: left;
width: 24px;
height: 24px;
margin-left: 16px
}
#homepageOverlay .post-container .post .share-list li.title,
#newsOverlay .post-container .post .share-list li.title {
line-height: 24px;
width: auto
}
#homepageOverlay .post-container .post .share-list li:before,
#newsOverlay .post-container .post .share-list li:before {
top: -2px
}
@media all and (max-width: 767px) {
#homepageOverlay .post-container .post .share-list li:before,
#newsOverlay .post-container .post .share-list li:before {
font-size: 2.4rem
}
}
#homepageOverlay .post-container .scroll-bar,
#newsOverlay .post-container .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
left: 0;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#homepageOverlay .post-container .scroll-bar,
#newsOverlay .post-container .scroll-bar {
width: 100vw;
height: 4px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#homepageOverlay .post-container .scroll-bar,
#newsOverlay .post-container .scroll-bar {
width: 100vw;
height: 4px
}
}
.fans-page {
overflow: hidden;
width: 100%;
height: 100vh;
background-color: #fff
}
@media all and (max-width: 767px) {
.fans-page {
overflow: auto;
height: auto;
-webkit-overflow-scrolling: touch
}
}
.fans-page .fans-container {
width: 100%
}
.fans-page .fans-container .fans {
position: relative;
float: left;
overflow: hidden;
width: 33.33333%;
border: 0.5px solid #000;
background-color: #fff
}
@media all and (max-width: 767px) {
.fans-page .fans-container .fans {
width: 100%;
border: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.fans-page .fans-container .fans {
width: 50%
}
.fans-page .fans-container .fans:nth-child(3n-2) {
width: 100%
}
.fans-page .fans-container .fans:nth-child(3n-2) .thumb {
min-height: 33vw
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.fans-page .fans-container .fans:nth-child(5n-4),
.fans-page .fans-container .fans:nth-child(5n-3) {
width: 50%
}
.fans-page .fans-container .fans:nth-child(5n-4) .thumb,
.fans-page .fans-container .fans:nth-child(5n-3) .thumb {
min-height: 33vw
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
.fans-page .fans-container .fans:nth-child(5n-4),
.fans-page .fans-container .fans:nth-child(5n-3) {
width: 50%
}
.fans-page .fans-container .fans:nth-child(5n-4) .thumb,
.fans-page .fans-container .fans:nth-child(5n-3) .thumb {
min-height: 33vw
}
}
@media all and (min-width: 1600px) {
.fans-page .fans-container .fans:nth-child(5n-4),
.fans-page .fans-container .fans:nth-child(5n-3) {
width: 50%
}
.fans-page .fans-container .fans:nth-child(5n-4) .thumb,
.fans-page .fans-container .fans:nth-child(5n-3) .thumb {
min-height: 33vw
}
}
.fans-page .fans-container .fans.picture .title p:after {
content: '\72'
}
.fans-page .fans-container .fans.video .title p:after {
content: '\73'
}
.fans-page .fans-container .fans.live .title p:after {
content: '\42'
}
.fans-page .fans-container .fans.wallpaper .title p:after {
content: '\74'
}
.fans-page .fans-container .fans .title {
position: absolute;
bottom: 16px;
display: table;
width: 100%;
padding: 16px 32px;
color: #fff
}
@media all and (max-width: 767px) {
.fans-page .fans-container .fans .title {
bottom: 8px;
padding: 8px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.fans-page .fans-container .fans .title {
bottom: 8px;
padding: 16px 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.fans-page .fans-container .fans .title {
bottom: 8px;
padding: 8px 24px
}
}
.fans-page .fans-container .fans .title h4 {
position: relative;
display: table-cell;
vertical-align: bottom;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.fans-page .fans-container .fans .title h4 {
font-size: 1.6rem
}
}
.fans-page .fans-container .fans .title p {
font-weight: 700;
position: relative;
display: table-cell;
width: 56px;
text-align: right;
vertical-align: bottom;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.fans-page .fans-container .fans .title p:after {
top: 5px;
color: #fff;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.fans-page .fans-container .fans .title .bg1 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
opacity: 0;
background-image: url(../img/fans_title_bg_1.png);
background-size: 100% 100%
}
.fans-page .fans-container .fans .title .bg2 {
position: absolute;
bottom: -16px;
left: 0;
width: 100%;
height: 16px;
transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
opacity: 0;
background-image: url(../img/fans_title_bg_2.png);
background-size: 100% 100%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.fans-page .fans-container .fans .title .bg2 {
bottom: -8px;
height: 8px
}
}
.fans-page .fans-container .fans .thumb {
position: relative;
width: 100%;
min-height: 22vw
}
.fans-page .fans-container .fans .shadow {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 25%;
background-image: url(../img/shadow.png);
background-size: auto 100%
}
.fans-page .fans-container .fans.hover .bg1,
.fans-page .fans-container .fans.hover .bg2 {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
opacity: 1
}
.fans-page .list-nav {
width: 100%;
height: 96px;
text-align: center;
background-color: #323232
}
@media all and (max-width: 767px) {
.fans-page .list-nav {
height: 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.fans-page .list-nav {
height: 64px
}
}
.fans-page .list-nav li {
display: inline-block;
padding: 0 64px
}
@media all and (max-width: 767px) {
.fans-page .list-nav li {
padding: 0 32px
}
}
.fans-page .list-nav li.h5 {
line-height: 96px;
text-align: center;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.fans-page .list-nav li.h5 {
line-height: 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.fans-page .list-nav li.h5 {
line-height: 64px
}
}
.fans-page .list-nav li.h5 a {
color: #fff
}
#fansOverlay .gallery {
position: relative;
overflow: hidden;
width: 100vw;
height: 100vh;
background-color: #000
}
#fansOverlay .gallery .sliders li {
float: left;
width: 100vw;
height: 100vh
}
#fansOverlay .gallery .sliders li img {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
#fansOverlay .gallery .pic-num {
font-size: 1.8rem;
position: absolute;
top: 32px;
left: 32px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#fansOverlay .gallery .pic-num {
font-size: 1.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .gallery .pic-num {
font-size: 1.4rem
}
}
#fansOverlay .gallery .pic-num .current {
font-size: 12rem;
line-height: 90px
}
@media all and (max-width: 767px) {
#fansOverlay .gallery .pic-num .current {
font-size: 10rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .gallery .pic-num .current {
font-size: 10rem
}
}
#fansOverlay .gallery .pic-num .total {
padding-left: 4px
}
#fansOverlay .gallery .timer-bar {
position: absolute;
z-index: 6;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
-webkit-transform: scale(0, 1);
-ms-transform: scale(0, 1);
transform: scale(0, 1);
background-color: #ea212e
}
#fansOverlay .gallery .timer-bar.left {
-webkit-transform-origin: left;
-ms-transform-origin: left;
transform-origin: left
}
#fansOverlay .gallery .timer-bar.right {
-webkit-transform-origin: right;
-ms-transform-origin: right;
transform-origin: right
}
#fansOverlay .wallpaper {
position: relative;
overflow: hidden;
width: 100vw;
height: 100vh
}
#fansOverlay .wallpaper .media {
overflow: hidden;
width: 100%;
height: 100%
}
#fansOverlay .wallpaper .media img,
#fansOverlay .wallpaper .media svg,
#fansOverlay .wallpaper .media video {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media (min-aspect-ratio: 1600 / 1067) {
#fansOverlay .wallpaper .media img,
#fansOverlay .wallpaper .media svg,
#fansOverlay .wallpaper .media video {
width: 101%
}
}
@media (max-aspect-ratio: 1600 / 1067) {
#fansOverlay .wallpaper .media img,
#fansOverlay .wallpaper .media svg,
#fansOverlay .wallpaper .media video {
width: auto;
height: 101%
}
}
#fansOverlay .wallpaper .download-btn {
line-height: 24px;
float: left;
margin-right: 32px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#fansOverlay .wallpaper .download-btn a {
color: #fff
}
#fansOverlay .wallpaper .download-btn:before {
font-size: 1.8rem;
top: 5px;
margin-right: 8px;
color: #d2d2d2
}
#fansOverlay .shadow {
position: absolute;
z-index: 98;
bottom: 0;
left: 0;
width: 100%;
height: 25%;
pointer-events: none;
background-image: url(../img/shadow.png);
background-size: auto 100%
}
#fansOverlay .post-footer {
position: absolute;
z-index: 101;
bottom: 0;
display: table;
width: 100%;
padding: 32px;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
color: #fff
}
@media all and (max-width: 767px) {
#fansOverlay .post-footer {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 16px;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end
}
}
#fansOverlay .post-footer h3 {
display: table-cell;
padding-right: 48px;
vertical-align: bottom;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#fansOverlay .post-footer h3 {
width: 100%;
margin-bottom: 24px;
padding-right: 0
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#fansOverlay .post-footer h3 {
font-size: 2.7rem
}
}
#fansOverlay .post-footer .share-list {
display: table-cell;
width: 208px;
vertical-align: bottom
}
#fansOverlay .post-footer .share-list li {
float: left;
width: 24px;
height: 24px;
margin-left: 16px
}
#fansOverlay .post-footer .share-list li.title {
line-height: 24px;
width: 72px;
background-color: transparent
}
#fansOverlay .post-footer .share-list li:before {
font-size: 2.4rem;
top: -2px
}
#fansOverlay .insider .pics-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#fansOverlay .insider .pics-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .insider .pics-container {
float: none;
width: 100%;
height: 42vh
}
}
#fansOverlay .insider .pics-container .media {
overflow: hidden;
width: 100%;
height: 100%
}
#fansOverlay .insider .pics-container .media img,
#fansOverlay .insider .pics-container .media svg,
#fansOverlay .insider .pics-container .media video {
position: relative;
top: 50%;
left: 50%;
width: auto;
height: 100%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media all and (max-width: 767px) {
#fansOverlay .insider .pics-container .media img,
#fansOverlay .insider .pics-container .media svg,
#fansOverlay .insider .pics-container .media video {
top: 0;
left: 0;
width: 100%;
height: auto;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
#fansOverlay .insider .post-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#fansOverlay .insider .post-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .insider .post-container {
float: none;
width: 100%;
height: 58vh
}
}
#fansOverlay .insider .post-container .post {
padding: 64px 96px 64px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#fansOverlay .insider .post-container .post {
padding: 48px 16px 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .insider .post-container .post {
padding: 80px 48px 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#fansOverlay .insider .post-container .post {
padding: 80px 64px 64px
}
}
#fansOverlay .insider .post-container .post h3 {
line-height: 100%;
margin-bottom: 32px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#fansOverlay .insider .post-container .post h3 {
font-size: 2.7rem
}
}
#fansOverlay .insider .post-container .post .content {
font-size: 1.4rem;
margin-bottom: 64px
}
#fansOverlay .insider .post-container .post .content p {
margin-bottom: 24px
}
#fansOverlay .insider .post-container .post .post-footer {
position: relative;
display: block;
width: 100%;
padding: 32px;
padding-top: 0;
padding-right: 0;
padding-left: 0;
color: #000
}
#fansOverlay .insider .post-container .post .share-list {
display: block;
float: right;
width: auto
}
#fansOverlay .insider .post-container .post .share-list .title {
width: auto
}
#fansOverlay .insider .post-container .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
left: 0;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#fansOverlay .insider .post-container .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#fansOverlay .insider .post-container .scroll-bar {
width: 100vw;
height: 4px
}
}
#fansOverlay .film {
width: 100vw;
height: 100vh
}
#fansOverlay .film iframe {
display: block;
margin: 0 auto
}
#fansOverlay .film .video-js {
height: 100%
}
#fansOverlay .film .video-js .vjs-big-play-button {
display: block !important
}
#fansOverlay .film .video-js .vjs-control-bar {
opacity: 0
}
#fansOverlay .film.playing .post-footer {
pointer-events: none;
opacity: 0
}
#fansOverlay .film.playing .vjs-big-play-button {
display: none !important
}
#fansOverlay .film.playing .vjs-control-bar {
opacity: 1
}
.race-page .section {
position: relative;
background-color: #fff
}
@media all and (max-width: 767px) {
.race-page .section {
max-height: initial
}
.race-page .section.page-section .fp-tableCell {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse
}
.race-page .section:nth-child(2n-1) {
display: none
}
.race-page .section.page-footer {
display: block
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .section.page-section .fp-tableCell {
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
}
@media all and (max-width: 767px) {
.race-page .half-container>.media {
height: 64.0625vw
}
}
.race-page .media {
overflow: hidden;
width: 100%;
height: 100%
}
.race-page .media img,
.race-page .media svg,
.race-page .media video {
position: relative;
display: flex;
width: 100%;
height: auto;
}
.race-page .slider-info {
position: absolute;
bottom: 48px;
left: 48px;
width: 60%
}
@media all and (max-width: 767px) {
.race-page .slider-info {
bottom: 16px;
left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .slider-info {
bottom: 32px;
left: 32px
}
}
.race-page .slider-info h1 {
margin-bottom: 16px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.race-page .slider-info h1 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .slider-info h1 {
font-size: 3.6rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .slider-info h1 {
font-size: 3.6rem
}
}
@media all and (min-width: 1200px) and (max-width: 1599px) {
.race-page .slider-info h1 {
font-size: 5.6rem
}
}
@media all and (min-width: 1600px) {
.race-page .slider-info h1 {
font-size: 6.4rem
}
}
.race-page .slider-info .more a {
color: #fff
}
.race-page .slide {
position: relative;
overflow: hidden
}
@media all and (max-width: 767px) {
.race-page .slide .half-container {
width: 100vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .slide .half-container {
width: 100vw
}
}
.race-page .post-container {
overflow: hidden;
height: 100%;
padding: 128px 96px
}
@media all and (max-width: 767px) {
.race-page .post-container {
padding: 48px 16px 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .post-container {
padding: 80px 48px 0
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post-container {
padding: 96px 64px
}
}
.race-page .post {
height: 100%
}
.race-page .post h2 {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.race-page .post h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .post h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post h2 {
font-size: 2.7rem
}
}
.race-page .post h2.driver-name {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.race-page .post p {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.race-page .post h4 {
margin-bottom: 8px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.race-page .post h4 {
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .post h4 {
float: left;
width: 50%
}
}
.race-page .post h6 {
margin-top: -16px;
margin-bottom: 32px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post h6 {
font-size: 1.4rem
}
}
.race-page .post ul {
margin-bottom: 24px;
list-style: none;
color: #323232
}
@media all and (max-width: 767px) {
.race-page .post ul {
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .post ul {
float: left;
width: 50%
}
}
.race-page .post ul li {
margin-bottom: 8px
}
.race-page .post ul li::after {
display: table;
clear: both;
content: ''
}
.race-page .post ul p {
margin-bottom: 0
}
@media all and (max-width: 767px) {
.race-page .post ul.form {
float: none;
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .post ul.form {
float: none;
width: 100%
}
}
.race-page .post ul.form li {
margin-bottom: 32px;
padding: 16px 0;
border-bottom: 1px solid #fff
}
.race-page .post ul.form li input[type=text],
.race-page .post ul.form li input[type=email] {
line-height: 2rem;
border: none;
border-radius: 0;
outline: none;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post ul.form li input[type=text],
.race-page .post ul.form li input[type=email] {
font-size: 1.2rem
}
}
.race-page .post ul.form li p {
font-weight: 700;
line-height: 2rem;
margin-right: 4px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post ul.form li p {
font-size: 1.2rem
}
}
.race-page .post ul.form li label {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post ul.form li label {
font-size: 1.2rem
}
}
.race-page .post ul.form li label input[type='radio'] {
display: none
}
.race-page .post ul.form li label .pcca-icon {
margin-right: 4px
}
.race-page .post ul.form li label .pcca-icon:before {
content: '\68'
}
.race-page .post ul.form li label input:checked+.pcca-icon:before {
content: '\64'
}
.race-page .post ul.form li label.p1 {
margin-right: 8px
}
.race-page .post ul.form li textarea {
width: 100%;
height: 10rem;
border: none;
border-bottom: 1px solid #000;
border-radius: 0;
outline: none
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .post ul.form li textarea {
font-size: 1.2rem
}
}
.race-page .post ul.form li.half {
float: left;
width: 48%
}
@media all and (max-width: 767px) {
.race-page .post ul.form li.half {
float: none;
width: 100%
}
}
.race-page .post ul.form li.half p {
display: inline-block
}
.race-page .post ul.form li.half:nth-child(2n-1) {
margin-right: 2%
}
@media all and (max-width: 767px) {
.race-page .post ul.form li.half:nth-child(2n-1) {
margin-right: 0
}
}
.race-page .post ul.form li.half:nth-child(2n) {
margin-left: 2%
}
@media all and (max-width: 767px) {
.race-page .post ul.form li.half:nth-child(2n) {
margin-left: 0
}
}
.race-page .post ul.form li.border {
border-color: #000
}
.race-page .post ul.form li.clear {
clear: both;
margin-bottom: 0
}
.race-page .post ul.form li.nat input {
width: 50%
}
.race-page .post ul.form .upload-btn {
position: relative;
width: 100%;
margin: 0;
padding: 0;
border: 1px solid #9b9b9b;
outline: none;
background: transparent
}
.race-page .post ul.form .upload-btn span {
line-height: 48px;
display: block;
height: 48px;
text-align: center;
color: #9b9b9b
}
.race-page .post ul.form .upload-btn span:before {
font-size: 2.4rem;
position: relative;
top: 6px;
margin-right: 8px
}
.race-page .post ul.form .upload-btn input {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0
}
.race-page .post ul.form .submit-btn {
font-weight: 700;
line-height: 48px;
width: 160px;
margin-top: 16px;
text-align: center;
color: #fff;
border: none;
outline: none;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.race-page .post ul.form .submit-btn {
width: 100%
}
}
.race-page .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
visibility: hidden;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
.race-page .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .scroll-bar {
width: 100%;
height: 4px
}
}
.race-page .scroll-bar.right {
right: 0
}
.race-page .scroll-bar.left {
left: 0
}
.race-page .with-scroll .scroll-bar {
visibility: visible
}
.race-page .pic .upper {
float: left;
overflow: hidden;
width: 100%;
height: 75vh;
background-position: center;
background-size: cover
}
@media all and (max-width: 767px) {
.race-page .pic .upper {
width: 50%;
height: 50vh
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .pic .upper {
width: 50%;
height: 50vh
}
}
.race-page .pic .half-lower {
float: left;
width: 50%;
height: 25vh;
background-position: center;
background-size: cover
}
.race-page .table p {
float: left
}
.race-page .page-banner {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh
}
@media all and (max-width: 767px) {
.race-page .page-banner {
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .page-banner {
height: auto
}
}
.race-page .page-title {
position: absolute;
bottom: 128px;
left: 96px
}
@media all and (max-width: 767px) {
.race-page .page-title {
bottom: 48px;
left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .page-title {
bottom: 80px;
left: 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .page-title {
bottom: 96px;
left: 64px
}
}
.race-page .page-title h2 {
margin-bottom: 0;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.race-page .page-title h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.race-page .page-title h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .page-title h2 {
font-size: 2.7rem
}
}
.race-page .cv-list .thead {
width: 20%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .cv-list .thead {
width: 26%
}
}
.race-page .cv-list .tbody {
font-weight: 700;
width: 80%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .cv-list .tbody {
width: 74%
}
}
.race-page .history-list .thead {
width: 20%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .history-list .thead {
width: 26%
}
}
.race-page .history-list .tbody {
width: 80%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .history-list .tbody {
width: 74%
}
}
.about-page .section {
position: relative;
background-color: #fff
}
@media all and (max-width: 767px) {
.about-page .section .fp-tableCell {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column
}
.about-page .section.page-section .fp-tableCell {
/*-webkit-flex-direction: column-reverse;*/
/*-ms-flex-direction: column-reverse;*/
/*flex-direction: column-reverse*/
}
.about-page .section.page-footer .fp-tableCell {
display: block
}
.about-page .section:first-child {
/*display: none*/
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .section:first-child {
/*display: none*/
}
}
@media all and (max-width: 767px) {
.about-page .contact-section .upper {
position: relative;
top: auto;
height: auto
}
.about-page .contact-section .lower {
position: relative;
top: auto;
height: auto
}
.about-page .contact-section .lower .post-container {
padding-top: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .contact-section .upper {
position: relative;
top: auto;
height: auto
}
.about-page .contact-section .lower {
position: relative;
top: auto;
height: auto
}
.about-page .contact-section .lower .post-container {
padding-top: 0
}
}
.about-page .contact-section .post {
padding-top: 10vh
}
.about-page .partners-section .post {
display: table;
overflow: hidden
}
.about-page .partners-section .post .content {
display: table-cell;
vertical-align: middle
}
@media all and (max-width: 767px) {
.about-page .half-container>.media {
height: 64.0625vw
}
}
.about-page .media {
overflow: hidden;
width: 100%;
height: 100%
}
.about-page .media img,
.about-page .media svg,
.about-page .media video {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media (min-aspect-ratio: 1600 / 1024) {
.about-page .media img,
.about-page .media svg,
.about-page .media video {
width: 101%
}
}
@media (max-aspect-ratio: 1600 / 1024) {
.about-page .media img,
.about-page .media svg,
.about-page .media video {
width: auto;
height: 101%
}
}
.about-page .post-container {
overflow: hidden;
height: 100%;
padding: 128px 96px
}
@media all and (max-width: 767px) {
.about-page .post-container {
padding: 48px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .post-container {
padding: 80px 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .post-container {
padding: 96px 64px
}
}
.about-page .post-container h2 {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.about-page .post-container h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .post-container h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .post-container h2 {
font-size: 2.7rem
}
}
.about-page .post-container h2.history-name {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.about-page .post-container p {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .post-container h4 {
margin-bottom: 8px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.about-page .post-container h6 {
margin-top: -16px;
margin-bottom: 32px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.about-page .post-container h6 {
font-size: 1.2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .post-container h6 {
font-size: 1.2rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .post-container h6 {
font-size: 1.2rem
}
}
.about-page .post-container ul {
margin-bottom: 24px;
list-style: none;
color: #323232
}
.about-page .post-container ul li {
margin-bottom: 8px
}
.about-page .post-container ul p {
margin-bottom: 0
}
.about-page .post {
height: 100%
}
.about-page .post.post2 h2 {
font-size: 2.4rem
}
.about-page .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
visibility: hidden;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
.about-page .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .scroll-bar {
width: 100%;
height: 4px
}
}
.about-page .scroll-bar.right {
right: 0
}
.about-page .scroll-bar.left {
left: 0
}
.about-page .with-scroll .scroll-bar {
visibility: visible
}
.about-page .pic .upper {
float: left;
overflow: hidden;
width: 100%;
height: 75vh;
background-position: center;
background-size: cover
}
.about-page .pic .half-lower {
float: left;
width: 50%;
height: 25vh;
background-position: center;
background-size: cover
}
.about-page .page-banner {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh
}
@media all and (max-width: 767px) {
.about-page .page-banner {
height: auto
}
.about-page .page-banner img {
width: 100%;
height: auto;
position: static;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
.about-page .page-title {
position: absolute;
bottom: 128px;
left: 96px
}
@media all and (max-width: 767px) {
.about-page .page-title {
display: none
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .page-title {
bottom: 96px;
left: 64px
}
}
.about-page .page-title h2 {
margin-bottom: 0;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .page-title h2 {
font-size: 2.7rem
}
}
.about-page .background-gray {
background-color: #f5f5f5
}
.about-page .partners-list {
margin-top: 72px
}
.about-page .partners-list li {
float: left;
margin-bottom: 40px
}
.about-page .partners-list li.logo-1 {
width: 41.20521%;
margin-right: 13.84365%
}
.about-page .partners-list li.logo-2 {
width: 44.95114%
}
.about-page .partners-list li.logo-3 {
width: 17.10098%
}
.about-page .partners-list li.logo-4 {
width: 34.36482%;
margin-right: 7.98046%;
margin-left: 7.98046%
}
.about-page .partners-list li.logo-5 {
width: 32.57329%
}
.about-page .year-list {
margin-right: -16px;
margin-left: -16px
}
.about-page .year-list li {
float: left;
padding: 8px 16px;
cursor: pointer;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .year-list li.current {
color: #ea212e
}
.about-page .year-list li.current a {
color: #ea212e
}
.about-page .year-list li a {
color: #000
}
.about-page .table-container {
margin-bottom: 32px
}
.about-page .table-container .tabs {
margin-bottom: 0
}
.about-page .table-container .tabs li {
float: left;
width: 120px;
margin-bottom: 0;
padding: 16px 0;
cursor: pointer;
text-align: center;
color: #9b9b9b
}
.about-page .table-container .tabs li.current {
color: #ea212e;
background-color: #fff
}
.about-page .table-container .tabs li h5 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.about-page .table-container table {
font-weight: 700;
display: none;
width: 100%;
margin-bottom: 16px;
background-color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .table-container table.current {
display: table
}
.about-page .table-container table .col-1 {
width: 90px
}
.about-page .table-container table .col-2 {
width: auto
}
.about-page .table-container table .col-3 {
padding-left: 0;
text-align: center
}
.about-page .table-container table .col-4 {
width: 60px
}
.about-page .table-container table th {
height: 46px;
padding: 8px 0 8px 32px;
text-align: left
}
.about-page .table-container table th:last-child {
padding: 8px 32px 8px 0
}
.about-page .table-container table tbody tr:nth-child(2n-1) {
background-color: #f5f5f5
}
.about-page .table-container table tbody tr:nth-child(-n+3) .index {
background-color: #ea212e
}
.about-page .table-container table tbody tr td:last-child {
padding: 8px 32px 8px 0
}
.about-page .table-container table td {
height: 46px;
padding: 8px 0 8px 32px
}
.about-page .table-container table td.num {
font-weight: 400;
text-align: center
}
.about-page .table-container table td img {
display: inline;
width: auto;
height: 18px
}
.about-page .table-container table td .index {
line-height: 26px;
display: block;
width: 26px;
text-align: center;
color: #fff;
background-color: #000
}
.about-page .form li {
position: relative;
margin-bottom: 32px;
padding: 16px 0;
border-bottom: 1px solid #fff
}
.about-page .form li input[type=text],
.about-page .form li input[type=email] {
line-height: 2rem;
width: 56%;
border: none;
border-radius: 0;
outline: none;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .form li input[type=text],
.about-page .form li input[type=email] {
font-size: 1.2rem
}
}
.about-page .form li p {
font-weight: 700;
line-height: 2rem;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .form li label {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .form li label input[type='radio'] {
display: none
}
.about-page .form li label .pcca-icon {
margin-right: 4px
}
.about-page .form li label .pcca-icon:before {
content: '\68'
}
.about-page .form li label input:checked+.pcca-icon:before {
content: '\64'
}
.about-page .form li label.p1 {
margin-right: 32px
}
@media all and (max-width: 767px) {
.about-page .form li label.p1 {
margin-right: 0
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .form li label.p1 {
margin-right: 0
}
}
.about-page .form li textarea {
width: 100%;
height: 10rem;
border: none;
border-bottom: 1px solid #000;
border-radius: 0;
outline: none
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .form li textarea {
font-size: 1.2rem
}
}
.about-page .form li.half {
float: left;
width: 48%
}
.about-page .form li.half p {
display: inline-block;
margin-right: 8px
}
.about-page .form li.half:nth-child(2n-1) {
margin-left: 2%
}
.about-page .form li.half:nth-child(2n) {
margin-right: 2%
}
.about-page .form li.border {
border-color: #000
}
.about-page .form li.clear {
clear: both;
margin-bottom: 16px
}
.about-page .form li.send p {
display: inline-block;
margin-right: 32px
}
.about-page .form .submit-btn {
font-weight: 700;
line-height: 48px;
width: 160px;
margin-top: 16px;
cursor: pointer;
text-align: center;
color: #fff;
border: none;
outline: none;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.about-page .form .submit-btn:hover {
background-color: #ea212e
}
.about-page .form .tag {
line-height: 48px;
position: absolute;
top: 32px;
left: 184px;
padding: 0 8px;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
text-align: left;
opacity: 0
}
.about-page .form .tag span {
display: none
}
.about-page .form .tag span.wrong {
color: #ea212e
}
.about-page .form .tag.wrong {
opacity: 1
}
.about-page .form .tag.wrong .wrong {
display: inline
}
.about-page .form .tag.success {
opacity: 1
}
.about-page .form .tag.success .success {
display: inline
}
#aboutOverlay .overlay h1 {
padding-top: 96px;
text-align: center;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay h1 {
font-size: 2.4rem;
padding-top: 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#aboutOverlay .overlay h1 {
font-size: 2.4rem;
padding-top: 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#aboutOverlay .overlay h1 {
font-size: 2.7rem;
padding-top: 64px
}
}
#aboutOverlay .overlay .tabs {
margin: 48px auto 32px;
text-align: center
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .tabs {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
padding: 0 16px;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between
}
}
#aboutOverlay .overlay .tabs li {
display: inline-block;
width: 160px;
margin: 0 16px;
text-align: center;
color: #9b9b9b;
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .tabs li {
width: auto;
margin: 0 8px;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto
}
}
#aboutOverlay .overlay .tabs li.current {
color: #fff;
background-color: #ea212e
}
#aboutOverlay .overlay .tabs li h5 {
line-height: 48px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#aboutOverlay .overlay .table-container {
max-width: 1624px;
margin: 0 auto;
padding-right: 112px;
padding-left: 112px
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .table-container {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: scroll;
padding-right: 0;
padding-left: 0;
-webkit-overflow-scrolling: touch;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#aboutOverlay .overlay .table-container {
padding-right: 48px;
padding-left: 48px
}
}
#aboutOverlay .overlay .table-container .col-container {
float: left
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .table-container .col-container {
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0
}
}
#aboutOverlay .overlay .table-container .col-container.fix {
overflow: hidden
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .table-container .col-container.fix {
padding-left: 16px
}
}
#aboutOverlay .overlay .table-container .col-container.not-fix {
overflow: hidden
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .table-container .col-container.not-fix {
padding-right: 16px
}
}
#aboutOverlay .overlay .table-container .tr::after {
display: table;
clear: both;
content: ''
}
#aboutOverlay .overlay .table-container .td {
display: table;
float: left;
height: 48px;
padding: 8px 4px;
text-align: center;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
#aboutOverlay .overlay .table-container .td {
height: 36px;
padding: 4px
}
}
#aboutOverlay .overlay .table-container .td span {
display: table-cell;
vertical-align: middle
}
#aboutOverlay .overlay .table-container .td.col-1 {
width: 72px
}
#aboutOverlay .overlay .table-container .td.col-2 {
width: 144px
}
#aboutOverlay .overlay .table-container .td.col-3 {
width: 216px
}
#aboutOverlay .overlay .table-container .td.col-4 {
width: 288px
}
#aboutOverlay .overlay .table-container .td.col-5 {
width: 360px
}
#aboutOverlay .overlay .table-container .td.col-6 {
width: 432px
}
#aboutOverlay .overlay .table-container .td.br {
line-height: 16px
}
#aboutOverlay .overlay .table-container .td.col-driver {
font-weight: 700;
width: 208px;
padding-right: 24px;
padding-left: 24px;
text-align: left
}
#aboutOverlay .overlay .table-container .td.col-total {
font-weight: 700
}
#aboutOverlay .overlay .table-container .body-container {
overflow: hidden
}
#aboutOverlay .overlay .table-container .tHead .td {
font-weight: 700;
border-top: 1px solid #e1e1e1;
border-right: 1px solid #f5f5f5;
background-color: #e1e1e1
}
#aboutOverlay .overlay .table-container .tBody {
padding-bottom: 24px
}
#aboutOverlay .overlay .table-container .tBody .td {
border-right: 1px solid #e1e1e1;
background-color: #fff
}
#aboutOverlay .overlay .table-container .tBody .trc:nth-child(2n) .td {
background-color: #f5f5f5
}
#aboutOverlay .overlay .table-container .tBody .trc:last-child .td {
border-bottom: 1px solid #e1e1e1
}
#aboutOverlay .overlay .table-container .tBody .trc:nth-child(-n+3) .col-index span {
background-color: #ea212e
}
#aboutOverlay .overlay .table-container .tBody .trc:nth-child(-n+3) .col-total span {
color: #ea212e
}
#aboutOverlay .overlay .table-container .tBody .col-index span {
font-weight: 700;
line-height: 26px;
display: block;
width: 26px;
margin: 0 auto;
text-align: center;
color: #fff;
background-color: #000
}
#aboutOverlay .overlay .table-container .fix .tr .td:first-child {
border-left: 1px solid #e1e1e1
}
#aboutOverlay .overlay .table-container .not-fix .tHead .tr .td:last-child {
border-right: 1px solid #e1e1e1
}
#aboutOverlay .overlay .more {
max-width: 1624px;
margin: 0 auto;
margin-top: 8px;
padding-right: 112px;
padding-left: 112px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#aboutOverlay .overlay .more a {
color: #000
}
#aboutOverlay .overlay .more:after {
top: 2px;
margin-left: 8px;
content: '\65';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.season-page .section {
position: relative;
background-color: #fff
}
@media all and (max-width: 767px) {
.season-page .section:first-child {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .section:first-child {
display: none
}
}
.season-page .page-banner {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh
}
.season-page .page-title {
position: absolute;
bottom: 128px;
left: 96px
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .page-title {
bottom: 96px;
left: 64px
}
}
.season-page .page-title h2 {
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .page-title h2 {
font-size: 2.7rem
}
}
@media all and (max-width: 767px) {
.season-page .half-container>.media {
height: 64.0625vw
}
}
.season-page .media {
overflow: hidden;
width: 100%;
height: 100%
}
.season-page .media img,
.season-page .media svg,
.season-page .media video {
position: relative;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media (min-aspect-ratio: 1600 / 1024) {
.season-page .media img,
.season-page .media svg,
.season-page .media video {
width: 101%
}
}
@media (max-aspect-ratio: 1600 / 1024) {
.season-page .media img,
.season-page .media svg,
.season-page .media video {
width: auto;
height: 101%
}
}
.season-page .post-container {
overflow: hidden;
height: 100%;
padding: 128px 96px
}
@media all and (max-width: 767px) {
.season-page .post-container {
padding: 48px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post-container {
padding: 80px 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .post-container {
padding: 96px 64px
}
}
.season-page .post {
height: 100%
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .post {
font-size: 2.7rem
}
}
.season-page .post h2 {
margin-bottom: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.season-page .post h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post h2 {
font-size: 2.4rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .post h2 {
font-size: 2.7rem
}
}
.season-page .post p {
margin-bottom: 16px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.season-page .post h4 {
margin-bottom: 8px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.season-page .post h6 {
margin-top: -16px;
margin-bottom: 32px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.season-page .post h6 {
font-size: 1.2rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post h6 {
font-size: 1.2rem
}
}
.season-page .post ul {
margin-bottom: 24px;
list-style: none;
color: #323232
}
.season-page .post ul li {
margin-bottom: 8px
}
.season-page .post ul p {
margin-bottom: 0
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post .content-1 {
position: relative;
z-index: 5;
float: left;
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post .content-2 {
position: relative;
z-index: 5;
float: left;
width: 50%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .post .content-3 {
position: relative;
z-index: 5;
float: left;
width: 50%
}
}
.season-page .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
visibility: hidden;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
.season-page .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .scroll-bar {
width: 100%;
height: 4px
}
}
.season-page .scroll-bar.right {
right: 0
}
.season-page .scroll-bar.left {
left: 0
}
.season-page .with-scroll .scroll-bar {
visibility: visible
}
.season-page .pic .upper {
float: left;
overflow: hidden;
width: 100%;
height: 75vh;
background-position: center;
background-size: cover
}
.season-page .pic .half-lower {
float: left;
width: 50%;
height: 25vh;
background-position: center;
background-size: cover
}
.season-page .calendar-section {
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
.season-page .calendar-section {
padding: 48px 0 64px
}
}
.season-page .calendar-section h1 {
margin-bottom: 48px;
text-align: center;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .calendar-section h1 {
font-size: 2.7rem;
margin-bottom: 24px
}
}
.season-page .calendar-section .calendar-container {
width: 100%
}
@media all and (max-width: 767px) {
.season-page .calendar-section .calendar-container {
overflow: scroll;
-webkit-overflow-scrolling: touch
}
}
.season-page .calendar-section .calendar {
width: 87.5%;
max-width: 1040px;
margin: 0 auto;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.season-page .calendar-section .calendar {
min-width: 700px;
padding-right: 16px;
padding-left: 16px
}
}
.season-page .calendar-section .calendar tr:nth-child(2n-1) {
background-color: #fff
}
.season-page .calendar-section .calendar tr td {
height: 48px;
padding: 0 8px
}
.season-page .calendar-section .calendar tr td:first-child {
padding-left: 40px
}
@media all and (max-width: 767px) {
.season-page .calendar-section .calendar tr td:first-child {
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .calendar-section .calendar tr td:first-child {
padding-left: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .calendar-section .calendar tr td:first-child {
padding-left: 16px
}
}
.season-page .calendar-section .calendar tr td:last-child {
padding-right: 40px
}
@media all and (max-width: 767px) {
.season-page .calendar-section .calendar tr td:last-child {
padding-right: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .calendar-section .calendar tr td:last-child {
padding-right: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .calendar-section .calendar tr td:last-child {
padding-right: 16px
}
}
.season-page .calendar-section .calendar tr td.date {
width: 13%
}
.season-page .calendar-section .calendar tr td.name {
width: 20%
}
.season-page .calendar-section .calendar tr td.round {
width: 37%
}
.season-page .calendar-section .calendar tr td.track {
font-weight: 700
}
.season-page .calendar-section .remark {
width: 87.5%;
max-width: 1040px;
margin: 0 auto;
margin-top: 8px;
text-align: right;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.season-page .calendar-section .remark {
width: 100%;
margin-left: 16px;
text-align: left
}
}
.season-page .tracks-container {
position: relative;
overflow: hidden;
width: 100vw;
height: 100vh
}
@media all and (max-width: 767px) {
.season-page .tracks-container {
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .tracks-container {
height: auto
}
}
.season-page .tracks-container .track-list {
position: absolute
}
@media all and (max-width: 767px) {
.season-page .tracks-container .track-list {
position: relative;
width: 100% !important
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .tracks-container .track-list {
position: relative;
width: 100% !important
}
}
.season-page .tracks-container .track-list .track {
position: relative;
float: left;
width: 30vw;
height: 100vh
}
@media all and (max-width: 767px) {
.season-page .tracks-container .track-list .track {
width: 100%;
height: 40vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .tracks-container .track-list .track {
width: 100%;
height: 40vw
}
}
.season-page .tracks-container .track-list .track .info-container {
position: absolute;
top: 0;
left: 0;
display: table;
width: 100%;
height: 100%
}
.season-page .tracks-container .track-list .track .info-container .info {
display: table-cell;
text-align: center;
vertical-align: middle;
color: #fff
}
.season-page .tracks-container .track-list .track .info-container .info h2 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .tracks-container .track-list .track .info-container .info h2 {
font-size: 2.7rem
}
}
.season-page .tracks-container .track-list .track .info-container .info h6 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .tracks-container .track-list .track .info-container .info h6 {
font-size: 1.4rem
}
}
.season-page .tracks-container .track-list .media {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh
}
@media all and (max-width: 767px) {
.season-page .tracks-container .track-list .media {
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .tracks-container .track-list .media {
height: auto
}
}
.season-page .tracks-container .track-list .media img,
.season-page .tracks-container .track-list .media svg,
.season-page .tracks-container .track-list .media video {
position: relative;
top: 50%;
left: 50%;
width: auto;
height: 100%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
@media all and (max-width: 767px) {
.season-page .tracks-container .track-list .media img,
.season-page .tracks-container .track-list .media svg,
.season-page .tracks-container .track-list .media video {
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.season-page .tracks-container .track-list .media img,
.season-page .tracks-container .track-list .media svg,
.season-page .tracks-container .track-list .media video {
width: 100%;
height: auto
}
}
.season-page .table-section {
overflow: hidden;
width: 100vw;
height: 100vh;
padding-top: 128px
}
@media all and (max-width: 767px) {
.season-page .table-section {
height: auto;
padding: 48px 0 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .table-section {
padding-top: 80px
}
}
.season-page .table-section h1 {
text-align: center;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .table-section h1 {
font-size: 2.7rem
}
}
.season-page .table-section .tabs {
margin: 48px auto 32px;
text-align: center
}
@media all and (max-width: 767px) {
.season-page .table-section .tabs {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
padding: 0 16px;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.season-page .table-section .tabs {
margin-top: 32px
}
}
.season-page .table-section .tabs li {
display: inline-block;
width: 160px;
margin: 0 16px;
text-align: center;
color: #9b9b9b;
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
.season-page .table-section .tabs li {
width: auto;
margin: 0 8px;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto
}
}
.season-page .table-section .tabs li.current {
color: #fff;
background-color: #ea212e
}
.season-page .table-section .tabs li h5 {
line-height: 48px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.season-page .table-section .tabs li h5 {
line-height: 40px
}
}
.season-page .table-section .table-container {
max-width: 1400px;
margin: 0 auto;
padding-right: 24px;
padding-left: 24px
}
@media all and (max-width: 767px) {
.season-page .table-section .table-container {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: scroll;
padding-right: 0;
padding-left: 0;
-webkit-overflow-scrolling: touch;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap
}
}
.season-page .table-section .table-container .col-container {
float: left
}
@media all and (max-width: 767px) {
.season-page .table-section .table-container .col-container {
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0
}
}
.season-page .table-section .table-container .col-container.fix {
overflow: hidden
}
@media all and (max-width: 767px) {
.season-page .table-section .table-container .col-container.fix {
padding-left: 16px
}
}
.season-page .table-section .table-container .col-container.not-fix {
overflow: hidden
}
@media all and (max-width: 767px) {
.season-page .table-section .table-container .col-container.not-fix {
padding-right: 16px
}
}
.season-page .table-section .table-container .tr::after {
display: table;
clear: both;
content: ''
}
.season-page .table-section .table-container .td {
display: table;
float: left;
height: 48px;
padding: 8px 4px;
text-align: center;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.season-page .table-section .table-container .td {
height: 36px;
padding: 4px
}
}
.season-page .table-section .table-container .td span {
display: table-cell;
vertical-align: middle
}
.season-page .table-section .table-container .td.col-1 {
width: 72px
}
.season-page .table-section .table-container .td.col-2 {
width: 144px
}
.season-page .table-section .table-container .td.col-3 {
width: 216px
}
.season-page .table-section .table-container .td.col-4 {
width: 288px
}
.season-page .table-section .table-container .td.col-5 {
width: 360px
}
.season-page .table-section .table-container .td.col-6 {
width: 432px
}
.season-page .table-section .table-container .td.br {
line-height: 16px
}
.season-page .table-section .table-container .td.col-driver {
font-weight: 700;
width: 208px;
padding-right: 24px;
padding-left: 24px;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start
}
.season-page .table-section .table-container .td.col-total {
font-weight: 700
}
.season-page .table-section .table-container .body-container {
overflow: hidden
}
.season-page .table-section .table-container .tHead .td {
font-weight: 700;
border-top: 1px solid #e1e1e1;
border-right: 1px solid #f5f5f5;
background-color: #e1e1e1
}
.season-page .table-section .table-container .tBody {
padding-bottom: 24px
}
.season-page .table-section .table-container .tBody .td {
border-right: 1px solid #e1e1e1;
background-color: #fff
}
.season-page .table-section .table-container .tBody .trc:nth-child(2n) .td {
background-color: #f5f5f5
}
.season-page .table-section .table-container .tBody .trc:last-child .td {
border-bottom: 1px solid #e1e1e1
}
.season-page .table-section .table-container .tBody .trc:nth-child(-n+3) .col-index span {
background-color: #ea212e
}
.season-page .table-section .table-container .tBody .trc:nth-child(-n+3) .col-total span {
color: #ea212e
}
.season-page .table-section .table-container .tBody .col-index span {
font-weight: 700;
line-height: 26px;
display: block;
width: 26px;
margin: 0 auto;
text-align: center;
color: #fff;
background-color: #000
}
.season-page .table-section .table-container .fix .tr .td:first-child {
border-left: 1px solid #e1e1e1
}
.season-page .table-section .table-container .not-fix .tHead .tr .td:last-child {
border-right: 1px solid #e1e1e1
}
@media all and (max-width: 767px) {
#seasonOverlay {
overflow: auto;
-webkit-overflow-scrolling: touch
}
}
@media all and (max-width: 767px) {
#seasonOverlay .overlay {
display: -webkit-flex !important;
display: -ms-flexbox !important;
display: flex !important;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
height: auto
}
}
#seasonOverlay .pics-container {
display: table;
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
#seasonOverlay .pics-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#seasonOverlay .pics-container {
position: absolute;
top: 0;
display: block;
float: none;
width: 100%;
height: 50vh
}
}
#seasonOverlay .pics-container .media {
display: table-cell;
width: 100%;
vertical-align: middle
}
@media all and (max-width: 767px) {
#seasonOverlay .pics-container .media {
top: 0;
left: 0;
width: 100%;
height: auto;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#seasonOverlay .pics-container .media {
display: block
}
#seasonOverlay .pics-container .media img {
width: auto;
height: 50vh;
margin: 0 auto
}
}
#seasonOverlay .post-container {
display: block;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center
}
@media all and (max-width: 767px) {
#seasonOverlay .post-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#seasonOverlay .post-container {
position: absolute;
top: 50vh;
float: none;
width: 100%;
height: 50vh
}
}
#seasonOverlay .post-container.with-scroll {
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start
}
#seasonOverlay .post-container .post {
padding: 64px 96px 64px
}
@media all and (max-width: 767px) {
#seasonOverlay .post-container .post {
padding: 48px 16px 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#seasonOverlay .post-container .post {
padding: 80px 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#seasonOverlay .post-container .post {
padding: 64px 32px 32px 96px
}
}
#seasonOverlay .post-container .post h2 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#seasonOverlay .post-container .post h2 {
font-size: 2.7rem
}
}
#seasonOverlay .post-container .post h6 {
margin-bottom: 32px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#seasonOverlay .post-container .post h6 {
font-size: 1.4rem
}
}
#seasonOverlay .post-container .post p {
margin-bottom: 24px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#seasonOverlay .post-container .post h4 {
margin-top: 56px;
margin-bottom: 16px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#seasonOverlay .post-container .post table {
width: 90%;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#seasonOverlay .post-container .post table th {
font-weight: 400;
padding: 4px 0;
text-align: left
}
#seasonOverlay .post-container .post table td {
font-weight: 700;
padding: 4px 0;
text-align: left
}
#seasonOverlay .post-container .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
right: 0;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
opacity: 0;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#seasonOverlay .post-container .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#seasonOverlay .post-container .scroll-bar {
width: 100%;
height: 4px
}
}
.drivers-page {
overflow: hidden;
width: 100%;
height: 100vh;
padding-top: 0;
background-color: #e1e1e1
}
@media all and (max-width: 767px) {
.drivers-page {
overflow: auto;
height: auto;
-webkit-overflow-scrolling: touch
}
}
.drivers-page .page-container {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-bottom: 0;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
.drivers-page .event-container {
position: relative;
width: 100%;
padding: 96px 0 0
}
@media all and (max-width: 767px) {
.drivers-page .event-container {
padding: 0
}
}
.drivers-page .event-container .event-title {
text-align: center
}
@media all and (max-width: 767px) {
.drivers-page .event-container .event-title {
position: static;
padding-top: 64px;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
.drivers-page .event-container .event-title h2 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.drivers-page .event-container .event-title h2 {
font-size: 2.2rem;
padding: 0 16px
}
}
.drivers-page .group-container {
position: relative;
width: 100%;
padding: 64px 96px 16px
}
@media all and (max-width: 767px) {
.drivers-page .group-container {
padding: 32px 16px 16px
}
}
.drivers-page .group-container .group-title {
margin-bottom: 16px
}
.drivers-page .group-container .group-title h2 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.drivers-page .group-container .group-title h2 {
font-size: 2.2rem
}
}
.drivers-page .drivers-container {
position: relative;
margin-right: -48px;
margin-left: -48px
}
.drivers-page .drivers-container .driver {
float: left;
width: 25%;
margin-bottom: 16px;
padding-right: 48px;
padding-left: 48px
}
@media all and (max-width: 767px) {
.drivers-page .drivers-container .driver {
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.drivers-page .drivers-container .driver {
width: 50%
}
}
.drivers-page .drivers-container .driver .ico {
width: 100%;
padding-top: 100%;
background-repeat: no-repeat;
background-position: center top;
background-size: 100% auto
}
.drivers-page .drivers-container .driver .info {
height: 96px;
padding: 16px 0
}
.drivers-page .drivers-container .driver .info .name {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.drivers-page .drivers-container .driver .info .info {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#driversOverlay .overlay .pics-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .pics-container {
float: none;
width: 100%;
height: 64.0625vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#driversOverlay .overlay .pics-container {
float: none;
width: 100%;
height: 42vh
}
}
#driversOverlay .overlay .pics-container .media {
overflow: hidden;
width: 100%;
height: 100%;
background-position: center;
background-size: cover
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .pics-container .media {
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
#driversOverlay .overlay .post-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#driversOverlay .overlay .post-container {
float: none;
width: 100%;
height: 58vh
}
}
#driversOverlay .overlay .post-container .post {
padding: 64px 96px 64px;
color: #323232
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .post {
padding: 48px 16px 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#driversOverlay .overlay .post-container .post {
padding: 96px 64px
}
}
#driversOverlay .overlay .post-container .post .nation {
display: block;
width: 40px
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .post .nation {
width: 28px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#driversOverlay .overlay .post-container .post .nation {
width: 28px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#driversOverlay .overlay .post-container .post .nation {
width: 32px
}
}
#driversOverlay .overlay .post-container .post .name {
width: 100%;
margin: 8px 0;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#driversOverlay .overlay .post-container .post .name {
font-size: 2.7rem
}
}
#driversOverlay .overlay .post-container .post .team {
width: 100%;
margin-bottom: 32px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .post .team {
font-size: 1.1rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#driversOverlay .overlay .post-container .post .team {
font-size: 1.1rem
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#driversOverlay .overlay .post-container .post .team {
font-size: 1.2rem
}
}
#driversOverlay .overlay .post-container .post .info-form {
margin-bottom: 16px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#driversOverlay .overlay .post-container .post .info-form li {
margin-bottom: 8px
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .post .info-form li {
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
}
#driversOverlay .overlay .post-container .post .info-form li::after {
display: table;
clear: both;
content: ''
}
#driversOverlay .overlay .post-container .post .info-form .info {
float: left;
width: 96px
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .post .info-form .info {
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0
}
}
#driversOverlay .overlay .post-container .post .info-form .des {
font-weight: 700;
float: left
}
#driversOverlay .overlay .post-container .post .history-container {
width: 100%
}
#driversOverlay .overlay .post-container .post .history-container h4 {
margin-bottom: 10px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#driversOverlay .overlay .post-container .post .history-container .history-list-container .history-list {
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#driversOverlay .overlay .post-container .post .history-container .history-list-container .history-list li {
margin-bottom: 8px
}
#driversOverlay .overlay .post-container .post .history-container .history-list-container .history-list li::after {
display: table;
clear: both;
content: ''
}
#driversOverlay .overlay .post-container .post .history-container .history-list-container .history-list .year {
float: left;
width: 20%
}
#driversOverlay .overlay .post-container .post .history-container .history-list-container .history-list .des {
float: left;
width: 80%
}
#driversOverlay .overlay .post-container .post .more {
font-weight: 700;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#driversOverlay .overlay .post-container .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
left: 0;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#driversOverlay .overlay .post-container .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#driversOverlay .overlay .post-container .scroll-bar {
width: 100%;
height: 4px
}
}
.teams-page {
overflow: hidden;
width: 100%;
height: 100vh;
padding-top: 0;
background-color: #e1e1e1
}
@media all and (max-width: 767px) {
.teams-page {
overflow: auto;
height: auto;
-webkit-overflow-scrolling: touch
}
}
.teams-page .page-container {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-bottom: 0;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
.teams-page .event-title {
text-align: center
}
@media all and (max-width: 767px) {
.teams-page .event-title {
position: static;
padding-top: 64px;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
.teams-page .event-title h2 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.teams-page .event-title h2 {
font-size: 2.2rem
}
}
.teams-page .event-container {
position: relative;
width: 100%;
padding: 96px 0 0
}
.teams-page .teams-container {
width: 100%;
padding: 64px 96px 0
}
@media all and (max-width: 767px) {
.teams-page .teams-container {
padding-top: 64px;
padding-right: 16px;
padding-left: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.teams-page .teams-container {
padding-right: 48px;
padding-left: 48px
}
}
.teams-page .teams-container .team {
float: left;
width: 30%;
height: 12vw;
margin-bottom: 32px;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center
}
@media all and (max-width: 767px) {
.teams-page .teams-container .team {
width: 100%;
height: 44vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.teams-page .teams-container .team {
width: 50%
}
}
.teams-page .teams-container .team .logo {
width: 60%;
height: 7.2vw;
margin: 2.4vw auto;
background-repeat: no-repeat;
background-position: center;
background-size: contain
}
@media all and (max-width: 767px) {
.teams-page .teams-container .team .logo {
height: 60%
}
}
.teams-page .teams-container .team:nth-child(3n-1) {
margin-right: 5%;
margin-left: 5%
}
@media all and (max-width: 767px) {
.teams-page .teams-container .team:nth-child(3n-1) {
margin-right: 0;
margin-left: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.teams-page .teams-container .team:nth-child(3n-1) {
margin-right: 0;
margin-left: 0
}
}
#teamsOverlay .overlay .pics-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .pics-container {
float: none;
width: 100%;
height: 64.0625vw
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#teamsOverlay .overlay .pics-container {
float: none;
width: 100%;
height: 42vh
}
}
#teamsOverlay .overlay .pics-container .media {
overflow: hidden;
width: 100%;
height: 100%;
background-position: center;
background-size: cover
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .pics-container .media {
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
#teamsOverlay .overlay .post-container {
overflow: hidden
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .post-container {
float: none;
width: 100%;
height: auto
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#teamsOverlay .overlay .post-container {
float: none;
width: 100%;
height: 58vh
}
}
#teamsOverlay .overlay .post-container .post {
padding: 64px 96px 64px;
color: #323232
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .post-container .post {
padding: 48px 16px 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#teamsOverlay .overlay .post-container .post {
padding: 96px 64px
}
}
#teamsOverlay .overlay .post-container .post .logo {
height: 96px
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .post-container .post .logo {
height: 48px
}
}
#teamsOverlay .overlay .post-container .post .logo img {
width: auto;
height: 100%
}
#teamsOverlay .overlay .post-container .post .name {
width: 100%;
margin: 32px 0 8px;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#teamsOverlay .overlay .post-container .post .name {
font-size: 2.7rem
}
}
#teamsOverlay .overlay .post-container .post .company {
width: 100%;
margin-bottom: 64px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
#teamsOverlay .overlay .post-container .post .company {
font-size: 1.2rem
}
}
#teamsOverlay .overlay .post-container .post .profile-container {
margin-bottom: 16px
}
#teamsOverlay .overlay .post-container .post .profile-container h4 {
margin-bottom: 10px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#teamsOverlay .overlay .post-container .post .profile-container .profile-list-container .profile-list {
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#teamsOverlay .overlay .post-container .post .profile-container .profile-list-container .profile-list li {
margin-bottom: 8px
}
#teamsOverlay .overlay .post-container .post .profile-container .profile-list-container .profile-list li::after {
display: table;
clear: both;
content: ''
}
#teamsOverlay .overlay .post-container .post .profile-container .profile-list-container .profile-list .info {
float: left;
width: 128px
}
#teamsOverlay .overlay .post-container .post .profile-container .profile-list-container .profile-list .des {
font-weight: 700;
float: left
}
#teamsOverlay .overlay .post-container .post .bio-container h4 {
margin-bottom: 10px;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
#teamsOverlay .overlay .post-container .post .bio-container .bio {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
#teamsOverlay .overlay .post-container .scroll-bar {
position: absolute;
z-index: 50;
top: 0;
left: 0;
overflow: hidden;
width: 4px;
height: 100vh;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
pointer-events: none;
background-color: #ea212e
}
@media all and (max-width: 767px) {
#teamsOverlay .overlay .post-container .scroll-bar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#teamsOverlay .overlay .post-container .scroll-bar {
width: 100%;
height: 4px
}
}
.media-page .section-container {
position: relative;
width: 100%;
transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1)
}
@media all and (max-width: 767px) {
.media-page{
padding-top: 65px;
}
.media-page .section-container {
height: auto
}
.media-page .scroll-top-tag{
display: none;
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .section-container {
height: 100vh
}
}
.media-page .section-container.show-login {
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%)
}
@media all and (max-width: 767px) {
.media-page .section-container.show-login {
-webkit-transform: none;
-ms-transform: none;
transform: none
}
.media-page .section-container.show-login .half-container.upper {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%)
}
/*.media-page .section-container.show-login .login-container {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
}*/
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .section-container.show-login {
-webkit-transform: none;
-ms-transform: none;
transform: none
}
.media-page .section-container.show-login .half-container.upper {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%)
}
/*.media-page .section-container.show-login .login-container {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%)
}*/
}
.media-page .half-container {
display: table;
background-color: #fff;
background-position: center;
background-size: cover
}
.media-page .half-container .cover-link{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
@media all and (max-width: 767px) {
.media-page .half-container {
height: 50vh;
transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1)
}
.media-page .half-container.upper{
min-height: 465px;
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .half-container {
transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1)
}
}
.media-page .login-container {
position: absolute;
top: 0;
left: -100%;
width:100%;
height: 100%;
display: flex;
align-items: center;
}
@media all and (max-width: 767px) {
.media-page .login-container {
/*margin-top: 65px;*/
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
/*.media-page .login-container {
left: -100%;
width: 100%;
height: 50vh
}*/
}
.media-page .cover {
display: table-cell;
padding: 0 64px 96px;
vertical-align: bottom;
color: #fff
}
@media all and (max-width: 767px) {
.media-page .cover {
padding: 48px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .cover {
padding: 0 48px 80px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-page .cover {
padding: 0 48px 64px
}
}
.media-page .cover .title {
margin-bottom: 48px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.media-page .cover .title {
font-size: 2.4rem;
margin-bottom: 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .cover .title {
font-size: 2.4rem;
margin-bottom: 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-page .cover .title {
font-size: 2.7rem
}
}
.media-page .cover .content {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-page .cover .content p {
margin-top: 8px
}
@media all and (max-width: 767px) {
.media-page .cover .content p {
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .cover .content p {
width: 60%
}
}
.media-page .login-form {
width: 82%;
padding-left: 18%
}
@media all and (max-width: 767px) {
.media-page .login-form {
width: 100%;
padding: 48px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .login-form {
/*top: 30%*/
}
}
@media all and (min-width: 1600px) {
.media-page .login-form {
/*top: 32%*/
}
}
.media-page .login-form h3 {
margin-bottom: 32px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.media-page .login-form h3 {
margin-bottom: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-page .login-form h3 {
font-size: 2.7rem
}
}
.media-page .login-form .form li {
position: relative;
margin-bottom: 16px;
padding-top: 8px;
padding-bottom: 8px
}
@media all and (max-width: 767px) {
.media-page .login-form .form li {
height: auto;
padding-top: 16px
}
}
.media-page .login-form .form li.border {
border-bottom: 1px solid #000
}
.media-page .login-form .form .pup p {}
.media-page .login-form .form p {
color: #9b9b9b
}
.media-page .login-form .form input {
line-height: 1;
width: 100%;
border: none;
border-radius: 0;
outline: none;
background: transparent
}
.media-page .login-form .form button {
font-weight: 700;
padding: 16px 64px;
cursor: pointer;
text-align: center;
color: #fff;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-page .login-form .form .tag {
line-height: 48px;
position: absolute;
top: 24px;
left: 184px;
padding: 0 8px;
transition: opacity 0.5s cubic-bezier(0.77, 0, 0.175, 1);
text-align: left;
opacity: 0
}
@media all and (max-width: 767px) {
.media-page .login-form .form .tag {
top: 16px
}
}
.media-page .login-form .form .tag span {
display: none
}
.media-page .login-form .form .tag span.wrong {
color: #ea212e
}
.media-page .login-form .form .tag.wrong {
opacity: 1
}
.media-page .login-form .form .tag.wrong .wrong {
display: inline
}
.media-page .login-form .form .tag.success {
opacity: 1
}
.media-page .login-form .form .tag.success .success {
display: inline
}
.media-page .close-btn {
position: absolute
}
@media all and (max-width: 767px) {
.media-page .close-btn {
top: 0;
right: 0;
margin-top: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-page .close-btn {
top: 50%;
right: auto;
left: 32px;
margin-top: -24px
}
}
.search-page {
overflow: hidden;
width: 100%;
height: 100vh;
background-color: #fff
}
@media all and (max-width: 767px) {
.search-page {
/*height: auto;*/
overflow: auto;
}
}
.search-page .search-container {
padding: 128px 96px 64px
}
@media all and (max-width: 767px) {
.search-page .search-container {
padding: 48px 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .search-container {
padding: 80px 48px 48px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .search-container {
padding: 96px 48px 64px
}
}
.search-page .search-keyword {
margin-bottom: 56px;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.search-page .search-keyword {
font-size: 2.4rem;
margin-bottom: 40px;
margin-top: 40px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .search-keyword {
font-size: 2.4rem;
margin-bottom: 40px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .search-keyword {
font-size: 2.7rem
}
}
.search-page .search-keyword span {
color: #ea212e
}
.search-page .result-container {
position: relative
}
.search-page .result-container a {
outline: none
}
.search-page .result-container .result-type {
margin-bottom: 64px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.search-page .result-container .result-type {
font-size: 2.4rem;
margin-bottom: 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container .result-type {
font-size: 2.4rem;
margin-bottom: 32px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container .result-type {
font-size: 2.7rem;
margin-bottom: 32px
}
}
.search-page .result-container .more {
font-weight: 700;
line-height: 100%;
position: absolute;
top: 24px;
right: 0;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.search-page .result-container .more {
top: 8px
}
}
.search-page .result-container .more a {
color: #000
}
.search-page .result-container .more a:after {
top: 2px;
margin-left: 8px;
content: '\65';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.search-page .result-container .result {
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.search-page .result-container .result .title {
font-weight: 700
}
.search-page .result-container .result .date {
font-weight: 700
}
.search-page .result-container.without-thumb {
margin-bottom: 96px
}
@media all and (max-width: 767px) {
.search-page .result-container.without-thumb {
margin-bottom: 64px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.without-thumb {
margin-bottom: 64px
}
}
.search-page .result-container.without-thumb .result {
width: 100%;
margin-bottom: 32px;
padding: 32px;
background-color: #e1e1e1
}
@media all and (max-width: 767px) {
.search-page .result-container.without-thumb .result {
padding: 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.without-thumb .result {
padding: 10px 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container.without-thumb .result {
padding: 24px 32px
}
}
.search-page .result-container.without-thumb .result::after {
display: table;
clear: both;
content: ''
}
.search-page .result-container.without-thumb .result .title {
float: left;
width: 80%
}
@media all and (max-width: 767px) {
.search-page .result-container.without-thumb .result .title {
width: 100%;
margin-bottom: 12px
}
}
.search-page .result-container.without-thumb .result .date {
float: right
}
@media all and (max-width: 767px) {
.search-page .result-container.without-thumb .result .date {
font-weight: 400;
float: left
}
}
.search-page .result-container.with-thumb {
margin-right: -48px;
margin-bottom: 32px;
margin-left: -48px
}
@media all and (max-width: 767px) {
.search-page .result-container.with-thumb {
margin-right: -24px;
margin-left: -24px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.with-thumb {
margin-right: -24px;
margin-left: -24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container.with-thumb {
margin-right: -24px;
margin-left: -24px
}
}
.search-page .result-container.with-thumb .result-type {
padding-right: 48px;
padding-left: 48px
}
@media all and (max-width: 767px) {
.search-page .result-container.with-thumb .result-type {
padding-right: 24px;
padding-left: 24px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.with-thumb .result-type {
padding-right: 24px;
padding-left: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container.with-thumb .result-type {
padding-right: 24px;
padding-left: 24px
}
}
.search-page .result-container.with-thumb .result {
float: left;
width: 33.33333%;
margin-bottom: 64px;
padding-right: 48px;
padding-left: 48px;
color: #000
}
@media all and (max-width: 767px) {
.search-page .result-container.with-thumb .result {
width: 100%;
margin-bottom: 32px;
padding-right: 24px;
padding-left: 24px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.with-thumb .result {
width: 50%;
margin-bottom: 32px;
padding-right: 24px;
padding-left: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container.with-thumb .result {
margin-bottom: 32px;
padding-right: 24px;
padding-left: 24px
}
}
.search-page .result-container.with-thumb .result:nth-child(3n-1) {
margin-right: 5%;
margin-left: 5%
}
.search-page .result-container.with-thumb .title {
overflow: hidden;
height: 64px
}
.search-page .result-container.with-thumb .thumb {
width: 100%;
margin-bottom: 16px
}
.search-page .result-container.with-thumb .more {
right: 48px
}
@media all and (max-width: 767px) {
.search-page .result-container.with-thumb .more {
right: 24px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.search-page .result-container.with-thumb .more {
right: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.search-page .result-container.with-thumb .more {
right: 24px
}
}
.media-center {
overflow: auto;
height: 100vh;
-webkit-overflow-scrolling: touch
}
.media-center .page-header .menu-nav-container .page-nav {
margin-right: 0;
transition: none
}
@media all and (max-width: 767px) {
.media-center .page-header .menu-nav-container .page-nav {
display: block;
padding-right: 8px;
padding-left: 8px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-header .menu-nav-container .page-nav {
display: block;
padding-right: 8px;
padding-left: 8px
}
}
.media-center .page-header .menu-nav-container .page-nav ul {
padding-top: 0;
padding-bottom: 0;
transition: none
}
.media-center .page-header .menu-nav-container .page-nav ul li {
transition: none
}
@media all and (max-width: 767px) {
.media-center .page-header .menu-nav-container .page-nav ul li {
margin-right: 8px;
margin-left: 8px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-header .menu-nav-container .page-nav ul li {
margin-right: 8px;
margin-left: 8px
}
}
.media-center .page-header .menu-nav-container .page-nav ul li a {
line-height: 48px;
display: inline
}
.media-center .scroll-down-tag {
display: none
}
.media-center .buttons button {
float: left;
cursor: pointer
}
.media-center .buttons .add-button {
color: #323232;
border: none;
outline: none;
background-color: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.media-center .buttons .add-button {
display: none
}
}
.media-center .buttons .add-button:before {
font-size: 1.8rem;
position: relative;
top: 5px;
margin-right: 8px;
content: '\61';
color: #e1e1e1;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.media-center .buttons .remove-button {
display: none;
color: #323232;
border: none;
outline: none;
background-color: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .buttons .remove-button:before {
font-size: 1.8rem;
position: relative;
top: 5px;
margin-right: 8px;
content: '\66';
color: #ea212e;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.media-center .buttons .download-button {
color: #323232;
border: none;
outline: none;
background-color: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .buttons .download-button:before {
font-size: 1.8rem;
position: relative;
top: 5px;
margin-right: 8px;
content: '\6a';
color: #e1e1e1;
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.media-center .buttons .download-button a {
color: #323232
}
.media-center .page-main {
padding-top: 65px;
background-color: #fff
}
@media all and (max-width: 767px) {
.media-center .page-main {
padding-top: 0
}
}
.media-center .page-main .sidebar {
float: right;
width: 280px;
padding: 0 32px 32px 31px;
opacity: 0
}
@media all and (max-width: 767px) {
.media-center .page-main .sidebar {
display: none
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .sidebar {
padding: 0 24px 32px 23px
}
}
.media-center .page-main .sidebar .fixed-container {
position: fixed;
z-index: 888;
padding-top: 64px;
background-color: #fff
}
.media-center .page-main .sidebar .search-container {
margin-bottom: 32px;
padding-bottom: 8px;
border-bottom: 1px solid #e1e1e1
}
.media-center .page-main .sidebar .search-container .pcca-icon {
display: inline-block;
width: 12px;
height: 12px;
margin-right: 16px;
color: #9b9b9b
}
.media-center .page-main .sidebar .search-container .search {
width: 80%;
color: #9b9b9b;
border: none;
outline: none;
background: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .sidebar .download-btn {
font-weight: 700;
width: 100%;
margin-bottom: 32px;
padding: 16px 0;
cursor: pointer;
text-align: center;
color: #fff;
background-color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .sidebar .select-container .select-title {
font-weight: 700;
display: inline-block;
margin-right: 16px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .sidebar .select-container .clear-all {
font-weight: 700;
cursor: pointer;
color: #ea212e;
background-color: transparent;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .sidebar .select-container .select-list {
width: 100%;
margin-top: 16px
}
.media-center .page-main .sidebar .select-container .select-list .select {
line-height: 24px;
margin-bottom: 8px;
cursor: pointer;
color: #323232
}
.media-center .page-main .sidebar .select-container .select-list .select:before {
font-size: 2rem;
top: 5px;
margin-right: 16px;
color: #ea212e
}
.media-center .page-main .section-container {
float: left;
width: 100%;
min-height: 70vh;
padding: 64px 48px;
border-right: 1px solid #e1e1e1
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container {
width: 100%;
padding: 48px 16px;
border-right: none
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-center .page-main .section-container {
padding: 48px
}
}
.media-center .page-main .section-container .section-title {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-center .page-main .section-container .section-title {
font-size: 2.7rem
}
}
.media-center .page-main .section-container .section-title a {
color: #000
}
.media-center .page-main .section-container .section-title.current {
color: #ea212e
}
.media-center .page-main .section-container .section-title.current a {
color: #ea212e
}
.media-center .page-main .section-container .forder-list {
margin-top: 48px
}
.media-center .page-main .section-container .forder-list .forder {
width: 100%;
margin-bottom: 32px;
padding: 32px;
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .forder-list .forder {
padding: 16px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-center .page-main .section-container .forder-list .forder {
padding-left: 16px
}
}
.media-center .page-main .section-container .forder-list .forder::after {
display: table;
clear: both;
content: ''
}
.media-center .page-main .section-container .forder-list .forder .forder-name {
float: left;
width: 80%;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .forder-list .forder .forder-name {
width: 100%;
margin-bottom: 12px
}
}
.media-center .page-main .section-container .forder-list .forder .more {
float: right;
margin-top: 8px;
color: #9b9b9b;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .forder-list .forder .more {
float: left
}
}
.media-center .page-main .section-container .forder-list .forder .more:after {
top: 2px;
margin-left: 8px;
content: '\65';
font-family: 'PCCA ICON';
font-weight: normal !important;
font-style: normal !important;
font-variant: normal !important;
line-height: 1;
text-transform: none !important;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.media-center .page-main .section-container .file-list {
margin-top: 48px
}
.media-center .page-main .section-container .file-list .file-id {
font-weight: 700;
margin-bottom: 4px;
color: #000;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .section-container .file-list .file-name {
word-wrap: break-word;
color: #323232;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.media-center .page-main .section-container .file-list.with-thumb {
margin-right: -24px;
margin-left: -24px;
display: flex;
flex-wrap: wrap;
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.with-thumb {
margin-right: -16px;
margin-left: -16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.with-thumb {
margin-right: -16px;
margin-left: -16px
}
}
.media-center .page-main .section-container .file-list.with-thumb .file {
float: left;
width: 33.33333%;
margin-bottom: 64px;
padding: 0 24px
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.with-thumb .file {
width: 100%;
padding: 0 16px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.with-thumb .file {
width: 50%;
padding: 0 16px
}
}
.media-center .page-main .section-container .file-list.with-thumb .file .thumb {
margin-bottom: 16px;
padding-top: 66.7%;
background-repeat: no-repeat;
background-position: center;
background-size: contain
}
.media-center .page-main .section-container .file-list.with-thumb .file .info {
margin-bottom: 16px
}
.media-center .page-main .section-container .file-list.with-thumb .file.hide {
display: none
}
.media-center .page-main .section-container .file-list.with-thumb .file .download-button {
float: right
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.with-thumb .file .download-button {
float: left
}
}
.media-center .page-main .section-container .file-list.without-thumb .file {
overflow: hidden;
width: 100%;
max-height: 500px;
margin-bottom: 32px;
padding-top: 32px;
padding-right: 32px;
padding-bottom: 32px;
padding-left: 32px;
transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
background-color: #f5f5f5
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.without-thumb .file {
padding: 16px
}
}
.media-center .page-main .section-container .file-list.without-thumb .file.hide {
max-height: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
opacity: 0
}
.media-center .page-main .section-container .file-list.without-thumb .info {
float: left;
width: 50%
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.without-thumb .info {
float: none;
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.without-thumb .info {
float: none;
width: 100%
}
}
.media-center .page-main .section-container .file-list.without-thumb .buttons {
float: right;
margin-top: 16px
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.without-thumb .buttons {
float: none;
width: 100%
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.without-thumb .buttons {
float: none;
width: 100%
}
}
.media-center .page-main .section-container .file-list.without-thumb button {
margin-left: 64px
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.without-thumb button {
margin-left: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.without-thumb button {
margin-left: 0
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.media-center .page-main .section-container .file-list.without-thumb button {
margin-left: 32px
}
}
.media-center .page-main .section-container .file-list.without-thumb button.add-button {
width: 130px;
text-align: left
}
.media-center .page-main .section-container .file-list.without-thumb button.remove-button {
width: 130px;
text-align: left
}
@media all and (max-width: 767px) {
.media-center .page-main .section-container .file-list.without-thumb button.download-button {
float: left
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.media-center .page-main .section-container .file-list.without-thumb button.download-button {
float: right
}
}
.media-center .page-main .section-container .file-list.without-thumb .file-id {
color: #ea212e
}
.media-center .page-main .section-container .file-list.without-thumb .file-name {
font-weight: 700
}
.media-center .page-main .section-container .file-list .file.selected .add-button {
display: none
}
.media-center .page-main .section-container .file-list .file.selected .remove-button {
display: block
}
#mediaOverlay .file {
position: absolute;
top: 50%;
left: 50%;
width: 960px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%)
}
@media all and (max-width: 767px) {
#mediaOverlay .file {
width: 100%;
padding: 0
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
#mediaOverlay .file {
width: 100%;
padding: 0
}
}
#mediaOverlay .file.selected .add-button {
display: none
}
#mediaOverlay .file.selected .remove-button {
display: block
}
#mediaOverlay .file .thumb {
margin-bottom: 16px;
padding-top: 66.7%;
background-repeat: no-repeat;
background-position: center;
background-size: contain
}
#mediaOverlay .file .info {
margin-bottom: 16px
}
#mediaOverlay .file.hide {
display: none
}
#mediaOverlay .file .download-button {
float: right
}
@media all and (max-width: 767px) {
#mediaOverlay .file .download-button {
float: left
}
}
.notfount-page .page-container {
position: relative;
min-height: 70vh;
background-color: #323232
}
.notfount-page .page-container .content {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-40%, -50%);
-ms-transform: translate(-40%, -50%);
transform: translate(-40%, -50%);
text-align: center;
color: #fff
}
.notfount-page .page-container .content h1 {
font-size: 14rem;
line-height: 1;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.notfount-page .page-container .content h2 {
font-size: 4.8rem;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.notfount-page .page-container .content .button {
font-size: 1.4rem;
font-weight: 700;
line-height: 48px;
width: 240px;
margin: 32px auto 0;
text-align: center;
color: #fff;
border: 1px solid #fff;
outline: none;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
.notfount-page .page-container .content a:hover .button {
color: #323232;
background-color: #fff
}
.p-swiper {
height: 100vh;
}
.p-swiper .swiper-button-next,
.p-swiper .swiper-button-prev {
width: 48px;
height: 48px;
padding: 14px;
transition: all .3s ease-out;
background-color: #fff;
color: #000;
}
.p-swiper .swiper-button-next:hover,
.p-swiper .swiper-button-prev:hover {
background-color: #ea212e;
color: #fff;
}
.p-swiper .swiper-button-next {
right: 16px;
}
.p-swiper .swiper-button-prev {
left: 16px;
}
.p-swiper .swiper-button-next:after,
.p-swiper .swiper-button-prev:after {
content: none;
}
.p-swiper .scroll-tag {
position: absolute;
bottom: 40px;
z-index: 99;
color: #fff;
width: 22px;
height: 22px;
left: 50%;
transform: translateX(-50%);
}
@media all and (max-width: 991px) {
.p-swiper {
height: auto;
}
.p-swiper .scroll-tag {
opacity: 0;
}
}
.about-page .page-post {
position: absolute;
bottom: 128px;
left: 96px;
width: 50%;
}
.about-page .page-post .title h2 {
margin-bottom: 0;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
.about-page .page-post .content {
margin-top: 16px;
color: #fff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
}
.about-page .page-post .content p {
margin-top: 16px;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .page-post {
bottom: 96px;
left: 64px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.about-page .page-post .title h2 {
font-size: 2.7rem
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.about-page .page-post {
width: calc(100% - 192px);
}
}
@media all and (max-width: 767px) {
.about-page .page-post {
position: relative;
width: 100%;
left: unset;
bottom: unset;
padding: 48px 16px;
}
.about-page .page-post .title h2 {
color: #000000;
}
.about-page .page-post .content p {
color: #000000;
}
}
.homepage {
height: 100vh;
/*overflow: auto;*/
}
#homeNews>.title {
display: flex;
padding: 40px 36px;
justify-content: space-between;
align-items: center;
}
#homeNews>.title h1 {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700;
text-transform: uppercase;
}
#homeNews>.title .more-news {
width: 180px;
height: 48px;
background-color: #ea212e;
display: flex;
align-items: center;
justify-content: center;
}
#homeNews>.title .more-news p {
color: #ffffff;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700;
text-transform: uppercase;
}
.homepage .news-container {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.homepage .news-container .news {
float: left;
width: 33.33333%;
background-color: #fff
}
@media all and (max-width: 991px) {
.homepage .news-container .news {
width: 100%
}
#homeNews>.title {
padding: 28px 16px 12px;
}
#homeNews>.title .more-news {
width: 122px;
height: 40px;
position: absolute;
bottom: 0;
right: 16px;
transform: translateY(-50%);
}
}
.homepage .news-container .news:nth-child(2n),
.homepage .news-container .news.grayBG {
background-color: #f5f5f5
}
.homepage .news-container .news .upper {
position: relative
}
.homepage .news-container .news .lower {
position: relative;
height: 280px;
padding: 32px
}
@media all and (max-width: 991px) {
.homepage .news-container .news .lower {
height: auto;
padding: 16px 16px 32px
}
}
@media all and (min-width: 768px) and (max-width: 991px) {
.homepage .news-container .news .lower {
/*height: 256px;*/
padding: 24px
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.homepage .news-container .news .lower {
height: 256px;
padding: 24px
}
}
.homepage .news-container .news .lower h4 {
line-height: 100%;
margin-bottom: 24px;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
font-weight: 700
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.homepage .news-container .news .lower h4 {
font-size: 1.6rem
}
}
.homepage .news-container .news .lower p {
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.homepage .news-container .news .lower p {
font-size: 1.2rem
}
}
.homepage .news-container .news .thumb {
width: 100%;
min-height: 22.22222vw
}
.homepage .news-container .news .news-date {
font-size: 1.3rem;
position: absolute;
bottom: 16px;
left: 32px;
margin-bottom: 0;
color: #fff
}
@media all and (max-width: 767px) {
.homepage .news-container .news .news-date {
bottom: 0;
left: 16px
}
}
.homepage .news-container .news .news-date .day {
font-size: 8rem;
line-height: 64px;
border-bottom: none
}
.race-page {
height: 100vh;
font-family: 'Porsche Next W La', Arial, -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;;
overflow: auto;
transition: opacity .5s ease-out;
}
.race-page.hide {
opacity: 0;
}
.race-page .p-swiper {
height: calc(100vh - 81px);
background-image: url(../img/race_car_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
}
.race-page .p-swiper .swiper-slide {
width: 60vw;
}
.race-page .p-swiper .swiper-slide .car {
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-end;
color: #ffffff;
margin: 0 5vw;
}
.race-page .p-swiper .swiper-slide .car .name {
font-size: 5.2rem;
text-align: center;
font-weight: 700;
white-space: nowrap;
opacity: 0;
transition: opacity .5s ease-out;
}
.race-page .p-swiper .swiper-slide.swiper-slide-active .car .name {
opacity: 1;
}
.race-page .p-swiper .swiper-slide .car .pic {
width: 90%;
margin: 0 auto;
height: 40%;
display: flex;
align-items: flex-end;
}
.race-page .p-swiper .swiper-slide .car .lights {
display: flex;
justify-content: space-evenly;
height: 20%;
min-height: 160px;
flex: 0 0 auto;
margin-top: 10%;
opacity: 0;
transition: opacity .5s ease-out;
}
.race-page .p-swiper .swiper-slide.swiper-slide-active .car .lights {
opacity: 1;
}
.race-page .p-swiper .swiper-slide .car .lights .light {
width: 33.33%;
flex: 0 0 auto;
white-space: pre-wrap;
height: 100%;
display: flex;
flex-direction: column;
}
.race-page .p-swiper .swiper-slide .car .lights .light .title {
font-size: 2.4rem;
text-align: center;
margin-top: 1.2rem;
white-space: pre-wrap;
}
.race-page .p-swiper .swiper-slide .car .lights .light .value {
font-size: 3.2rem;
font-weight: 700;
text-align: center;
white-space: nowrap;
}
.race-page .car-detail {
width: 100%;
}
.race-page .car-detail .detail {
width: 100%;
display: none;
}
.race-page .car-detail .detail.active {
display: block;
}
.race-page .car-detail .detail .half-container {
width: 100%;
display: flex;
height: auto;
float: none;
}
.race-page .car-detail .detail .half-container .media {
width: 60%;
}
.race-page .car-detail .detail .half-container .info {
width: 40%;
padding: 8% 40px 0 60px;
}
.race-page .car-detail .detail .half-container .info .title {
font-size: 3.6rem;
font-weight: 700;
margin-bottom: 3rem;
}
.race-page .car-detail .detail .half-container .info .content {
font-size: 1.4rem;
}
.race-page .car-detail .detail .pic-contianer {
position: relative;
z-index: 1;
margin-top: -1px;
}
.race-page .car-detail .detail .pic-contianer .grid {
box-sizing: border-box;
position: relative;
display: block;
}
.race-page .car-detail .detail .pic-contianer .pic {
position: sticky;
top: 0;
overflow: hidden;
height: 100vh;
}
.race-page .car-detail .detail .pic-contianer .pic img {
width: 100%;
height: 100%;
object-fit: cover;
}
.race-page .car-detail .detail .pic-contianer .pic .overlay {
position: absolute;
width: 100%;
height: 100%;
background-color: #000;
top: 0;
left: 0;
}
.race-page .car-detail .detail .pic-contianer .info-container {
position: relative;
z-index: 1;
padding: 50px 54% 40vh 6%;
margin-top: -20vh;
pointer-events: auto;
position: relative;
transition: opacity ease-out .5s;
width: 100%;
z-index: 1;
}
.race-page .car-detail .detail .pic-contianer .info-container .info {
vertical-align: top;
box-sizing: border-box;
position: relative;
align-items: flex-start;
color: #fff;
display: flex;
flex-direction: column;
}
.race-page .car-detail .detail .pic-contianer .info-container .info .title {
font-size: 3.6rem;
font-weight: 700;
margin-bottom: 4rem;
}
.race-page .car-detail .detail .pic-contianer .info-container .info .content {
font-size: 1.4rem;
}
.race-page .car-detail .detail .gallery-container {
display: grid;
grid: auto / repeat(4, 1fr);
}
.race-page .car-detail .detail .gallery-container .pic:nth-child(3) {
grid-column-start: span 2;
grid-row-start: span 2;
}
.race-page .car-detail .detail .gallery-container .pic:nth-child(4) {
grid-column-start: span 2;
grid-row-end: span 2;
}
.race-page .request {
background-color: #323232;
color: #FFFFFF;
padding: 50px;
}
.race-page .request .title {
font-weight: 700;
font-size: 3.6rem;
}
.race-page .request .content {
font-size: 1.4rem;
margin-top: 10px;
}
.race-page .request .content a {
color: #ffffff;
font-weight: 700;
}
@media all and (max-width: 991px) {
.race-page .p-swiper {
height: 100vh;
background-image: url(../img/race_car_bg_p.jpg);
background-position: center center;
}
.race-page .p-swiper .swiper-button-next,
.race-page .p-swiper .swiper-button-prev {
display: none;
}
.race-page .p-swiper .swiper-slide {
width: 100vw;
}
.race-page .p-swiper .swiper-slide .car {
margin: 0 5%;
}
.race-page .p-swiper .swiper-slide .car .name {
font-size: 3.2rem;
white-space: pre-wrap;
}
.race-page .p-swiper .swiper-slide .car .pic {
height: auto;
margin-top: 6vh;
}
.race-page .p-swiper .swiper-slide .car .lights {
flex-direction: column;
height: 48%;
margin-top: 0;
justify-content: space-evenly;
}
.race-page .p-swiper .swiper-slide .car .lights .light {
width: 100%;
height: auto;
}
.race-page .p-swiper .swiper-slide .car .lights .light .title {
font-size: 1.8rem;
margin-top: 0;
white-space: nowrap;
}
.race-page .p-swiper .swiper-slide .car .lights .light .value {
font-size: 2.6rem;
}
.race-page .car-detail .detail .half-container {
flex-direction: column-reverse;
}
.race-page .car-detail .detail .half-container .media {
width: 100%;
}
.race-page .car-detail .detail .half-container .media img {
width: 100%;
height: 100%;
object-fit: cover;
}
.race-page .car-detail .detail .half-container .info {
width: 100%;
padding: 13.3333vw 4.2666vw 8vw;
}
.race-page .car-detail .detail .half-container .info .title {
font-size: 2.4rem;
}
.race-page .car-detail .detail .pic-contianer .info-container {
margin-top: -10vh;
padding: 50px 6% 10vh;
}
.race-page .car-detail .detail .gallery-container {
grid: auto / repeat(2, 1fr);
}
.race-page .request {
padding: 10.6666vw 4.2666vw
}
.race-page .request .title {
font-size: 2.4rem;
}
.race-page .request .content {
font-size: 1.7rem;
margin-top: 6.6666vw;
}
}
@media all and (min-width: 992px) and (max-width: 1199px) {
.race-page .p-swiper .swiper-slide .car .name {
font-size: 3.8rem;
}
.race-page .p-swiper .swiper-slide .car .lights .light .title {
font-size: 1.8rem;
}
.race-page .p-swiper .swiper-slide .car .lights .light .value {
font-size: 2.4rem;
}
}