@import url(https://fonts.googleapis.com/css?family=Nunito);@import url(https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;1,400&display=swap);@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:calc(10px * 2);padding:calc(var(--plyr-control-spacing,10px) * 2)}}@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(calc(10px * -4));transform:translateY(calc(var(--plyr-control-spacing,10px) * -4))}.plyr__caption{background:rgba(0,0,0,.8);background:var(--plyr-captions-background,rgba(0,0,0,.8));border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__caption div{display:inline}.plyr__control{background:0 0;border:0;border-radius:3px;border-radius:var(--plyr-control-radius,3px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7);position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}a.plyr__control{text-decoration:none}a.plyr__control::after,a.plyr__control::before{display:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:calc(10px / 4);margin-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:calc(10px / 4);padding-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item.plyr__time{padding:0 calc(10px / 2);padding:0 calc(var(--plyr-control-spacing,10px)/ 2)}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr__controls:empty{display:none}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);background:var(--plyr-menu-background,rgba(255,255,255,.9));border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-menu-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border:var(--plyr-menu-arrow-size,4px) solid transparent;border-top-color:rgba(255,255,255,.9);border-top-color:var(--plyr-menu-background,rgba(255,255,255,.9));content:'';height:0;position:absolute;right:calc(((18px / 2) + calc(10px * .7)) - (4px / 2));right:calc(((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7)) - (var(--plyr-menu-arrow-size,4px)/ 2));top:100%;width:0}.plyr__menu__container [role=menu]{padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding-bottom:calc(calc(10px * .7)/ 1.5);padding-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);padding-left:calc(calc(10px * .7) * 1.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-right:calc(calc(10px * .7) * 1.5);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-top:calc(calc(10px * .7)/ 1.5);padding-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;border:var(--plyr-menu-item-arrow-size,4px) solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:calc(calc(10px * .7) * 4);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4)}.plyr__menu__container .plyr__control--forward::after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:calc((calc(10px * .7) * 1.5) - 4px);right:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:calc(10px * .7);margin:calc(var(--plyr-control-spacing,10px) * .7);margin-bottom:calc(calc(10px * .7)/ 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);padding-left:calc(calc(10px * .7) * 4);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4);position:relative;width:calc(100% - (calc(10px * .7) * 2));width:calc(100% - (calc(var(--plyr-control-spacing,10px) * .7) * 2))}.plyr__menu__container .plyr__control--back::after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:calc((calc(10px * .7) * 1.5) - 4px);left:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--back::before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:'';height:1px;left:0;margin-top:calc(calc(10px * .7)/ 2);margin-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:calc(10px * .7);padding-left:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container .plyr__control[role=menuitemradio]::after,.plyr__menu__container .plyr__control[role=menuitemradio]::before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]::before{background:rgba(0,0,0,.1);content:'';display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]::after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{background:#00b3ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)))}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover::before{background:rgba(35,40,47,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:calc((calc(10px * .7) - 2) * -1);margin-right:calc((calc(var(--plyr-control-spacing,10px) * .7) - 2) * -1);overflow:hidden;padding-left:calc(calc(10px * .7) * 3.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 3.5);pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:calc(13px * 2);border-radius:calc(var(--plyr-range-thumb-height,13px) * 2);color:#00b3ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));display:block;height:calc((3px * 2) + 13px);height:calc((var(--plyr-range-thumb-active-shadow-width,3px) * 2) + var(--plyr-range-thumb-height,13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor 0,transparent 0);background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);-webkit-appearance:none;margin-top:calc(((13px - 5px)/ 2) * -1);margin-top:calc(((var(--plyr-range-thumb-height,13px) - var(--plyr-range-track-height,5px))/ 2) * -1)}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px)}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr__poster{background-color:#000;background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}@media (max-width:calc(768px - 1px)){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:rgba(255,255,255,.9);background:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;border-radius:var(--plyr-tooltip-radius,3px);bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:calc(10px / 2) calc(calc(10px / 2) * 1.5);padding:calc(var(--plyr-control-spacing,10px)/ 2) calc(calc(var(--plyr-control-spacing,10px)/ 2) * 1.5);pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:calc((18px / 2) + calc(10px * .7));left:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7))}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:calc((18px / 2) + calc(10px * .7));right:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7));transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr__progress{left:calc(13px * .5);left:calc(var(--plyr-range-thumb-height,13px) * .5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:calc(13px * -.5);margin-left:calc(var(--plyr-range-thumb-height,13px) * -.5);margin-right:calc(13px * -.5);margin-right:calc(var(--plyr-range-thumb-height,13px) * -.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height,13px))}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:calc((5px / 2) * -1);margin-top:calc((var(--plyr-range-track-height,5px)/ 2) * -1);padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(35,40,47,.6) 25%,transparent 25%,transparent 50%,rgba(35,40,47,.6) 50%,rgba(35,40,47,.6) 75%,transparent 75%,transparent);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 25%,transparent 25%,transparent 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr__volume{align-items:center;display:flex;max-width:110px;min-width:80px;position:relative;width:20%}.plyr__volume input[type=range]{margin-left:calc(10px / 2);margin-left:calc(var(--plyr-control-spacing,10px)/ 2);margin-right:calc(10px / 2);margin-right:calc(var(--plyr-control-spacing,10px)/ 2);position:relative;z-index:2}.plyr--is-ios .plyr__volume{min-width:0;width:auto}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--audio .plyr__progress__buffer{color:rgba(193,200,209,.6);color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr--video{background:#000;overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;left:0;position:absolute;top:0}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75));background:var(--plyr-video-controls-background,linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75)));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:calc(10px / 2);padding:calc(var(--plyr-control-spacing,10px)/ 2);padding-top:calc(10px * 2);padding-top:calc(var(--plyr-control-spacing,10px) * 2);position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:calc(10px * 3.5);padding-top:calc(var(--plyr-control-spacing,10px) * 3.5)}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control.plyr__tab-focus,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}.plyr__control--overlaid{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:calc(10px * 1.5);padding:calc(var(--plyr-control-spacing,10px) * 1.5);position:absolute;top:50%;transform:translate(-50%,-50%);transition:.3s;z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--video .plyr__progress__buffer{color:rgba(255,255,255,.25);color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;position:static}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin:-var(--plyr-range-track-height,5px)/2 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr__preview-thumb{background-color:rgba(255,255,255,.9);background-color:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:3px;padding:var(--plyr-tooltip-radius,3px);pointer-events:none;position:absolute;transform:translate(0,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0,0) scale(1)}.plyr__preview-thumb::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img{height:100%;left:0;max-height:none;max-width:none;position:absolute;top:0;width:100%}.plyr__preview-thumb__time-container{bottom:6px;left:0;position:absolute;right:0;white-space:nowrap;z-index:3}.plyr__preview-thumb__time-container span{background-color:rgba(0,0,0,.55);border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));padding:3px 6px}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important}.pretty * {
box-sizing: border-box;
}
.pretty input:not([type=checkbox]):not([type=radio]) {
display: none;
}
.pretty {
position: relative;
display: inline-block;
margin-right: 1em;
white-space: nowrap;
line-height: 1;
}
.pretty input {
position: absolute;
left: 0;
top: 0;
min-width: 1em;
width: 100%;
height: 100%;
z-index: 2;
opacity: 0;
margin: 0;
padding: 0;
cursor: pointer;
}
.pretty .state label {
position: initial;
display: inline-block;
font-weight: normal;
margin: 0;
text-indent: 1.5em;
min-width: calc(1em + 2px);
}
.pretty .state label:before, .pretty .state label:after {
content: "";
width: calc(1em + 2px);
height: calc(1em + 2px);
display: block;
box-sizing: border-box;
border-radius: 0;
border: 1px solid transparent;
z-index: 0;
position: absolute;
left: 0;
top: calc((0% - (100% - 1em)) - 8%);
background-color: transparent;
}
.pretty .state label:before {
border-color: #bdc3c7;
}
.pretty .state.p-is-hover, .pretty .state.p-is-indeterminate {
display: none;
}
@-webkit-keyframes zoom {
0% {
opacity: 0;
transform: scale(0);
}
}
@keyframes zoom {
0% {
opacity: 0;
transform: scale(0);
}
}
@-webkit-keyframes tada {
0% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
transform: scale(7);
}
38% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
opacity: 1;
transform: scale(1);
}
55% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.5);
}
72% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
81% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.24);
}
89% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
95% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.04);
}
100% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
}
@keyframes tada {
0% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
transform: scale(7);
}
38% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
opacity: 1;
transform: scale(1);
}
55% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.5);
}
72% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
81% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.24);
}
89% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
95% {
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
transform: scale(1.04);
}
100% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
transform: scale(1);
}
}
@-webkit-keyframes jelly {
0% {
transform: scale3d(1, 1, 1);
}
30% {
transform: scale3d(0.75, 1.25, 1);
}
40% {
transform: scale3d(1.25, 0.75, 1);
}
50% {
transform: scale3d(0.85, 1.15, 1);
}
65% {
transform: scale3d(1.05, 0.95, 1);
}
75% {
transform: scale3d(0.95, 1.05, 1);
}
100% {
transform: scale3d(1, 1, 1);
}
}
@keyframes jelly {
0% {
transform: scale3d(1, 1, 1);
}
30% {
transform: scale3d(0.75, 1.25, 1);
}
40% {
transform: scale3d(1.25, 0.75, 1);
}
50% {
transform: scale3d(0.85, 1.15, 1);
}
65% {
transform: scale3d(1.05, 0.95, 1);
}
75% {
transform: scale3d(0.95, 1.05, 1);
}
100% {
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes rotate {
0% {
opacity: 0;
transform: translateZ(-200px) rotate(-45deg);
}
100% {
opacity: 1;
transform: translateZ(0) rotate(0);
}
}
@keyframes rotate {
0% {
opacity: 0;
transform: translateZ(-200px) rotate(-45deg);
}
100% {
opacity: 1;
transform: translateZ(0) rotate(0);
}
}
@-webkit-keyframes pulse {
0% {
box-shadow: 0px 0px 0px 0px #bdc3c7;
}
100% {
box-shadow: 0px 0px 0px 1.5em rgba(189, 195, 199, 0);
}
}
@keyframes pulse {
0% {
box-shadow: 0px 0px 0px 0px #bdc3c7;
}
100% {
box-shadow: 0px 0px 0px 1.5em rgba(189, 195, 199, 0);
}
}
.pretty.p-default.p-fill .state label:after {
transform: scale(1);
}
.pretty.p-default .state label:after {
transform: scale(0.6);
}
.pretty.p-default input:checked ~ .state label:after {
background-color: #bdc3c7 !important;
}
.pretty.p-default.p-thick .state label:before, .pretty.p-default.p-thick .state label:after {
border-width: calc(1em / 7);
}
.pretty.p-default.p-thick .state label:after {
transform: scale(0.4) !important;
}
.pretty.p-icon .state .icon {
position: absolute;
font-size: 1em;
width: calc(1em + 2px);
height: calc(1em + 2px);
left: 0;
z-index: 1;
text-align: center;
line-height: normal;
top: calc((0% - (100% - 1em)) - 8%);
border: 1px solid transparent;
opacity: 0;
}
.pretty.p-icon .state .icon:before {
margin: 0;
width: 100%;
height: 100%;
text-align: center;
display: flex;
flex: 1;
justify-content: center;
align-items: center;
line-height: 1;
}
.pretty.p-icon input:checked ~ .state .icon {
opacity: 1;
}
.pretty.p-icon input:checked ~ .state label:before {
border-color: #5a656b;
}
.pretty.p-svg .state .svg {
position: absolute;
font-size: 1em;
width: calc(1em + 2px);
height: calc(1em + 2px);
left: 0;
z-index: 1;
text-align: center;
line-height: normal;
top: calc((0% - (100% - 1em)) - 8%);
border: 1px solid transparent;
opacity: 0;
}
.pretty.p-svg .state svg {
margin: 0;
width: 100%;
height: 100%;
text-align: center;
display: flex;
flex: 1;
justify-content: center;
align-items: center;
line-height: 1;
}
.pretty.p-svg input:checked ~ .state .svg {
opacity: 1;
}
.pretty.p-image .state img {
opacity: 0;
position: absolute;
width: calc(1em + 2px);
height: calc(1em + 2px);
top: 0;
top: calc((0% - (100% - 1em)) - 8%);
left: 0;
z-index: 0;
text-align: center;
line-height: normal;
transform: scale(0.8);
}
.pretty.p-image input:checked ~ .state img {
opacity: 1;
}
.pretty.p-switch input {
min-width: 2em;
}
.pretty.p-switch .state {
position: relative;
}
.pretty.p-switch .state:before {
content: "";
border: 1px solid #bdc3c7;
border-radius: 60px;
width: 2em;
box-sizing: unset;
height: calc(1em + 2px);
position: absolute;
top: 0;
top: calc((0% - (100% - 1em)) - 16%);
z-index: 0;
transition: all 0.5s ease;
}
.pretty.p-switch .state label {
text-indent: 2.5em;
}
.pretty.p-switch .state label:before, .pretty.p-switch .state label:after {
transition: all 0.5s ease;
border-radius: 100%;
left: 0;
border-color: transparent;
transform: scale(0.8);
}
.pretty.p-switch .state label:after {
background-color: #bdc3c7 !important;
}
.pretty.p-switch input:checked ~ .state:before {
border-color: #5a656b;
}
.pretty.p-switch input:checked ~ .state label:before {
opacity: 0;
}
.pretty.p-switch input:checked ~ .state label:after {
background-color: #5a656b !important;
left: 1em;
}
.pretty.p-switch.p-fill input:checked ~ .state:before {
border-color: #5a656b;
background-color: #5a656b !important;
}
.pretty.p-switch.p-fill input:checked ~ .state label:before {
opacity: 0;
}
.pretty.p-switch.p-fill input:checked ~ .state label:after {
background-color: #fff !important;
left: 1em;
}
.pretty.p-switch.p-slim .state:before {
height: 0.1em;
background: #bdc3c7 !important;
top: calc(50% - 0.1em);
}
.pretty.p-switch.p-slim input:checked ~ .state:before {
border-color: #5a656b;
background-color: #5a656b !important;
}
.pretty.p-has-hover input:hover ~ .state:not(.p-is-hover) {
display: none;
}
.pretty.p-has-hover input:hover ~ .state.p-is-hover {
display: block;
}
.pretty.p-has-hover input:hover ~ .state.p-is-hover .icon {
display: block;
}
.pretty.p-has-focus input:focus ~ .state label:before {
box-shadow: 0px 0px 3px 0px #bdc3c7;
}
.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state:not(.p-is-indeterminate) {
display: none;
}
.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state.p-is-indeterminate {
display: block;
}
.pretty.p-has-indeterminate input[type=checkbox]:indeterminate ~ .state.p-is-indeterminate .icon {
display: block;
opacity: 1;
}
.pretty.p-toggle .state.p-on {
opacity: 0;
display: none;
}
.pretty.p-toggle .state.p-off,
.pretty.p-toggle .state .icon,
.pretty.p-toggle .state .svg,
.pretty.p-toggle .state img {
opacity: 1;
display: inherit;
}
.pretty.p-toggle .state.p-off .icon {
color: #bdc3c7;
}
.pretty.p-toggle input:checked ~ .state.p-on {
opacity: 1;
display: inherit;
}
.pretty.p-toggle input:checked ~ .state.p-off {
opacity: 0;
display: none;
}
.pretty.p-plain input:checked ~ .state label:before, .pretty.p-plain.p-toggle .state label:before {
content: none;
}
.pretty.p-plain.p-plain .icon {
transform: scale(1.1);
}
.pretty.p-round .state label:before, .pretty.p-round .state label:after {
border-radius: 100%;
}
.pretty.p-round.p-icon .state .icon {
border-radius: 100%;
overflow: hidden;
}
.pretty.p-round.p-icon .state .icon:before {
transform: scale(0.8);
}
.pretty.p-curve .state label:before, .pretty.p-curve .state label:after {
border-radius: 20%;
}
.pretty.p-smooth label:before,
.pretty.p-smooth label:after,
.pretty.p-smooth .icon,
.pretty.p-smooth .svg {
transition: all 0.5s ease;
}
.pretty.p-smooth input:checked + .state label:after {
transition: all 0.3s ease;
}
.pretty.p-smooth input:checked + .state .icon,
.pretty.p-smooth input:checked + .state .svg,
.pretty.p-smooth input:checked + .state img {
-webkit-animation: zoom 0.2s ease;
animation: zoom 0.2s ease;
}
.pretty.p-smooth.p-default input:checked + .state label:after {
-webkit-animation: zoom 0.2s ease;
animation: zoom 0.2s ease;
}
.pretty.p-smooth.p-plain input:checked + .state label:before {
content: "";
transform: scale(0);
transition: all 0.5s ease;
}
.pretty.p-tada:not(.p-default) input:checked + .state .icon,
.pretty.p-tada:not(.p-default) input:checked + .state .svg,
.pretty.p-tada:not(.p-default) input:checked + .state img,
.pretty.p-tada:not(.p-default) input:checked + .state label:before,
.pretty.p-tada:not(.p-default) input:checked + .state label:after {
-webkit-animation: tada 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 alternate;
animation: tada 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 alternate;
opacity: 1;
}
.pretty.p-jelly:not(.p-default) input:checked + .state .icon,
.pretty.p-jelly:not(.p-default) input:checked + .state .svg,
.pretty.p-jelly:not(.p-default) input:checked + .state img,
.pretty.p-jelly:not(.p-default) input:checked + .state label:before,
.pretty.p-jelly:not(.p-default) input:checked + .state label:after {
-webkit-animation: jelly 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
animation: jelly 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
opacity: 1;
}
.pretty.p-jelly:not(.p-default) input:checked + .state label:before {
border-color: transparent;
}
.pretty.p-rotate:not(.p-default) input:checked ~ .state .icon,
.pretty.p-rotate:not(.p-default) input:checked ~ .state .svg,
.pretty.p-rotate:not(.p-default) input:checked ~ .state img,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:after {
-webkit-animation: rotate 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
animation: rotate 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
opacity: 1;
}
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before {
border-color: transparent;
}
.pretty.p-pulse:not(.p-switch) input:checked ~ .state label:before {
-webkit-animation: pulse 1s;
animation: pulse 1s;
}
.pretty input[disabled] {
cursor: not-allowed;
display: none;
}
.pretty input[disabled] ~ * {
opacity: 0.5;
}
.pretty.p-locked input {
display: none;
cursor: not-allowed;
}
.pretty input:checked ~ .state.p-primary label:after, .pretty.p-toggle .state.p-primary label:after {
background-color: #428bca !important;
}
.pretty input:checked ~ .state.p-primary .icon,
.pretty input:checked ~ .state.p-primary .svg, .pretty.p-toggle .state.p-primary .icon,
.pretty.p-toggle .state.p-primary .svg {
color: #fff;
stroke: #fff;
}
.pretty input:checked ~ .state.p-primary-o label:before, .pretty.p-toggle .state.p-primary-o label:before {
border-color: #428bca;
}
.pretty input:checked ~ .state.p-primary-o label:after, .pretty.p-toggle .state.p-primary-o label:after {
background-color: transparent;
}
.pretty input:checked ~ .state.p-primary-o .icon,
.pretty input:checked ~ .state.p-primary-o .svg,
.pretty input:checked ~ .state.p-primary-o svg, .pretty.p-toggle .state.p-primary-o .icon,
.pretty.p-toggle .state.p-primary-o .svg,
.pretty.p-toggle .state.p-primary-o svg {
color: #428bca;
stroke: #428bca;
}
.pretty.p-default:not(.p-fill) input:checked ~ .state.p-primary-o label:after {
background-color: #428bca !important;
}
.pretty.p-switch input:checked ~ .state.p-primary:before {
border-color: #428bca;
}
.pretty.p-switch.p-fill input:checked ~ .state.p-primary:before {
background-color: #428bca !important;
}
.pretty.p-switch.p-slim input:checked ~ .state.p-primary:before {
border-color: #245682;
background-color: #245682 !important;
}
.pretty input:checked ~ .state.p-info label:after, .pretty.p-toggle .state.p-info label:after {
background-color: #5bc0de !important;
}
.pretty input:checked ~ .state.p-info .icon,
.pretty input:checked ~ .state.p-info .svg, .pretty.p-toggle .state.p-info .icon,
.pretty.p-toggle .state.p-info .svg {
color: #fff;
stroke: #fff;
}
.pretty input:checked ~ .state.p-info-o label:before, .pretty.p-toggle .state.p-info-o label:before {
border-color: #5bc0de;
}
.pretty input:checked ~ .state.p-info-o label:after, .pretty.p-toggle .state.p-info-o label:after {
background-color: transparent;
}
.pretty input:checked ~ .state.p-info-o .icon,
.pretty input:checked ~ .state.p-info-o .svg,
.pretty input:checked ~ .state.p-info-o svg, .pretty.p-toggle .state.p-info-o .icon,
.pretty.p-toggle .state.p-info-o .svg,
.pretty.p-toggle .state.p-info-o svg {
color: #5bc0de;
stroke: #5bc0de;
}
.pretty.p-default:not(.p-fill) input:checked ~ .state.p-info-o label:after {
background-color: #5bc0de !important;
}
.pretty.p-switch input:checked ~ .state.p-info:before {
border-color: #5bc0de;
}
.pretty.p-switch.p-fill input:checked ~ .state.p-info:before {
background-color: #5bc0de !important;
}
.pretty.p-switch.p-slim input:checked ~ .state.p-info:before {
border-color: #2390b0;
background-color: #2390b0 !important;
}
.pretty input:checked ~ .state.p-success label:after, .pretty.p-toggle .state.p-success label:after {
background-color: #5cb85c !important;
}
.pretty input:checked ~ .state.p-success .icon,
.pretty input:checked ~ .state.p-success .svg, .pretty.p-toggle .state.p-success .icon,
.pretty.p-toggle .state.p-success .svg {
color: #fff;
stroke: #fff;
}
.pretty input:checked ~ .state.p-success-o label:before, .pretty.p-toggle .state.p-success-o label:before {
border-color: #5cb85c;
}
.pretty input:checked ~ .state.p-success-o label:after, .pretty.p-toggle .state.p-success-o label:after {
background-color: transparent;
}
.pretty input:checked ~ .state.p-success-o .icon,
.pretty input:checked ~ .state.p-success-o .svg,
.pretty input:checked ~ .state.p-success-o svg, .pretty.p-toggle .state.p-success-o .icon,
.pretty.p-toggle .state.p-success-o .svg,
.pretty.p-toggle .state.p-success-o svg {
color: #5cb85c;
stroke: #5cb85c;
}
.pretty.p-default:not(.p-fill) input:checked ~ .state.p-success-o label:after {
background-color: #5cb85c !important;
}
.pretty.p-switch input:checked ~ .state.p-success:before {
border-color: #5cb85c;
}
.pretty.p-switch.p-fill input:checked ~ .state.p-success:before {
background-color: #5cb85c !important;
}
.pretty.p-switch.p-slim input:checked ~ .state.p-success:before {
border-color: #357935;
background-color: #357935 !important;
}
.pretty input:checked ~ .state.p-warning label:after, .pretty.p-toggle .state.p-warning label:after {
background-color: #f0ad4e !important;
}
.pretty input:checked ~ .state.p-warning .icon,
.pretty input:checked ~ .state.p-warning .svg, .pretty.p-toggle .state.p-warning .icon,
.pretty.p-toggle .state.p-warning .svg {
color: #fff;
stroke: #fff;
}
.pretty input:checked ~ .state.p-warning-o label:before, .pretty.p-toggle .state.p-warning-o label:before {
border-color: #f0ad4e;
}
.pretty input:checked ~ .state.p-warning-o label:after, .pretty.p-toggle .state.p-warning-o label:after {
background-color: transparent;
}
.pretty input:checked ~ .state.p-warning-o .icon,
.pretty input:checked ~ .state.p-warning-o .svg,
.pretty input:checked ~ .state.p-warning-o svg, .pretty.p-toggle .state.p-warning-o .icon,
.pretty.p-toggle .state.p-warning-o .svg,
.pretty.p-toggle .state.p-warning-o svg {
color: #f0ad4e;
stroke: #f0ad4e;
}
.pretty.p-default:not(.p-fill) input:checked ~ .state.p-warning-o label:after {
background-color: #f0ad4e !important;
}
.pretty.p-switch input:checked ~ .state.p-warning:before {
border-color: #f0ad4e;
}
.pretty.p-switch.p-fill input:checked ~ .state.p-warning:before {
background-color: #f0ad4e !important;
}
.pretty.p-switch.p-slim input:checked ~ .state.p-warning:before {
border-color: #c77c11;
background-color: #c77c11 !important;
}
.pretty input:checked ~ .state.p-danger label:after, .pretty.p-toggle .state.p-danger label:after {
background-color: #d9534f !important;
}
.pretty input:checked ~ .state.p-danger .icon,
.pretty input:checked ~ .state.p-danger .svg, .pretty.p-toggle .state.p-danger .icon,
.pretty.p-toggle .state.p-danger .svg {
color: #fff;
stroke: #fff;
}
.pretty input:checked ~ .state.p-danger-o label:before, .pretty.p-toggle .state.p-danger-o label:before {
border-color: #d9534f;
}
.pretty input:checked ~ .state.p-danger-o label:after, .pretty.p-toggle .state.p-danger-o label:after {
background-color: transparent;
}
.pretty input:checked ~ .state.p-danger-o .icon,
.pretty input:checked ~ .state.p-danger-o .svg,
.pretty input:checked ~ .state.p-danger-o svg, .pretty.p-toggle .state.p-danger-o .icon,
.pretty.p-toggle .state.p-danger-o .svg,
.pretty.p-toggle .state.p-danger-o svg {
color: #d9534f;
stroke: #d9534f;
}
.pretty.p-default:not(.p-fill) input:checked ~ .state.p-danger-o label:after {
background-color: #d9534f !important;
}
.pretty.p-switch input:checked ~ .state.p-danger:before {
border-color: #d9534f;
}
.pretty.p-switch.p-fill input:checked ~ .state.p-danger:before {
background-color: #d9534f !important;
}
.pretty.p-switch.p-slim input:checked ~ .state.p-danger:before {
border-color: #a02622;
background-color: #a02622 !important;
}
.pretty.p-bigger label:before,
.pretty.p-bigger label:after,
.pretty.p-bigger .icon,
.pretty.p-bigger .svg,
.pretty.p-bigger .img {
font-size: 1.2em !important;
top: calc((0% - (100% - 1em)) - 35%) !important;
}
.pretty.p-bigger label {
text-indent: 1.7em;
}
@media print {
.pretty .state:before,
.pretty .state label:before,
.pretty .state label:after,
.pretty .state .icon {
color-adjust: exact;
/* stylelint-disable */
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
}
.glide {
position: relative;
width: 100%;
box-sizing: border-box;
}
.glide * {
box-sizing: inherit;
}
.glide__track {
overflow: hidden;
}
.glide__slides {
position: relative;
width: 100%;
list-style: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform-style: preserve-3d;
touch-action: pan-Y;
overflow: hidden;
padding: 0;
white-space: nowrap;
display: flex;
flex-wrap: nowrap;
will-change: transform;
}
.glide__slides--dragging {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.glide__slide {
width: 100%;
height: 100%;
flex-shrink: 0;
white-space: normal;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-webkit-tap-highlight-color: transparent;
}
.glide__slide a {
-webkit-user-select: none;
user-select: none;
-webkit-user-drag: none;
-moz-user-select: none;
-ms-user-select: none;
}
.glide__arrows {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.glide__bullets {
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.glide--rtl {
direction: rtl;
}
.glide__arrow {
position: absolute;
display: block;
top: 50%;
z-index: 2;
color: white;
text-transform: uppercase;
padding: 9px 12px;
background-color: transparent;
border: 2px solid rgba(255, 255, 255, 0.5);
border-radius: 4px;
box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
text-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.1);
opacity: 1;
cursor: pointer;
transition: opacity 150ms ease, border 300ms ease-in-out;
transform: translateY(-50%);
line-height: 1;
}
.glide__arrow:focus {
outline: none;
}
.glide__arrow:hover {
border-color: white;
}
.glide__arrow--left {
left: 2em;
}
.glide__arrow--right {
right: 2em;
}
.glide__arrow--disabled {
opacity: 0.33;
}
.glide__bullets {
position: absolute;
z-index: 2;
bottom: 2em;
left: 50%;
display: inline-flex;
list-style: none;
transform: translateX(-50%);
}
.glide__bullet {
background-color: rgba(255, 255, 255, 0.5);
width: 9px;
height: 9px;
padding: 0;
border-radius: 50%;
border: 2px solid transparent;
transition: all 300ms ease-in-out;
cursor: pointer;
line-height: 0;
box-shadow: 0 0.25em 0.5em 0 rgba(0, 0, 0, 0.1);
margin: 0 0.25em;
}
.glide__bullet:focus {
outline: none;
}
.glide__bullet:hover, .glide__bullet:focus {
border: 2px solid white;
background-color: rgba(255, 255, 255, 0.5);
}
.glide__bullet--active {
background-color: white;
}
.glide--swipeable {
cursor: grab;
cursor: -webkit-grab;
}
.glide--dragging {
cursor: grabbing;
cursor: -webkit-grabbing;
}
/* breakpoints */
/* ====== RESPONSIVE MIXINS ====== */
/* apply a natural box layout model to all elements, but allowing components to change */
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
h1 {
color: #cdcdcd;
font-size: 1.5em;
line-height: 1.2;
margin: 0 0 1em;
text-align: center;
}
@media screen and (min-width: 768px) {
h1 {
font-size: 2.25em;
line-height: 1.2;
text-align: left;
}
}
h2 {
color: #cdcdcd;
font-size: 1.625em;
margin: 0.5em 0 0.25em;
}
@media screen and (min-width: 768px) {
h2 {
margin: 1em 0 0.5em;
}
}
h3 {
color: white;
font-size: 1.125em;
margin: 0 0 0.5em 0;
}
h4 {
color: #999D9C;
font-size: 0.875em;
}
strong {
font-weight: 600;
}
a {
color: #2E608E;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.btn {
color: #fff;
background: #2E608E;
border-radius: 5px;
display: inline-block;
font-size: 1em;
padding: 0.5em 2em;
text-decoration: none;
cursor: pointer;
transition: all 0.25s ease;
}
.btn:hover {
background-color: #224667;
text-decoration: none;
}
.btn.with-icon {
padding-left: 1.75em;
}
.btn--small {
font-size: 0.75em;
}
.btn--secondary {
background-color: #1a1a1a;
}
.btn--secondary:hover {
background-color: #010101;
}
.btn.disabled {
opacity: 0.7;
}
.btn--orange {
background-color: #ED9E61;
color: #1a1a1a;
}
.btn--orange:hover {
background-color: #e88233;
}
.btn--green {
background-color: #72DFA4;
color: #1a1a1a;
}
.btn--lavender {
background-color: #B07FD7;
color: #1a1a1a;
}
.menu-wrapper {
position: absolute;
top: 1em;
right: 1em;
margin: auto;
width: 30px;
height: 19px;
cursor: pointer;
z-index: 10;
}
@media screen and (min-width: 992px) {
.menu-wrapper {
display: none;
}
}
.hamburger-menu,
.hamburger-menu:after,
.hamburger-menu:before {
width: 30px;
height: 3px;
}
.hamburger-menu {
position: relative;
transform: translateY(8px);
background: #cdcdcd;
transition: all 0ms 200ms;
}
.hamburger-menu.animate {
background: rgba(205, 205, 205, 0);
}
.hamburger-menu:before {
content: "";
position: absolute;
left: 0;
bottom: 8px;
background: #cdcdcd;
transition: bottom 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.hamburger-menu:after {
content: "";
position: absolute;
left: 0;
top: 8px;
background: #cdcdcd;
transition: top 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.hamburger-menu.animate:after {
top: 0;
transform: rotate(45deg);
transition: top 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.hamburger-menu.animate:before {
bottom: 0;
transform: rotate(-45deg);
transition: bottom 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.aria-autocomplete__wrapper {
position: relative;
font-size: 16px;
}
.aria-autocomplete--hide {
display: none !important;
}
.aria-autocomplete__sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.aria-autocomplete__input {
border: 1px solid #606060;
width: 100%;
min-height: 44px;
padding: 6px 10px;
border-radius: 2px;
box-sizing: border-box;
font-family: inherit;
font-size: 14px;
}
.aria-autocomplete__input--disabled {
background-color: #ebebeb;
cursor: not-allowed;
}
.aria-autocomplete__show-all {
position: absolute;
top: 0;
right: 0;
width: 44px;
height: 44px;
border: 1px solid #606060;
background-repeat: no-repeat;
background-position: center center;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='17' height='10' viewBox='0 0 17 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.023L8.488 8 16 1' stroke-width='1' stroke='%23434143' fill='none' fill-rule='evenodd'/%3E%3C/svg%3E");
box-sizing: border-box;
}
.aria-autocomplete__show-all--disabled {
background-color: #ebebeb;
cursor: not-allowed;
}
.aria-autocomplete__list {
list-style: none;
position: absolute;
top: 48px;
z-index: 99999;
left: 0;
margin: 0;
padding: 3px 0 !important;
height: auto;
min-height: 0;
max-height: 304px;
overflow-y: auto;
overflow-x: hidden;
width: 100%;
background: #232323;
border: 1px solid #606060;
border-radius: 2px;
font-size: 1em;
box-sizing: border-box;
box-shadow: none;
}
.aria-autocomplete__list--has-results[aria-label]:before {
content: attr(aria-label) !important;
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 3px 10px 0;
font-size: 13px;
text-align: right;
opacity: 0.5;
box-sizing: border-box;
}
@media reader, speech, aural {
.aria-autocomplete__list--has-results[aria-label]:before {
display: none;
}
}
.aria-autocomplete__list--has-results[aria-label] li:first-child {
margin-top: 20px;
}
.aria-autocomplete__option {
display: block;
color: #999D9C;
text-decoration: none;
font-weight: normal;
list-style: none;
cursor: pointer;
padding: 7px 10px;
word-break: break-word;
}
.aria-autocomplete__option:focus {
border: none;
outline: none;
box-shadow: none;
}
.aria-autocomplete__option:hover,
.aria-autocomplete__option--focused {
background: #f3f3f3;
color: #000;
border: none;
margin: 0;
font-weight: normal;
text-decoration: underline;
cursor: pointer;
}
.aria-autocomplete__option--no-results {
margin-top: 0 !important;
opacity: 0.65 !important;
cursor: not-allowed !important;
text-decoration: none !important;
background: transparent !important;
color: #434143 !important;
}
.aria-autocomplete__selected {
position: relative;
display: inline-flex;
align-items: center;
background: #606060;
border: 1px solid #606060;
padding: 0 28px 0 10px;
margin: 2px 4px 2px 0;
font-size: 13px;
color: #f3f3f3;
border-radius: 20px;
word-break: break-word;
cursor: pointer;
}
.aria-autocomplete__selected--disabled {
opacity: 0.7;
}
.aria-autocomplete__selected:hover,
.aria-autocomplete__selected:focus {
background: #474747;
color: #fff;
}
.aria-autocomplete__selected:after {
content: "";
position: absolute;
top: 50%;
right: 5px;
width: 20px;
height: 20px;
background-repeat: no-repeat;
background-position: center center;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='10' height='10' viewBox='0 0 10 10' version='1.1'%3E%3Cg id='surface1'%3E%3Cpath d='M 0.234375 10 L 5 5.21875 L 9.765625 10 L 9.988281 9.78125 L 5.21875 5 L 9.988281 0.21875 L 9.765625 0 L 5 4.78125 L 0.234375 0 L 0.0117188 0.21875 L 4.78125 5 L 0.0117188 9.78125 Z M 0.234375 10 ' style='stroke:%23ffffff;fill-rule:nonzero;fill:%23ffffff;fill-opacity:1;'/%3E%3C/g%3E%3C/svg%3E");
transform: translateY(-50%);
}
@media speech {
.aria-autocomplete__selected:after {
display: none;
}
}
.aria-autocomplete__selected--delete-all {
border-color: #db0000;
background: #db0000;
color: #fff;
}
.aria-autocomplete__selected--delete-all:hover,
.aria-autocomplete__selected--delete-all:focus {
background: #a80000;
}
.aria-autocomplete__wrapper--multiple .aria-autocomplete__input {
margin-bottom: 5px;
}
.aria-autocomplete__wrapper--show-all,
.aria-autocomplete__wrapper--autogrow.aria-autocomplete__wrapper--multiple.aria-autocomplete__wrapper--show-all {
padding-right: 43px;
}
.aria-autocomplete__wrapper--loading:after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 24px;
height: 24px;
margin: 10px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.25);
border: 2px solid #606060;
border-color: #606060 transparent #606060 transparent;
box-sizing: border-box;
-webkit-animation: lds-dual-ring 1.2s linear infinite;
animation: lds-dual-ring 1.2s linear infinite;
}
.aria-autocomplete__wrapper--loading .aria-autocomplete__show-all {
background-image: none;
}
.aria-autocomplete__wrapper--loading.aria-autocomplete__wrapper--autogrow:after {
top: 50%;
margin-top: -12px;
}
.aria-autocomplete__wrapper--autogrow {
display: flex;
flex-wrap: wrap;
align-items: center;
border: 1px solid #606060;
width: 100%;
min-height: 44px;
padding: 6px 10px;
border-radius: 2px;
box-sizing: border-box;
}
.aria-autocomplete__wrapper--autogrow.aria-autocomplete__wrapper--disabled {
background-color: #ebebeb;
cursor: not-allowed;
}
.aria-autocomplete__wrapper--autogrow .aria-autocomplete__show-all {
order: 3;
height: 100%;
border-top: none;
border-right: none;
border-bottom: none;
}
.aria-autocomplete__wrapper--autogrow .aria-autocomplete__input {
max-width: 100% !important;
max-height: none !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
line-height: inherit !important;
text-indent: 0 !important;
background: none !important;
border: 0 none !important;
outline: 0 !important;
box-shadow: none !important;
-webkit-user-select: auto !important;
height: 26px;
width: 1px;
order: 2;
}
.aria-autocomplete__wrapper--autogrow .aria-autocomplete__list {
width: calc(100% + 2px);
top: calc(100% + 4px);
left: -1px;
}
.aria-autocomplete__wrapper--autogrow .aria-autocomplete__selected {
order: 1;
}
@-webkit-keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
header {
background: url("../img/header-repeat.jpg") bottom right repeat-x;
padding: 0.5em 0;
position: relative;
}
@media screen and (min-width: 576px) {
header {
padding: 2em 0;
}
header:before {
background: url("../img/gtas_header.jpg") bottom left no-repeat;
background-size: auto 100%;
display: block;
content: "";
width: 100%;
max-width: 1000px;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
}
header:after {
background: #2e608e;
background: linear-gradient(81deg, rgba(46, 96, 142, 0) 0%, black 100%);
display: block;
content: "";
width: 100%;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
z-index: 2;
}
}
@media screen and (min-width: 576px) and (min-width: 992px) {
header:after {
display: none;
}
}
header .container {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
position: relative;
padding-bottom: 1em;
z-index: 2;
}
@media screen and (min-width: 992px) {
header .container {
align-items: flex-end;
flex-direction: row;
justify-content: flex-start;
padding-bottom: 0;
}
}
header .logo img {
max-width: 250px;
transform: translateY(2px);
}
@media screen and (min-width: 992px) {
header .logo img {
max-width: 350px;
transform: translateY(10px);
}
}
header .login-logout {
position: relative;
top: 0;
margin-left: auto;
}
@media screen and (min-width: 992px) {
header .login-logout {
margin-left: auto;
align-self: flex-start;
}
}
@media screen and (min-width: 992px) {
header {
height: 141px;
padding: 1em 0;
}
}
.menu {
background: #232323;
position: absolute;
/*transform: translateX(110vw);*/
transition-delay: 0.1s;
transition: all 0.35s ease;
top: 0;
left: 0;
height: 0vh;
z-index: 15;
width: 100%;
overflow: hidden;
}
@media screen and (min-width: 992px) {
.menu {
background: #2e608e;
background: linear-gradient(180deg, #2e608e 24%, #193a59 100%);
height: auto;
position: relative;
top: auto;
left: auto;
overflow: visible;
font-size: 1em;
border-bottom: 1px solid black;
}
}
.menu .container {
display: flex;
justify-content: flex-start;
flex-direction: column;
padding: 0;
}
@media screen and (min-width: 992px) {
.menu .container {
padding: 0 1em;
justify-content: flex-start;
}
}
.menu nav {
margin: 0 auto;
width: 100%;
}
@media screen and (min-width: 992px) {
.menu nav {
margin: 0;
padding: 0;
width: auto;
}
}
.menu ul {
padding: 0 0 0 1.5em;
margin: 0 auto;
width: 100%;
}
@media screen and (min-width: 992px) {
.menu ul {
font-size: 0;
}
}
.menu ul li {
background: transparent;
font-size: 20px;
line-height: 1.75em;
text-align: left;
/*text-shadow: 0 1px 1px #4d4d4d;*/
margin: 0 0 1px;
font-family: "Rubik", sans-serif;
position: relative;
}
.menu ul li.home {
display: none;
}
.menu ul li h3 {
font-weight: bold;
margin-bottom: 0;
}
@media screen and (min-width: 992px) {
.menu ul li {
padding-top: 2px;
border-right: 1px solid black;
font-size: 14px;
margin: 0;
display: inline-block;
}
.menu ul li:last-of-type {
margin: 0;
border-right: 0;
}
.menu ul li:hover, .menu ul li.active {
background: #1a1a1a;
}
.menu ul li.home {
display: inline-block;
}
}
@media screen and (min-width: 992px) {
.menu ul li:last-of-type {
margin: 0;
border-right: 1px solid black;
}
.menu ul li:first-of-type {
border-left: 1px solid black;
}
}
.menu ul li a {
text-transform: uppercase;
display: block;
color: #AAA;
margin: 0;
padding: 0;
text-decoration: none;
}
.menu ul li a:hover, .menu ul li a.active {
color: #999D9C;
}
@media screen and (min-width: 992px) {
.menu ul li a {
padding: 0 1.45em;
text-transform: none;
color: white;
}
.menu ul li a:hover {
color: white;
}
}
@media screen and (min-width: 992px) {
.menu ul li a {
padding: 0 1.65em;
}
}
.menu ul li a:hover {
/*text-decoration: underline;*/
}
.menu ul li a.active {
font-weight: 700;
}
@media screen and (min-width: 768px) {
.menu ul li a.active {
font-weight: normal;
}
}
.menu ul li ul.submenu {
font-size: 16px;
margin: 0;
}
@media screen and (min-width: 992px) {
.menu ul li ul.submenu {
background: #1a1a1a;
border: 1px solid black;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
padding: 1em;
text-align: left;
display: none;
position: absolute;
top: calc(100% - 1px);
left: -1px;
right: 0;
width: 600%;
}
}
.menu ul li ul.submenu li {
padding: 0;
margin: 0;
font-size: 14px;
border: 0;
}
@media screen and (min-width: 992px) {
.menu ul li ul.submenu li {
margin-right: 2em;
}
.menu ul li ul.submenu li:last-of-type {
margin-right: 0;
}
}
.menu ul li ul.submenu li:first-of-type {
border: 0;
}
.menu ul li ul.submenu li:last-of-type {
margin: 0;
border-right: 0;
}
.menu ul li ul.submenu li a {
padding: 0;
text-transform: none;
}
.menu ul li ul.submenu li a:hover {
color: #2E70AC;
}
.menu ul li ul.submenu li.indent a {
margin-left: 1em;
}
.menu ul li ul.submenu li:hover {
background: none;
}
.menu ul li ul.submenu li.space-above {
margin-left: 0.75em;
}
.menu ul li ul.submenu li ul.third-menu {
padding-left: 10px;
width: 100%;
}
@media screen and (min-width: 992px) {
.menu ul li ul.submenu li ul.third-menu {
display: block;
}
}
.menu ul li ul.submenu li ul.third-menu li {
display: block;
text-align: left;
}
.menu ul li:hover ul.submenu {
display: block;
}
.menu .mobile-logo {
margin: 20px auto;
}
@media screen and (min-width: 992px) {
.menu .mobile-logo {
display: none;
}
}
.menu .mobile-logo img {
max-width: 200px;
}
body.menu-active {
overflow-y: hidden;
}
body.menu-active .menu {
height: 100vh;
}
body.menu-active .menu .container {
height: 100vh;
}
body.menu-active header:after {
z-index: 0;
}
ul.main-menu {
display: none;
justify-content: flex-end;
height: 100%;
margin: 0 0 1em 0;
width: 100%;
align-items: flex-end;
}
@media screen and (min-width: 992px) {
ul.main-menu {
display: flex;
}
}
ul.main-menu li {
border-left: 1px solid #999D9C;
display: inline-block;
padding-left: 1em;
margin: 0 0 0 1em;
}
ul.main-menu li:first-of-type {
border-left: 0;
}
ul.main-menu li a {
color: white;
}
ul.main-menu li a:hover, ul.main-menu li a.active {
text-decoration: none;
color: #2E70AC;
}
html {
font-size: "16px";
}
body {
background: #232323;
font-family: "Rubik", sans-serif;
font-weight: 400;
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
position: relative;
flex: 1;
}
.container {
margin: 0 auto;
max-width: 1367px;
padding: 0 1.5em;
}
.container--flex {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.container--flex .half-page {
display: flex;
flex-direction: column;
width: 100%;
margin: 10px;
}
@media screen and (min-width: 992px) {
.container--flex .half-page {
width: 48%;
}
}
.loadingScreen {
display: flex;
flex-direction: column;
height: 600px;
justify-content: flex-start;
align-content: center;
padding: 0 2em;
}
.loadingScreen img {
align-self: center;
max-width: 350px;
}
@media screen and (min-width: 768px) {
.loadingScreen {
padding: 0 1em;
}
}
.box {
background: #1a1a1a;
padding: 2em 1em;
position: relative;
margin: 2em auto 0;
}
.box.box-40 {
width: 40%;
}
.box.box-50 {
width: 50%;
}
.box.box-60 {
width: 60%;
}
.box.box-70 {
width: 70%;
}
.box.box-80 {
width: 80%;
}
.box:before {
background: #2E608E;
content: "";
display: block;
height: 5px;
width: 100%;
position: absolute;
top: -5px;
left: 0;
right: 0;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
z-index: 10;
}
.box h1 {
margin-bottom: 0.25em;
}
.box .row {
display: flex;
color: #999D9C;
flex-direction: row;
justify-content: space-evenly;
margin: 1em 0;
}
.box .row .col {
display: flex;
flex-direction: column;
width: 100%;
}
.box .row .col.col-50 {
width: 45%;
}
.box .row .col.col-70 {
width: 65%;
}
.box .row .col.col-full {
padding: 0 1.5em;
}
.box .row label {
color: #999D9C;
display: block;
margin: 0 0 0.5em;
}
.box .row label .required {
color: darkred;
}
.box .row input {
background: #232323;
border: 1px solid #2E70AC;
border-radius: 5px;
padding: 0.5em 1em;
color: #999D9C;
}
.box .row textarea {
background: #232323;
border: 1px solid #2E70AC;
border-radius: 5px;
padding: 0.5em 1em;
color: #999D9C;
min-height: 200px;
width: 100%;
}
.box .row button {
border-color: #2E608E;
}
.box .row .form-check {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.box .row .form-check .form-check-input {
margin-top: 0;
padding-top: 0;
}
.box .row .form-check .form-check-label {
margin-bottom: 0;
line-height: 14px;
margin-left: 0.25em;
}
.box .row .form-actions {
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.box .row .form-actions button {
align-self: flex-end;
}
.box .row .form-actions a {
align-self: flex-end;
display: block;
margin: 10px 0 0;
}
.invalid-feedback {
margin: 10px;
font-size: 12px;
color: #8d2828;
}
footer {
background: #1a1a1a;
margin: 2em 0 0;
padding: 0.75em 0;
font-size: 14px;
width: 100%;
text-align: left;
color: #fff;
}
footer .container {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
@media screen and (min-width: 768px) {
footer .container {
flex-direction: row;
}
}
footer span {
display: inline-block;
margin: 0.25em 0;
}
@media screen and (min-width: 768px) {
footer span {
margin: 0;
}
}
.pagination {
text-align: right;
margin: 0 0 1em 0;
}
.pagination li {
display: inline-block;
margin: 0 2px;
}
.pagination li a {
color: #999D9C;
font-size: 14px;
border-radius: 5px;
padding: 0 0.465em;
display: inline-block;
transition: all 1s ease;
text-decoration: none;
}
.pagination li a:hover {
background: #2E70AC;
color: white;
}
.pagination li .sr-only {
display: none;
}
.pagination li.active a {
background: #2E70AC;
color: white;
}
.pagination li.pagination-next-nav .page-link {
color: #2E70AC;
}
.homepage-block {
padding: 2em 1em 0;
overflow: visible;
max-width: 1367px;
margin: 0 auto;
}
.homepage-block .heading {
margin: 0 auto 1em;
text-align: center;
}
.homepage-block .heading h2 {
margin-bottom: 0;
}
.homepage-block .heading a {
display: inline-block;
margin: 0.5em 0 0;
}
.playlists-block {
padding: 2em 1em 0;
overflow: visible;
max-width: 1367px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
}
.playlists-block .playlists {
display: flex;
flex-direction: column;
align-items: center;
padding: 2em 0;
}
.playlists-block .controls {
margin: 1em 0;
}
@media screen and (min-width: 768px) {
.playlists-block .controls {
align-self: flex-end;
}
}
.video-results-list {
padding: 1em 0;
display: flex;
flex-direction: column;
/*@include medium() {
display: grid;
grid-auto-rows: min-content;
gap: 2% 2%;
grid-template-columns: 1fr 1fr;
grid-template-areas:
". . "
". . ";
.card {
}
}
@include xxlarge() {
grid-template-columns: 1fr 1fr 1fr;
grid-template-areas:
". . ."
". . ."
". . .";
}*/
}
@media screen and (min-width: 768px) {
.video-results-list .card {
max-width: none;
width: 100%;
flex-direction: row;
}
}
@media screen and (min-width: 1440px) {
.video-results-list.full {
justify-content: center;
}
.video-results-list.full .card {
max-width: 1280px;
margin-left: auto;
margin-right: auto;
}
}
.full-page {
width: 100%;
}
.notifications {
background: #1a1a1a;
max-width: 900px;
margin: 1em auto;
padding: 1.25em 1em;
text-align: left;
position: relative;
width: 100%;
}
.notifications:before {
background: #2E608E;
content: "";
display: block;
height: 5px;
width: 100%;
position: absolute;
top: -5px;
left: 0;
right: 0;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
z-index: 10;
}
.notifications .notification {
display: inline-block;
color: white;
font-size: 0.875em;
margin: 0 0 0.5em;
width: 100%;
}
.notifications .notification span {
color: #999D9C;
display: block;
}
.horizontal.alphanav {
flex-wrap: wrap !important;
}
.videos-list {
color: #fff;
font-size: 1em;
line-height: 1.375em;
padding: 1em 0 0;
}
@media screen and (min-width: 992px) {
.videos-list {
padding: 2em 0 0;
}
}
.videos-list .videos-app {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-bottom: 1em;
}
@media screen and (min-width: 992px) {
.videos-list .videos-app {
flex-direction: row;
}
}
.videos-list .videos-app .showHideFilters {
text-align: center;
border: 0;
}
@media screen and (min-width: 992px) {
.videos-list .videos-app .showHideFilters {
display: none;
}
}
.videos-list .videos-app .showHideFilters i {
margin-right: 5px;
display: inline-block;
font-size: 14px;
}
.videos-list .videos-app .videos-filter {
background: #1a1a1a;
padding: 0 1em;
position: relative;
width: 100%;
order: 1;
max-height: 1px;
overflow: hidden;
transition: max-height 0.6s ease;
}
.videos-list .videos-app .videos-filter.active {
max-height: none;
padding-top: 2em;
}
@media screen and (min-width: 992px) {
.videos-list .videos-app .videos-filter {
max-height: none;
order: 1;
width: 30%;
overflow: visible;
padding-top: 1em;
}
}
.videos-list .videos-app .videos-filter:before {
background: #2E608E;
content: "";
display: block;
height: 5px;
width: 100%;
position: absolute;
top: -5px;
left: 0;
right: 0;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
z-index: 10;
}
.videos-list .videos-app .videos-filter h4 {
color: #cdcdcd;
font-size: 1em;
margin: 0 0 0.5em 0;
}
.videos-list .videos-app .videos-filter .filter {
color: #999D9C;
margin: 0 0 1em 0;
}
.videos-list .videos-app .videos-filter .filter .v-select-option {
color: #1a1a1a;
}
.videos-list .videos-app .videos-filter .filter .horizontal input {
display: none;
}
.videos-list .videos-app .videos-filter .filter label.game_vice-city,
.videos-list .videos-app .videos-filter .filter label.game_san-andreas {
display: inline-block;
position: relative;
width: 60px;
height: 60px;
}
.videos-list .videos-app .videos-filter .filter label.game_vice-city:before,
.videos-list .videos-app .videos-filter .filter label.game_san-andreas:before {
content: "";
border-radius: 5px;
display: block;
height: 100%;
width: 100%;
z-index: 1;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.videos-list .videos-app .videos-filter .filter label.game_vice-city .inner,
.videos-list .videos-app .videos-filter .filter label.game_san-andreas .inner {
display: block;
position: absolute;
top: 5px;
left: 5px;
width: 50px;
height: 50px;
background-size: contain;
background-repeat: no-repeat;
z-index: 2;
filter: grayscale(70%);
}
.videos-list .videos-app .videos-filter .filter input[type=checkbox]:checked + label .inner {
filter: none;
}
.videos-list .videos-app .videos-filter .filter input[type=checkbox]:checked + label:before {
background-color: #232323;
}
.videos-list .videos-app .videos-filter .filter label.game_vice-city .inner {
background-image: url("../img/games/gta-vice-city.png");
}
.videos-list .videos-app .videos-filter .filter label.game_san-andreas .inner {
background-image: url("../img/games/gta-san-andreas.png");
}
.videos-list .videos-app .videos-filter .filter small {
font-size: 0.6875em;
}
.videos-list .videos-app .videos-filter .filter.dates .multiselect {
margin: 0 0 0.5em 0;
}
.videos-list .videos-app .videos-filter .filter.dates label {
color: #999D9C;
display: inline-block;
font-size: 0.75em;
margin: 0 0 0.25em;
}
.videos-list .videos-app .videos-filter .filter .multiselect__tags {
background: #232323;
border-color: #999D9C;
}
.videos-list .videos-app .videos-filter .filter .multiselect__input, .videos-list .videos-app .videos-filter .filter .multiselect__single {
background: #232323;
color: #cdcdcd;
}
.videos-list .videos-app .videos-filter .filter .multiselect__input:hover input, .videos-list .videos-app .videos-filter .filter .multiselect__single:hover input {
color: #cdcdcd;
}
.videos-list .videos-app .videos-filter .filter input[type=text].text {
background: #232323;
border: 1px solid #999D9C;
border-radius: 5px;
padding: 1em 0.75em;
color: #cdcdcd;
width: 100%;
}
.videos-list .videos-app .videos-filter .filter .multiselect__content-wrapper {
background: #232323;
}
.videos-list .videos-app .videos-filter .filter .multiselect__element {
color: #cdcdcd;
}
.videos-list .videos-app .videos-filter .filter .multiselect__option--highlight,
.videos-list .videos-app .videos-filter .filter .multiselect__tag {
background: #2E70AC;
}
.videos-list .videos-app .videos-filter .filter .multiselect__option--highlight:after,
.videos-list .videos-app .videos-filter .filter .multiselect__tag:after {
background: #2E70AC;
}
.videos-list .videos-app .videos-filter .filter .multiselect__option--selected {
background: #1a1a1a;
color: #cdcdcd;
}
.videos-list .videos-app .videos-filter .filter .multiselect__tag-icon:after {
color: #cdcdcd;
}
.videos-list .videos-app .videos-filter .filter .multiselect__tag-icon:focus, .videos-list .videos-app .videos-filter .filter .multiselect__tag-icon:hover {
background: #2E70AC;
}
.videos-list .videos-app .videos-filter .checkbox-group ul li {
width: 100%;
display: inline-block;
}
@media screen and (min-width: 1199px) {
.videos-list .videos-app .videos-filter .checkbox-group ul li {
width: 50%;
}
}
.videos-list .videos-app .videos-filter .checkbox-group ul li label {
font-size: 0.75em;
line-height: 1;
}
.videos-list .videos-app .videos-filter .checkbox-group ul li label:before, .videos-list .videos-app .videos-filter .checkbox-group ul li label:after {
top: 0;
}
.videos-list .videos-app .videos-filter .checkbox-group ul li input {
margin: 0 0.5em 0 0;
}
.videos-list .videos-app .videos-filter .checkbox-group.horizontal ul li {
display: inline-block;
width: 50%;
}
.videos-list .videos-app .videos-filter .checkbox-group .pretty input:checked ~ .state.p-success label::after, .videos-list .videos-app .videos-filter .checkbox-group .pretty.p-toggle .state.p-success label::after {
background-color: #2E70AC !important;
}
.videos-list .videos-app .videos-filter .checkbox-group .pretty input:checked ~ .state.p-success label {
color: #2E70AC;
}
.videos-list .videos-app .videos-results {
order: 1;
width: 100%;
}
@media screen and (min-width: 768px) {
.videos-list .videos-app .videos-results {
order: 2;
}
}
@media screen and (min-width: 992px) {
.videos-list .videos-app .videos-results {
width: 75%;
margin-left: 2%;
}
}
.music_box {
display: flex;
flex-direction: row;
justify-content: flex-start;
flex-wrap: wrap;
}
.music_box .song_box {
width: 100%;
background: #1a1a1a;
margin-bottom: 1em;
padding: 0.5em 1em;
}
@media screen and (min-width: 768px) {
.music_box .song_box {
width: 30%;
margin: 0 1%;
}
}
.music_box .artist {
font-size: 1.375em;
}
.music_box .song {
font-size: 0.875em;
}
.music_box .song .artist-inner {
font-size: 0.75em;
}
.music_box .song .artist-inner a {
color: #999D9C;
}
.music_box .videos {
margin: 0 0 1em 0;
}
.music_box span.count {
color: #999D9C;
font-size: 0.75em;
}
.music_box.artists {
background: #1a1a1a;
padding: 1.5em 1em 1.25em;
margin-bottom: 0.75em;
display: block;
}
.music_box.artists .song_box {
display: flex;
width: 100%;
flex-direction: row;
justify-content: flex-start;
flex-wrap: wrap;
margin: 0;
}
.music_box.artists .song_box a {
color: #999D9C;
}
@media screen and (min-width: 768px) {
.music_box.artists .song_box .inline {
margin: 0 1%;
width: 30%;
}
}
.music_box.artists .artist {
margin-bottom: 0.5em;
}
.music_box.artists .song {
font-size: 0.875em;
font-weight: normal;
margin-bottom: 0.5em;
}
.videos-view {
padding: 0 0 2em;
position: relative;
z-index: 2;
line-height: 1.375em;
}
.videos-view #videoPlayer {
background: #000000;
padding: 1em 0;
margin: 0 auto 2em;
position: relative;
display: flex;
justify-content: center;
z-index: 2;
}
@media screen and (min-width: 768px) {
.videos-view #videoPlayer {
width: 80%;
height: 80vh;
}
}
.videos-view #videoPlayer .plyr--video {
width: 100%;
}
.videos-view .video-details-container {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
@media screen and (min-width: 992px) {
.videos-view .video-details-container {
flex-wrap: nowrap;
}
}
.videos-view .video-details-container .video_details {
background: #1a1a1a;
padding: 1.25em;
display: flex;
justify-content: space-between;
flex-direction: row;
width: 100%;
margin-bottom: 1em;
flex-wrap: wrap;
}
@media screen and (min-width: 992px) {
.videos-view .video-details-container .video_details {
flex-wrap: nowrap;
margin-bottom: 0;
width: 68%;
}
}
.videos-view .video-details-container .video_details .video_left {
order: 2;
width: 100%;
}
@media screen and (min-width: 992px) {
.videos-view .video-details-container .video_details .video_left {
order: 1;
width: 75%;
}
}
.videos-view .video-details-container .video_details .video_left h1 {
margin-bottom: 0.25em;
text-align: left;
}
.videos-view .video-details-container .video_details .video_left .crews strong, .videos-view .video-details-container .video_details .video_left .stunters strong, .videos-view .video-details-container .video_details .video_left .date strong {
color: #fff;
font-weight: bold;
}
.videos-view .video-details-container .video_details .video_left .crews, .videos-view .video-details-container .video_details .video_left .stunters, .videos-view .video-details-container .video_details .video_left .types, .videos-view .video-details-container .video_details .video_left .description {
color: #cdcdcd;
font-size: 1em;
margin: 0.25em 0 0;
}
.videos-view .video-details-container .video_details .video_left .crews a, .videos-view .video-details-container .video_details .video_left .stunters a, .videos-view .video-details-container .video_details .video_left .types a, .videos-view .video-details-container .video_details .video_left .description a {
color: #2E608E;
}
.videos-view .video-details-container .video_details .video_left .crews p, .videos-view .video-details-container .video_details .video_left .stunters p, .videos-view .video-details-container .video_details .video_left .types p, .videos-view .video-details-container .video_details .video_left .description p {
display: inline;
}
.videos-view .video-details-container .video_details .video_left .date {
color: #999D9C;
font-size: 1em;
}
.videos-view .video-details-container .video_details .video_left .description,
.videos-view .video-details-container .video_details .video_left .music_block {
margin-top: 1em;
}
.videos-view .video-details-container .video_details .video_left .music {
margin-left: 1em;
font-size: 0.875em;
color: #999D9C;
}
.videos-view .video-details-container .video_details .video_left a.btn {
margin: 1em 0 0;
align-self: flex-end;
}
.videos-view .video-details-container .video_details .video_right {
order: 1;
width: 100%;
}
@media screen and (min-width: 992px) {
.videos-view .video-details-container .video_details .video_right {
order: 2;
width: 24%;
}
}
.videos-view .downloadsList {
background: #1a1a1a;
margin: 0 0 2em;
padding: 1.5em;
width: 100%;
}
@media screen and (min-width: 992px) {
.videos-view .downloadsList {
width: 30%;
}
}
.videos-view .downloadsList h2 {
margin-top: 0;
margin-bottom: 1em;
}
.videos-view .downloadsList a {
text-decoration: none;
color: #2E608E;
display: block;
margin: 0 0 0.5em 1em;
white-space: nowrap;
}
.videos-view .downloadsList a:last-of-type {
margin-right: 0;
}
.videos-view .downloadsList a:hover {
text-decoration: underline;
}
.videos-view .video-actions {
display: flex;
flex-direction: column;
max-width: 400px;
width: 100%;
padding: 0 2em 0 0;
margin: 0 auto 1em;
}
@media screen and (min-width: 768px) {
.videos-view .video-actions {
flex-direction: row;
justify-content: flex-end;
padding: 0;
width: 80%;
}
}
.videos-view .video-actions a {
width: 100%;
margin: 0 1em 1em;
}
@media screen and (min-width: 768px) {
.videos-view .video-actions a {
margin: 0 0 0 1em;
}
}
.videos-view .tags {
width: 100%;
align-self: flex-end;
line-height: 12px;
text-align: left;
margin: 2px 0 5px auto;
font-size: 0.75em;
}
@media screen and (min-width: 768px) {
.videos-view .tags {
align-self: flex-end;
text-align: right;
}
}
@media screen and (min-width: 992px) {
.videos-view .tags {
width: auto;
}
}
.videos-view .tags span {
display: inline-block;
padding: 0.35em 0.5em;
text-align: center;
color: white;
margin-left: 2px;
}
.videos-view .tags span.type-crew-videos {
background-color: #c94242;
}
.videos-view .tags span.type-solos {
background-color: #399562;
}
.videos-view .tags span.type-collabs {
background-color: #7160BE;
}
.videos-view .tags span.type-community {
background-color: #006AA3;
}
.videos-view .tags span.type-auditions {
background-color: #000;
}
.videos-view .tags span.type-time-limited {
background-color: #CD8987;
}
.videos-view .tags a {
text-decoration: underline;
}
.videos-view .tags a:hover {
color: inherit;
}
.videos-results .video-results-info {
display: flex;
color: #999D9C;
flex-direction: row;
justify-content: flex-end;
align-items: center;
margin: 0.5em 0 1em;
position: relative;
z-index: 3;
}
.videos-results .video-results-info .stat {
font-size: 0.75em;
}
.videos-results .video-results-info .multiselect {
max-width: 150px;
margin: 0 0 0 1em;
}
.videos-results .video-results-info .multiselect__tags {
background: #232323;
border-color: #999D9C;
}
.videos-results .video-results-info .multiselect__input, .videos-results .video-results-info .multiselect__single {
background: #232323;
color: #cdcdcd;
}
.videos-results .video-results-info .multiselect__input:hover input, .videos-results .video-results-info .multiselect__single:hover input {
color: #cdcdcd;
}
.videos-results .video-results-info input.text {
background: #232323;
border: 1px solid #999D9C;
border-radius: 5px;
padding: 0.5em 0.75em;
color: #cdcdcd;
max-width: 200px;
}
.videos-results .video-results-info .multiselect__content-wrapper {
background: #232323;
}
.videos-results .video-results-info .multiselect__element {
color: #cdcdcd;
}
.videos-results .video-results-info .multiselect__option--highlight,
.videos-results .video-results-info .multiselect__tag {
background: #2E70AC;
}
.videos-results .video-results-info .multiselect__option--highlight:after,
.videos-results .video-results-info .multiselect__tag:after {
background: #2E70AC;
}
.videos-results .video-results-info .multiselect__option::after {
display: none;
}
.videos-results .video-results-info .multiselect__option--selected {
background: #1a1a1a;
color: #cdcdcd;
}
.videos-results .video-results-info .multiselect__tag-icon:after {
color: #cdcdcd;
}
.videos-results .video-results-info .multiselect__tag-icon:focus, .videos-results .video-results-info .multiselect__tag-icon:hover {
background: #2E70AC;
}
.videos-results .video-results-info .filter-by {
margin-right: auto !important;
}
.videos-results .video-results-info .filter-by input {
display: none;
}
.videos-results .video-results-info .filter-by label {
background: #1a1a1a;
border: 1px solid #2E70AC;
border-radius: 5px;
display: inline-block;
padding: 0.25em 0.5em;
margin: 0 0.5em 0 0;
text-decoration: none;
cursor: pointer;
}
.videos-results .video-results-info .filter-by input:checked + label {
background: #2E70AC;
color: #cdcdcd;
}
.stunters-list {
color: #ffffff;
font-size: 1em;
line-height: 1.375em;
padding: 2em 0 0;
}
.stunters-list img.flag {
border: 1px solid white;
max-height: 50px;
}
.stunters-list div.flag {
margin: 0.5em 0;
padding: 0 0.5em;
width: 100%;
}
.stunters-list .stunters-results-list, .stunters-list .crews-results-list {
display: flex;
justify-content: flex-start;
flex-direction: row;
flex-flow: row wrap;
}
.stunters-list .stunters-results-list .card, .stunters-list .crews-results-list .card {
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0.5em 0.5em;
margin: 0.5em 0.5em;
width: 100%;
}
@media screen and (min-width: 768px) {
.stunters-list .stunters-results-list .card, .stunters-list .crews-results-list .card {
width: 49%;
}
}
@media screen and (min-width: 992px) {
.stunters-list .stunters-results-list .card, .stunters-list .crews-results-list .card {
width: 32%;
}
}
@media screen and (min-width: 1199px) {
.stunters-list .stunters-results-list .card, .stunters-list .crews-results-list .card {
width: 23%;
}
}
@media screen and (min-width: 1690px) {
.stunters-list .stunters-results-list .card, .stunters-list .crews-results-list .card {
width: 17%;
}
}
.stunters-list .stunters-results-list:after, .stunters-list .crews-results-list:after {
content: "";
flex: auto;
}
#stuntersApp .video-results-info {
flex-direction: column;
}
#stuntersApp .video-results-info input[type=text] {
margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
#stuntersApp .video-results-info {
flex-direction: row;
}
#stuntersApp .video-results-info input[type=text] {
margin-bottom: 0;
}
}
#crewApp .crews-results-list .card {
margin-bottom: 0.5em;
}
.stunters-view {
color: #ffffff;
font-size: 1em;
line-height: 1.375em;
padding: 2em 0 0;
text-align: center;
}
@media screen and (min-width: 768px) {
.stunters-view {
text-align: left;
}
}
.stunters-view h1 {
color: #999D9C;
font-size: 2.625em;
margin: 0 0 0.25em;
}
.stunters-view h1.nomargin {
margin-bottom: 0;
}
.stunters-view .aliases {
font-size: 12px;
color: #999D9C;
line-height: 1em;
margin-bottom: 2em;
}
.stunters-view .location {
margin-bottom: 0.25em;
display: flex;
align-items: center;
font-size: 1.65em;
color: #999D9C;
}
.stunters-view .location img {
border: 1px solid white;
max-width: 60px;
margin-right: 10px;
}
.stunters-view .location span {
font-size: 0.625em;
}
.stunters-view .crews {
color: #cdcdcd;
font-size: 1em;
}
.stunters-view .crews a {
color: #cdcdcd;
}
.stunters-view .videos-table {
background: #1a1a1a;
display: inline-block;
padding: 0.5em 1em;
width: 100%;
}
.stunters-view .videos-results {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-bottom: 1em;
}
.stunters-view .videos-results .video-results-info {
flex-direction: column;
}
@media screen and (min-width: 768px) {
.stunters-view .videos-results .video-results-info {
flex-direction: row;
justify-content: center;
order: 0;
}
}
.stunters-view .videos-results .video-results-info .stat {
margin-right: 10px;
}
.stunters-view .videos-results .video-results-info > * {
margin: 0.25em 0;
}
.stunters-view .videos-results .video-results-info .filter-by {
text-align: center;
}
.stunters-view .videos-results .video-results-info .filter-by label {
margin-bottom: 0.5em;
}
@media screen and (min-width: 768px) {
.stunters-view .videos-results .video-results-info .filter-by {
text-align: left;
}
.stunters-view .videos-results .video-results-info .filter-by label {
margin-bottom: 0;
}
}
.crews-list .videos-results {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-bottom: 1em;
}
.crews-list .videos-results .video-results-info {
flex-direction: column;
}
@media screen and (min-width: 768px) {
.crews-list .videos-results .video-results-info {
flex-direction: row;
justify-content: flex-end;
order: 0;
}
}
.crews-list .videos-results .video-results-info .stat {
margin-right: 10px;
}
.crews-list .videos-results .video-results-info > * {
margin: 0.25em 0;
}
.crews-list .videos-results .video-results-info .filter-by {
text-align: center;
}
.crews-list .videos-results .video-results-info .filter-by label {
margin-bottom: 0.5em;
}
@media screen and (min-width: 768px) {
.crews-list .videos-results .video-results-info .filter-by {
text-align: left;
}
.crews-list .videos-results .video-results-info .filter-by label {
margin-bottom: 0;
}
}
.crews-list .videos-results .crews-results-list {
display: flex;
justify-content: center;
flex-direction: row;
flex-flow: row wrap;
}
.crews-list .videos-results .crews-results-list .card {
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 0.25em 0.5%;
width: 100%;
}
@media screen and (min-width: 768px) {
.crews-list .videos-results .crews-results-list .card {
width: 49%;
}
}
@media screen and (min-width: 992px) {
.crews-list .videos-results .crews-results-list .card {
width: 32%;
}
}
@media screen and (min-width: 1199px) {
.crews-list .videos-results .crews-results-list .card {
width: 24%;
}
}
.crews-list .videos-results .crews-results-list:after {
content: "";
flex: auto;
}
.crews-view .crew-info {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 100%;
margin-bottom: 1em;
}
.crews-view .crew-logo {
max-width: 500px;
}
.crews-view .video-results-info {
margin-left: auto;
width: 100%;
}
@media screen and (min-width: 768px) {
.crews-view .video-results-info {
width: 50%;
}
}
@media screen and (min-width: 1199px) {
.crews-view .video-results-info {
width: 25%;
}
}
.crews-view .card-list {
justify-content: flex-start;
}
.crew-banner {
background-color: #000;
height: 0;
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
padding-bottom: 25%;
}
.songInfo .count {
font-size: 0.75em;
color: #999D9C;
}
.songInfo .artist {
display: block;
font-size: 0.875em;
}
.card-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
padding: 2em 0;
position: relative;
z-index: 1;
}
.card-list .card {
background: #1a1a1a;
border-radius: 5px;
display: flex;
flex-direction: column;
justify-content: flex-start;
margin: 0 0 1.5em 0;
width: 100%;
position: relative;
text-align: left;
max-width: 500px;
}
.card-list .card:before {
background: #2E608E;
content: "";
display: block;
height: 5px;
width: 100%;
position: absolute;
top: -5px;
left: 0;
right: 0;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
z-index: 10;
}
@media screen and (min-width: 768px) {
.card-list .card {
max-width: none;
flex-direction: row;
}
}
.card-list .card.staggered-fade-enter-active, .card-list .card .staggered-fade-leave-active {
transition: all 1s;
}
.card-list .card.staggered-fade-enter, .card-list .card .staggered-fade-leave-to {
opacity: 0;
transform: translateY(30px);
}
.card-list .card.guest {
background-color: rgba(26, 26, 26, 0.3);
}
.card-list .card .thumbnail {
margin: 0 1em 0 0;
width: 100%;
position: relative;
overflow: hidden;
}
.card-list .card .thumbnail img {
position: absolute;
top: 0;
width: 100%;
}
.card-list .card .thumbnail:before {
display: block;
content: "";
width: 100%;
padding-top: 56.25%;
}
.card-list .card .info {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 1em;
width: 100%;
/*
.date {
font-size: em(14);
margin-top: auto;
color: $makeup_blue;
strong { color: #fff; }
}*/
}
.card-list .card .info .title {
display: flex;
flex-direction: row;
justify-content: flex-start;
font-size: 1.25em;
line-height: 1.4em;
flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
.card-list .card .info .title {
flex-direction: row;
}
}
.card-list .card .info .title .gameTag {
margin: 0 0.35em 0 0;
display: inline-block;
padding: 0 0.25em;
text-align: center;
line-height: 1.4em;
color: white;
font-size: 0.75em;
align-self: center;
width: 30px;
}
.card-list .card .info .title .gameTag--vice-city {
background: #db5a77;
}
.card-list .card .info .title .gameTag--san-andreas {
background: #a5834a;
}
.card-list .card .info .title .gameTag--iv {
background: #111;
}
.card-list .card .info .title .gameTag--iii {
background: #fff;
color: #111;
}
.card-list .card .info .title a {
color: #cdcdcd;
text-decoration: none;
width: 100%;
flex-basis: 100%;
display: block;
}
.card-list .card .info .title a:hover {
color: #2E70AC;
}
.card-list .card .info .title .tags {
align-self: flex-start;
line-height: 1.4em;
text-align: left;
margin: 5px 0 4px;
font-size: 0.75em;
}
@media screen and (min-width: 768px) {
.card-list .card .info .title .tags {
align-self: flex-end;
text-align: right;
}
}
@media screen and (min-width: 992px) {
.card-list .card .info .title .tags {
width: auto;
}
}
.card-list .card .info .title .tags span {
display: inline-block;
padding: 0 0.25em;
text-align: center;
color: white;
margin-left: 2px;
}
.card-list .card .info .title .tags span.type-crew-videos {
background-color: #c94242;
}
.card-list .card .info .title .tags span.type-solos {
background-color: #399562;
}
.card-list .card .info .title .tags span.type-collabs {
background-color: #7160BE;
}
.card-list .card .info .title .tags span.type-community {
background-color: #006AA3;
}
.card-list .card .info .title .tags span.type-auditions {
background-color: #000;
}
.card-list .card .info .title .tags span.type-time-limited {
background-color: #CD8987;
}
.card-list .card .info .title .tags span.type-remake {
background-color: #5d7446;
}
.card-list .card .info .title .tags a {
text-decoration: underline;
}
.card-list .card .info .title .tags a:hover {
color: inherit;
}
.card-list .card .info ul {
line-height: 14px;
margin: 4px 0;
display: flex;
}
.card-list .card .info ul li {
border-right: 1px solid #2E608E;
color: #999D9C;
display: inline-block;
font-size: 0.875em;
line-height: 18px;
padding: 0 0.35em;
}
.card-list .card .info ul li a {
color: #fff;
}
.card-list .card .info ul li:first-of-type {
padding-left: 0;
}
.card-list .card .info ul li:last-of-type {
border-right: 0;
}
.card-list .card .info .stunters {
font-size: 0.875em;
font-weight: 700;
margin: 0 0 0;
color: #cdcdcd;
line-height: 1.6em;
}
@media screen and (min-width: 768px) {
.card-list .card .info .stunters {
display: block;
}
}
.card-list .card .info .stunters a {
color: #cdcdcd;
font-weight: normal;
}
.card-list .card .info .actions {
text-align: right;
}
.card-list .card span.count {
font-size: 0.75em;
}
.card-list .card--stunter-card {
width: 50%;
}
@media screen and (min-width: 768px) {
.card-list.full .card {
flex-direction: column;
width: 48%;
}
.card-list.full .card:nth-child(2n+1) {
margin-right: 1em;
}
}
@media screen and (min-width: 1199px) {
.card-list.full .card {
width: 32%;
margin-right: 1em;
}
.card-list.full .card:nth-child(3n) {
margin-right: 0;
}
}
@media screen and (min-width: 1440px) {
.card-list.full .card {
width: 24%;
margin-right: 1em;
}
.card-list.full .card:nth-child(3n) {
margin-right: 1em;
}
.card-list.full .card:nth-child(4n) {
margin-right: 0;
}
}
.card-list.crew .card {
width: 100%;
padding: 0.5em 0.65em;
}
@media all and (min-width: 600px) {
.card-list.crew .card {
flex-direction: column;
width: 31%;
margin-right: 1em;
}
.card-list.crew .card:nth-child(3n) {
margin-right: 0;
}
}
@media screen and (min-width: 1199px) {
.card-list.crew .card {
width: 23%;
margin-right: 1em;
}
.card-list.crew .card:nth-child(3n) {
margin-right: 1em;
}
}
@media screen and (min-width: 1440px) {
.card-list.crew .card {
width: 18%;
margin-right: 1em;
}
.card-list.crew .card:nth-child(4n) {
margin-right: 1em;
}
.card-list.crew .card:nth-child(5n) {
margin-right: 0;
}
}
.card-list .card {
transition-delay: 1s;
}
.video-row {
display: flex;
flex-direction: row;
justify-content: space-between;
margin: 0;
padding: 1em 0;
position: relative;
flex-wrap: wrap;
width: 100%;
vertical-align: middle;
border-bottom: 1px solid #2E70AC;
}
.video-row .title {
font-size: 1.125em;
line-height: 1.2em;
width: 40%;
}
.video-row .title a {
color: #cdcdcd;
text-decoration: none;
}
.video-row .title a:hover {
color: #2E70AC;
}
.video-row .types {
font-size: 0.75em;
line-height: 12px;
text-align: right;
}
.video-row .types span {
display: inline-block;
padding: 0.35em 0.5em;
text-align: center;
color: white;
margin-left: 2px;
}
.video-row .types span.type-crew-video {
background-color: #c94242;
}
.video-row .types span.type-solo {
background-color: #399562;
}
.video-row .types span.type-collab {
background-color: #7160BE;
}
.video-row .types span.type-community {
background-color: #006AA3;
}
.video-row .types span.type-audition {
background-color: #000000;
}
.video-row .types span.type-time-limited {
background-color: #CD8987;
}
.video-row .types a {
text-decoration: underline;
}
.video-row .types a:hover {
color: inherit;
}
.video-row .released {
font-size: 0.875em;
color: #2E608E;
}
.video-row .released strong {
color: #fff;
}
.video-row .actions .btn {
transform: translateY(-20%);
padding: 0.25em 1em;
}
.video-row .stunters {
background-color: rgba(35, 35, 35, 0.5);
flex-basis: 100%;
font-size: 0.875em;
font-weight: 700;
margin: 0.5em 0 0 0;
padding: 0.5em 1em;
}
.video-row .stunters a {
color: #cdcdcd;
font-weight: normal;
}
.fadeInUp {
transform: translateY(50%);
opacity: 0;
transition: all 0.8s ease;
transition-delay: 0.4s;
}
.fadeInLeft {
transform: translateX(10px);
opacity: 0;
transition: all 0.8s ease;
transition-delay: 1s;
}
.animateDelay--10 {
transition-delay: 1s !important;
}
body.has-loaded .fadeInUp {
transform: translateY(0);
opacity: 1;
}
body.has-loaded .fadeInLeft {
transform: translateX(0);
opacity: 1;
}
.filterFade {
transform: translateX(-10px);
opacity: 0;
transition: all 0.8s ease;
transition-delay: 1s;
}
.filterFade.enter {
transform: translateX(0);
opacity: 1;
}