:root {
     --plyr-color-main:#00b3ff;
    --plyr-font-size-base:13px;
    --plyr-font-size-small:12px;
    --plyr-font-size-time:11px;
    --plyr-font-size-badges:9px;
    --plyr-font-size-menu:var(--plyr-font-size-base);
    --plyr-font-weight-regular:500;
    --plyr-font-weight-bold:600;
    --plyr-font-size-captions-medium:18px;
    --plyr-font-size-captions-large:21px
}
 @font-face {
     font-display:swap;
    font-family: Gordita;
     font-style: normal;
     font-weight: 300;
     src: url(https://cdn.plyr.io/static/fonts/gordita-light.woff2) format("woff2"),url(https://cdn.plyr.io/static/fonts/gordita-light.woff) format("woff") 
}
 @font-face {
     font-display:swap;
    font-family: Gordita;
     font-style: normal;
     font-weight: 400;
     src: url(https://cdn.plyr.io/static/fonts/gordita-regular.woff2) format("woff2"),url(https://cdn.plyr.io/static/fonts/gordita-regular.woff) format("woff") 
}
 @font-face {
     font-display:swap;
    font-family: Gordita;
     font-style: normal;
     font-weight: 500;
     src: url(https://cdn.plyr.io/static/fonts/gordita-medium.woff2) format("woff2"),url(https://cdn.plyr.io/static/fonts/gordita-medium.woff) format("woff") 
}
 @font-face {
     font-display:swap;
    font-family: Gordita;
     font-style: normal;
     font-weight: 600;
     src: url(https://cdn.plyr.io/static/fonts/gordita-bold.woff2) format("woff2"),url(https://cdn.plyr.io/static/fonts/gordita-bold.woff) format("woff") 
}
 @font-face {
     font-display:swap;
    font-family: Gordita;
     font-style: normal;
     font-weight: 900;
     src: url(https://cdn.plyr.io/static/fonts/gordita-black.woff2) format("woff2"),url(https://cdn.plyr.io/static/fonts/gordita-black.woff) format("woff") 
}
 @keyframes fadein {
     0% {
         opacity: 0 
    }
     100% {
         opacity: 1 
    }
}
 @keyframes shrinkHide {
     0% {
         opacity: .5;
         width: 38px 
    }
     20% {
         width: 45px 
    }
     100% {
         opacity: 0;
         width: 0 
    }
}
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
 html {
     line-height: 1.15;
     -ms-text-size-adjust: 100%;
     -webkit-text-size-adjust: 100% 
}
 body {
     margin: 0 
}
 article,aside,footer,header,nav,section {
     display: block 
}
 h1 {
     font-size: 2em;
     margin: .67em 0 
}
 figcaption,figure,main {
     display: block 
}
 figure {
     margin: 1em 40px 
}
 hr {
     box-sizing: content-box;
     height: 0;
     overflow: visible 
}
 pre {
     font-family: monospace,monospace;
     font-size: 1em 
}
 a,button.faux-link {
     background-color: transparent;
     -webkit-text-decoration-skip: objects 
}
 abbr[title] {
     border-bottom: none;
     text-decoration: underline;
     -webkit-text-decoration: underline dotted;
     text-decoration: underline dotted 
}
 b,strong {
     font-weight: inherit 
}
 b,strong {
     font-weight: bolder 
}
 code,kbd,samp {
     font-family: monospace,monospace;
     font-size: 1em 
}
 dfn {
     font-style: italic 
}
 mark {
     background-color: #ff0;
     color: #000 
}
 small {
     font-size: 80% 
}
 sub,sup {
     font-size: 75%;
     line-height: 0;
     position: relative;
     vertical-align: baseline 
}
 sub {
     bottom: -.25em 
}
 sup {
     top: -.5em 
}
 audio,video {
     display: inline-block 
}
 audio:not([controls]) {
     display: none;
     height: 0 
}
 img {
     border-style: none 
}
 svg:not(:root) {
     overflow: hidden 
}
 button,input,optgroup,select,textarea {
     font-family: sans-serif;
     font-size: 100%;
     line-height: 1.15;
     margin: 0 
}
 button,input {
     overflow: visible 
}
 button,select {
     text-transform: none 
}
 [type=reset],[type=submit],button,html [type=button] {
     -webkit-appearance: button 
}
 [type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
     border-style: none;
     padding: 0 
}
 [type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring {
     outline: 1px dotted ButtonText 
}
 fieldset {
     padding: .35em .75em .625em 
}
 legend {
     box-sizing: border-box;
     color: inherit;
     display: table;
     max-width: 100%;
     padding: 0;
     white-space: normal 
}
 progress {
     display: inline-block;
     vertical-align: baseline 
}
 textarea {
     overflow: auto 
}
 [type=checkbox],[type=radio] {
     box-sizing: border-box;
     padding: 0 
}
 [type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
     height: auto 
}
 [type=search] {
     -webkit-appearance: textfield;
     outline-offset: -2px 
}
 [type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
     -webkit-appearance: none 
}
 ::-webkit-file-upload-button {
     -webkit-appearance: button;
     font: inherit 
}
 details,menu {
     display: block 
}
 summary {
     display: list-item 
}
 canvas {
     display: inline-block 
}
 template {
     display: none 
}
 [hidden] {
     display: none 
}
 *,::after,::before {
     box-sizing: border-box 
}
 body,html {
    /* display:flex;
     */
    /* width:100%;
     */
}
 html {
     background: #000;
     background-attachment: fixed;
     height: 100% 
}
 body {
    /* align-items:center;
     */
    /* display:flex;
     */
    /* flex-direction:column;
     */
    /*margin-top: -15px;
    */
    /*min-height: 100%;
    */
    /*min-height: 180%;
    */
}
 .grid {
     flex: 1;
     overflow: auto 
}
 main {
     margin: auto;
     padding-bottom: 1px;
     text-align: center 
}
 aside {
     align-items: center;
     background: #fff;
     display: flex;
     flex-shrink: 0;
     justify-content: center;
     padding: 16px;
     position: relative;
     text-align: center;
     text-shadow: none;
     width: 100% 
}
 aside .icon {
     fill: #4baaf4;
     margin-right: 8px 
}
 aside p {
     margin: 0 
}
 aside a,aside button.faux-link {
     color: #4baaf4 
}
 aside a.tab-focus,aside button.tab-focus.faux-link {
     box-shadow: 0 0 0 3px rgba(75,170,244,.35);
     outline: 0 
}
 .grid {
     margin: 0 auto;
     padding: 16px 
}
 @media only screen and (min-width: 768px) {
     .grid {
         align-items:center;
         display: flex;
         max-width: 1260px;
         width: 100% 
    }
     .grid>* {
         flex: 1 
    }
}
 html {
     font-size: 100% 
}
 body {
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
     font-size: 15px;
     font-size: .9375rem;
     color: #4a5764;
     font-family: Gordita,Avenir,"Helvetica Neue",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
     font-weight: 500;
     line-height: 1.75 
}
 button,input,select,textarea {
     font: inherit 
}
 p,small {
     margin: 0 0 24px 
}
 small {
     font-size: 13px;
     font-size: .8125rem;
     display: block 
}
 h1 {
     font-size: 64px;
     font-size: 4rem;
     color: #00b3ff;
     font-weight: 600;
     letter-spacing: -.025em;
     line-height: 1.2;
     margin: 0 0 24px 
}
 .button,.button__count {
     align-items: center;
     border: 0;
     border-radius: 4px;
     box-shadow: 0 1px 1px rgba(0,0,0,.1);
     display: inline-flex;
     padding: 12px;
     position: relative;
     text-shadow: none;
     -webkit-user-select: none;
     -ms-user-select: none;
     user-select: none;
     vertical-align: middle 
}
 .button {
     background: #00b3ff;
     color: #fff;
     font-weight: 600;
     padding-left: 20px;
     padding-right: 20px;
     transition: all .2s ease 
}
 .button:focus,.button:hover {
     background: #1abaff 
}
 .button:focus::after,.button:hover::after {
     display: none 
}
 .button:hover {
     box-shadow: 0 2px 2px rgba(0,0,0,.1) 
}
 .button:focus {
     outline: 0 
}
 .button.tab-focus {
     box-shadow: 0 0 0 3px rgba(255,255,255,.35);
     outline: 0 
}
 .button:active {
     top: 1px 
}
 .button--with-count {
     display: inline-flex 
}
 .button--with-count .button .icon {
     flex-shrink: 0 
}
 .button__count {
     animation: fadein .2s ease;
     background: #fff;
     color: #5d6e7e;
     margin-left: 12px 
}
 .button__count::before {
     border: 5px solid transparent;
     border-left-width: 0;
     border-right-color: #fff;
     content: '';
     height: 0;
     position: absolute;
     right: 100%;
     top: 50%;
     transform: translateY(-50%);
     width: 0 
}
 header {
     padding-bottom: 16px;
     text-align: center 
}
 header h1 span {
     animation: shrinkHide 1s cubic-bezier(.175,.885,.32,1.275) 2s forwards;
     display: inline-block;
     font-weight: 300;
     opacity: .5 
}
 header .call-to-action {
     margin-top: 24px 
}
 @media only screen and (min-width: 768px) {
     header {
         margin-right:48px;
         max-width: 360px;
         padding-bottom: 32px;
         text-align: left 
    }
     header p:first-of-type {
         font-size: 16px;
         font-size: 1rem 
    }
}
 .icon {
     fill: currentColor;
     height: 16px;
     vertical-align: -3px;
     width: 16px 
}
 a svg,button svg,button.faux-link svg,label svg {
     pointer-events: none 
}
 .btn .icon,a .icon,button.faux-link .icon {
     margin-right: 8px 
}
 button.faux-link {
     background: 0 0;
     border: 0;
     border-radius: 0;
     cursor: pointer;
     font: inherit;
     line-height: 1.75;
     margin: 0;
     padding: 0;
     position: relative;
     text-align: inherit;
     text-shadow: inherit;
     -moz-user-select: text;
     vertical-align: baseline;
     width: auto 
}
 a,button.faux-link {
     border-bottom: 1px dotted currentColor;
     color: #00b3ff;
     position: relative;
     text-decoration: none;
     transition: all .2s ease 
}
 a::after,button.faux-link::after {
     background: currentColor;
     content: '';
     height: 1px;
     left: 50%;
     position: absolute;
     top: 100%;
     transform: translateX(-50%);
     transition: width .2s ease;
     width: 0 
}
 a:focus,a:hover,button.faux-link:focus,button.faux-link:hover {
     border-bottom-color: transparent;
     outline: 0 
}
 a:focus::after,a:hover::after,button.faux-link:focus::after,button.faux-link:hover::after {
     width: 100% 
}
 a.tab-focus,button.tab-focus.faux-link {
     box-shadow: 0 0 0 3px rgba(255,255,255,.35);
     outline: 0 
}
 a.no-border::after,button.no-border.faux-link::after {
     display: none 
}
 li,ul {
     list-style: none;
     margin: 0;
     padding: 0 
}
 audio,img,video {
     max-width: 100%;
     vertical-align: middle 
}
 nav {
     display: flex;
     justify-content: center;
     margin-bottom: 16px 
}
 .plyr {
    /*border-radius: 4px;
    */
     box-shadow: 0 2px 15px rgba(0,0,0,.1);
    /*margin: 16px auto*/
}
 .plyr.plyr--audio {
     max-width: 480px 
}
 .plyr__video-wrapper::after {
     border: 1px solid rgba(0,0,0,.15);
     border-radius: inherit;
     bottom: 0;
     content: '';
     left: 0;
     pointer-events: none;
     position: absolute;
     right: 0;
     top: 0;
     z-index: 3 
}
 .plyr__cite {
     color: #728597 
}
 .plyr__cite .icon {
     margin-right: 3px 
}
 @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: 500;
     font-weight: var(--plyr-font-weight-regular,400);
     height: 100%;
     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 button.faux-link,.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: 12px;
     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:13px;
         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: var(--plyr-control-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);
     position: relative;
     left: -2px;
}
 .plyr__control:focus {
     outline: 0 
}
 .plyr__control.plyr__tab-focus {
     outline-color: var(--plyr-color-main,var(--plyr-color-main,#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,button.plyr__control.faux-link {
     text-decoration: none 
}
 a.plyr__control::after,a.plyr__control::before,button.plyr__control.faux-link::after,button.plyr__control.faux-link::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: 13px;
     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) + var(--plyr-control-padding,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: var(--plyr-control-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(var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7))/ 1.5);
     padding-left: calc(calc(10px * .7) * 1.5);
     padding-left: calc(var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7)) * 1.5);
     padding-right: calc(calc(10px * .7) * 1.5);
     padding-right: calc(var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7)) * 1.5);
     padding-top: calc(calc(10px * .7)/ 1.5);
     padding-top: calc(var(--plyr-control-padding,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(var(--plyr-control-padding,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((var(--plyr-control-padding,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: 500;
     font-weight: var(--plyr-font-weight-regular,400);
     margin: calc(10px * .7);
     margin: var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7));
     margin-bottom: calc(calc(10px * .7)/ 2);
     margin-bottom: calc(var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7))/ 2);
     padding-left: calc(calc(10px * .7) * 4);
     padding-left: calc(var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7)) * 4);
     position: relative;
     width: calc(100% - (calc(10px * .7) * 2));
     width: calc(100% - (var(--plyr-control-padding,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((var(--plyr-control-padding,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(var(--plyr-control-padding,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: var(--plyr-control-padding,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: var(--plyr-color-main,var(--plyr-color-main,#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((var(--plyr-control-padding,calc(var(--plyr-control-spacing,10px) * .7)) - 2) * -1);
     overflow: hidden;
     padding-left: calc(calc(10px * .7) * 3.5);
     padding-left: calc(var(--plyr-control-padding,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: var(--plyr-color-main,var(--plyr-color-main,#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;
     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: var(--plyr-color-main,var(--plyr-color-main,#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: var(--plyr-color-main,var(--plyr-color-main,#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: var(--plyr-color-main,var(--plyr-color-main,#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: 11px;
     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 - 1)) {
     .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: 12px;
     font-size: var(--plyr-font-size-small,13px);
     font-weight: 500;
     font-weight: var(--plyr-font-weight-regular,400);
     left: 50%;
     line-height: 1.3;
     margin-bottom: calc(calc(10px / 2) * 2);
     margin-bottom: calc(var(--plyr-tooltip-padding,calc(var(--plyr-control-spacing,10px)/ 2)) * 2);
     opacity: 0;
     padding: calc(10px / 2) calc(calc(10px / 2) * 1.5);
     padding: var(--plyr-tooltip-padding,calc(var(--plyr-control-spacing,10px)/ 2)) calc(var(--plyr-tooltip-padding,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) + var(--plyr-control-padding,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) + var(--plyr-control-padding,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: 11px;
     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: var(--plyr-color-main,var(--plyr-color-main,#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% !important 
}
 .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: var(--plyr-color-main,var(--plyr-color-main,#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: var(--plyr-color-main,var(--plyr-color-main,#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__progress {
    display: none;
}

 .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(var(--plyr-tooltip-padding,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: 11px;
     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 
}
 .no-border {
     border: 0 
}
 [hidden] {
     display: none 
}
 .sr-only {
     border: 0;
     clip: rect(0 0 0 0);
     height: 1px;
     margin: -1px;
     opacity: .001;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px 
}
 body#body {
     overflow: hidden;
}
 .container {
     margin: 20px auto;
     max-width: 500px;
}
 .plyr__video-embed iframe {
     top: -50%;
     height: 200%;
}
 .video {
     width: 75%;
     float: left;
}
 .container {
     width: 100%;
     max-width: 100%;
     margin: 0;
}
 button[data-plyr="settings"]{
     display: none;
}
 @media only screen and (max-width:995px){
     .video {
         width: 100%;
         float: left;
         z-index: 2;
         background: #000;
    }
     .plyr__controls .plyr__controls__item:first-child {
         position: absolute;
         background: #1890ff;
         border-radius: 30px;
         z-index: 99999;
         padding: 6px 3px 6px 10px;
         right: 18px;
         bottom: 14px;
    }
     .plyr__controls__item.plyr__progress__container {
         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: none;
    }
     .plyr__controls__item.plyr__menu {
         display: none;
    }
     .plyr [data-plyr=airplay], .plyr [data-plyr=captions], .plyr [data-plyr=fullscreen], .plyr [data-plyr=pip] {
         display: none;
    }
     .plyr__controls__item.plyr__volume {
         display: none;
    }
     .plyr__controls__item.plyr__time--current.plyr__time {
         position: absolute;
         left: 0;
         bottom: 20px;
    }
     .plyr--video.plyr--hide-controls .plyr__controls {
         opacity: 1;
         pointer-events: auto;
         transform: translateY(0%);
    }
     .plyr--full-ui.plyr--video .plyr__control--overlaid {
         display: none;
    }
     svg.icon--pressed {
         left: -3.5px;
    }
     .img {
        /*float: left;
        */
    }
     .img img {
         border-radius: 100px;
         width: 50px;
         height: 50px;
    }
     .comments {
         position: fixed;
         bottom: 0;
         width: 100%;
    }
     .comments input {
         padding: 5px 10px;
         background: transparent;
         border: 1px solid #999;
         width: 95%;
         margin: 0 auto 15px;
         display: block;
         border-radius: 40px;
         color: #fff;
    }
}
 .offer {
     position: fixed;
     display: flex;
     align-items: center;
    /* direction: rtl;
     */
     float: left;
     width: 75%;
     overflow-x: scroll;
    /* top: -10px;
     */
     z-index: 2;
     background: rgb(35 39 44 / 75%);
    /* filter: blur(1px);
     */
}
 .offer .col {
    /* width: 100%;
     */
     display: -webkit-inline-box;
     flex: 0 0 80%;
     max-width: fit-content;
     white-space: nowrap;
     width: fit-content;
     min-width: fit-content;
     margin-right: 20px;
     padding-right: 20px;
     border-right: 1px solid #565656;
}
 .offer .col:first-child {
     padding: 0;
     margin: 0;
}
 .offer img {
     height: 5rem;
}
 .offer h3 {
     padding-left: 10px;
     display: initial;
     color: #fff;
     margin-bottom: 0px;
     margin-top: 0;
     font-size: 15px;
}
 .offer p {
     padding-left: 10px;
     display: inline;
     color: #999;
     margin-bottom: 0px;
     margin-top: -5px;
     font-size: 13px;
}
 .offer a {
     background: #c92417;
     color: #fff;
     padding: 10px 20px;
     margin-right: 5px;
     border-bottom: 0;
     text-transform: uppercase;
     font-weight: bold;
     border-radius: 10px;
     display: inline-flex;
     margin-top: 3px;
}
 .input form button {
     width: 38px;
     height: 38px;
     position: absolute;
     background: #6d6d6d;
     bottom: 15px;
     right: 9px;
     border-radius: 60px;
     padding-top: 7px;
}
 div#video {
     position: fixed;
     padding-bottom: 90px;
    /*position: relative;
    */
     transition: 0.001s all ease;
}
 .title h4{
    font-size: 1.8rem;
    line-height: 2.6rem;
    font-weight: 400;
    margin: 0;
    padding: 0;
}
@media only screen and (max-width:995px){
    .title h4 {
        font-size: 0.8rem;
        line-height: 1.4rem;
        margin: 0;
        padding: 0;
    }
    .title p {
        margin: 0;
        color: #999;
        font-size: 10px;
    }
}
 .title {
     padding: 10px;
     color: #fff;
}
 .title p {
     margin: 0;
     color: #999 
}
 .introjs-hint {
     z-index: 999;
     margin-right: -9px;
     margin-top: -9px 
}
 .plyr__controls .plyr__controls__item:first-child {
     cursor: pointer;
     border-radius: 50%;
     z-index: auto;
}
 .plyr__controls .plyr__controls__item:first-child:after {
     content: '';
     animation: tpprpoint linear 1s infinite;
     display: block;
     width: 48px;
     height: 48px;
     border-radius: 50%;
     background-color: rgba(255,255,255,.9);
     position: absolute;
     right: 0;
     top: 0;
     margin-right: -8px;
     margin-top: -9px;
     z-index: -1;
     box-shadow: 0 1px 4px rgba(0,0,0,.3) 
}
 @keyframes tpprpoint {
     0%,to {
         transform: scale(1) 
    }
     50% {
         transform: scale(.5) 
    }
}
 .messages {
     height: 100vh;
     overflow: scroll;
     display: block;
}
 .messages messages {
     display: flex;
}
 .messages messages img {
     width: 50px;
     height: 50px;
     border-radius: 50px;
     margin-right: 12px;
}
 .messages messages {
     color: #fff;
     padding: 0px 10px;
}
 .messages messages p{
     margin-bottom: 10px;
}
 @media only screen and (min-width:995px){
     div#video {
         padding-top: 0px;
         overflow: scroll;
         height: 100vh;
    }
}
 @media only screen and (max-width:995px){
     .floating-chat.expand {
         width: 100% !important;
        /*max-height: 400px;
        */
        /*height: 300px;
        */
         border-radius: 0px;
         cursor: auto;
         opacity: 1;
    }
}
 .card {
     max-width: 340px;
     margin: auto;
     overflow-y: auto;
     position: relative;
     z-index: 1;
     overflow-x: hidden;
     background-color: rgba(255, 255, 255, 1);
     display: flex;
     transition: 0.3s;
     flex-direction: column;
     border-radius: 10px;
     box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.2);
}
 .card[data-state="#about"] {
     height: 450px;
}
 .card[data-state="#about"] .card-main {
     padding-top: 0;
}
 .card[data-state="#contact"] {
     height: 430px;
}
 .card[data-state="#experience"] {
     height: 550px;
}
 .card.is-active .card-header {
     height: 80px;
}
 .card.is-active .card-cover {
     height: 100px;
     top: -50px;
}
 .card.is-active .card-avatar {
     transform: none;
     left: 20px;
     width: 50px;
     height: 50px;
     bottom: 10px;
}
 .card.is-active .card-fullname, .card.is-active .card-jobtitle {
     left: 86px;
     transform: none;
}
 .card.is-active .card-fullname {
     bottom: 18px;
     font-size: 19px;
}
 .card.is-active .card-jobtitle {
     bottom: 16px;
     letter-spacing: 1px;
     font-size: 10px;
}
 .card-header {
     position: relative;
     display: flex;
     height: 200px;
     flex-shrink: 0;
     width: 100%;
     transition: 0.3s;
}
 .card-header * {
     transition: 0.3s;
}
 .card-cover {
     width: 100%;
     height: 100%;
     position: absolute;
     height: 160px;
     top: -20%;
     left: 0;
     will-change: top;
     background-size: cover;
     background-position: center;
     filter: blur(30px);
     transform: scale(1.2);
     transition: 0.5s;
}
 .card-avatar {
     width: 100px;
     height: 100px;
     box-shadow: 0 8px 8px rgba(0, 0, 0, 0.2);
     border-radius: 50%;
     object-position: center;
     object-fit: cover;
     position: absolute;
     bottom: 0;
     left: 50%;
     transform: translateX(-50%) translateY(-64px);
}
 .card-fullname {
     position: absolute;
     bottom: 0;
     font-size: 22px;
     font-weight: 700;
     text-align: center;
     white-space: nowrap;
     transform: translateY(-10px) translateX(-50%);
     left: 50%;
}
 .card-jobtitle {
     position: absolute;
     bottom: 0;
     font-size: 11px;
     white-space: nowrap;
     font-weight: 500;
     opacity: 0.7;
     text-transform: uppercase;
     letter-spacing: 1.5px;
     margin: 0;
     left: 50%;
     transform: translateX(-50%) translateY(-7px);
}
 .card-main {
     position: relative;
     flex: 1;
     display: flex;
     padding-top: 10px;
     flex-direction: column;
}
 .card-subtitle {
     font-weight: 700;
     font-size: 13px;
     margin-bottom: 8px;
}
 .card-content {
     padding: 20px;
}
 .card-desc {
     line-height: 1.6;
     color: #636b6f;
     font-size: 14px;
     margin: 0;
     font-weight: 400;
     font-family: "DM Sans", sans-serif;
}
 .card-social {
     display: flex;
     align-items: center;
     padding: 0 20px;
     margin-bottom: 30px;
}
 .card-social svg {
     fill: #a5b5ce;
     width: 16px;
     display: block;
     transition: 0.3s;
}
 .card-social a {
     color: #8797a1;
     height: 32px;
     width: 32px;
     border-radius: 50%;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     transition: 0.3s;
     background-color: rgba(93, 133, 193, 0.05);
     border-radius: 50%;
     margin-right: 10px;
}
 .card-social a:hover svg {
     fill: #637faa;
}
 .card-social a:last-child {
     margin-right: 0;
}
 .card-buttons {
     display: flex;
     background-color: #fff;
     margin-top: auto;
     position: sticky;
     bottom: 0;
     left: 0;
}
 .card-buttons button {
     flex: 1 1 auto;
     user-select: none;
     background: 0;
     font-size: 13px;
     border: 0;
     padding: 15px 5px;
     cursor: pointer;
     color: #5c5c6d;
     transition: 0.3s;
     font-family: "Jost", sans-serif;
     font-weight: 500;
     outline: 0;
     border-bottom: 3px solid transparent;
}
 .card-buttons button.is-active, .card-buttons button:hover {
     color: #2b2c48;
    /*border-bottom: 3px solid #8a84ff;
    */
    /*background: linear-gradient(to bottom, rgba(127, 199, 231, 0) 0%, rgba(207, 204, 255, 0.2) 44%, rgba(211, 226, 255, 0.4) 100%);
    */
}
 .card-section {
     display: none;
}
 .card-section.is-active {
     display: block;
     animation: fadeIn 0.6s both;
}
 @keyframes fadeIn {
     0% {
         opacity: 0;
         transform: translatey(40px);
    }
     100% {
         opacity: 1;
    }
}
 .card-timeline {
     margin-top: 30px;
     position: relative;
}
 .card-timeline:after {
     background: linear-gradient(to top, rgba(134, 214, 243, 0) 0%, rgba(81, 106, 204, 1) 100%);
     content: "";
     left: 42px;
     width: 2px;
     top: 0;
     height: 100%;
     position: absolute;
     content: "";
}
 .card-item {
     position: relative;
     padding-left: 60px;
     padding-right: 20px;
     padding-bottom: 30px;
     z-index: 1;
}
 .card-item:last-child {
     padding-bottom: 5px;
}
 .card-item:after {
     content: attr(data-year);
     width: 10px;
     position: absolute;
     top: 0;
     left: 37px;
     width: 8px;
     height: 8px;
     line-height: 0.6;
     border: 2px solid #fff;
     font-size: 11px;
     text-indent: -35px;
     border-radius: 50%;
     color: rgba(134, 134, 134, 0.7);
     background: linear-gradient(to bottom, #a0aee3 0%, #516acc 100%);
}
 .card-item-title {
     font-weight: 500;
     font-size: 14px;
     margin-bottom: 5px;
}
 .card-item-desc {
     font-size: 13px;
     color: #6f6f7b;
     line-height: 1.5;
     font-family: "DM Sans", sans-serif;
}
 .card-contact-wrapper {
     margin-top: 20px;
}
 .card-contact {
     display: flex;
     align-items: center;
     font-size: 13px;
     color: #6f6f7b;
     font-family: "DM Sans", sans-serif;
     line-height: 1.6;
     cursor: pointer;
}
 .card-contact + .card-contact {
     margin-top: 16px;
}
 .card-contact svg {
     flex-shrink: 0;
     width: 30px;
     min-height: 34px;
     margin-right: 12px;
     transition: 0.3s;
     padding-right: 12px;
     border-right: 1px solid #dfe2ec;
}
 .contact-me {
     border: 0;
     outline: none;
     background: linear-gradient(to right, rgba(83, 200, 239, 0.8) 0%, rgba(81, 106, 204, 0.8) 96%);
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
     color: #fff;
     padding: 12px 16px;
     width: 100%;
     border-radius: 5px;
     margin-top: 25px;
     cursor: pointer;
     font-size: 14px;
     font-weight: 500;
     font-family: "Jost", sans-serif;
     transition: 0.3s;
}
.card[data-state="#about"] {
    min-height: 300px;
    position: absolute;
    top: 50%;
    width: 320px;
    left: 0;
    right: 0;
    transform: translate(0, -50%);
}
 .preloud {
     position: fixed;
     top: 0;
     height: 100vh;
     z-index: 99999999999999999;
     width: 75%;
}
 .card-buttons button.is-active, .card-buttons button:hover {
     color: #eff0f0;
    /*border-bottom: 3px solid #8a84ff;
    */
     background: #1890ff;
     font-size: 20px;
     font-weight: 900;
     text-transform: uppercase;
     letter-spacing: 3px;
}
 @media only screen and (max-width:995px){
     .preloud {
         width: 100%;
    }
}
 .form-control {
     background: #36393e;
     color: #ebecf0;
     border: 0 none;
     -webkit-: ;
     font-size: 15px;
     height: 40px;
     -webkit-box-shadow: none !important;
     box-shadow: none !important;
}
 .form-control {
     display: block;
     width: 100%;
     padding: 0.375rem 0.75rem;
     font-size: .9rem;
     line-height: 1.6;
     color: #495057;
     background-color: #fff;
     background-clip: padding-box;
     border: 1px solid #ced4da;
     border-radius: 0.25rem;
     -webkit-transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
     transition: border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
     transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
     transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}
 .form-group.form-group_type_dark {
     padding: 5px 20px;
}
 .blue{
     position: fixed;
     width: 100%;
     height: 100vh;
     background: rgb(0 0 0 / 80%);
     display: block;
     top: 0;
}
 @import 'https://fonts.googleapis.com/css?family=Noto+Sans';
/*.comments {
     float: left;
     width: 25%;
}
*/
 button[aria-label="Pause"] {
     display: none;
}
 .floating-chat {
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     color: white;
    /*width: 25%;
    */
    /*float: right;
    */
    /*position: fixed;
    */
    /*bottom: 10px;
    */
    /*right: 10px;
    */
    /*width: 40px;
    */
    /*height: 40px;
    */
     transform: translateY(70px);
     transition: all 250ms ease-out;
     border-radius: 50%;
     opacity: 0;
     background: #23272c;
    /*background: -webkit-linear-gradient(-45deg, #183850 0, #183850 25%, #192c46 50%, #22254c 75%, #22254c 100%);
    */
     background-repeat: no-repeat;
     background-attachment: fixed;
}
 .floating-chat.enter:hover {
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
     opacity: 1;
}
 .floating-chat.enter {
     transform: translateY(0);
     opacity: 0.6;
     box-shadow: 0px 0 10px rgb(0 0 0 / 80%), 0px 1px 10px rgb(0 0 0 / 60%);
}
 .floating-chat.expand {
     width: 25%;
     float: right;
    /*max-height: 400px;
    */
     height: 100vh;
     border-radius: 0px;
     cursor: auto;
     opacity: 1;
}
ul#messegeContent i {
    display: block;
    font-size: 10px;
    color: #1890ff;
}
ul#messegeContent .other i {
    display: none;
}

 .floating-chat :focus {
     outline: 0;
     background: #fff!important;
     color: #23272c !important;
}
 .floating-chat button {
    /* background: transparent;
     border: 0;
     color: white;
     text-transform: uppercase;
     border-radius: 3px;
    */
     cursor: pointer;
}
 .floating-chat .chat {
     display: flex;
     flex-direction: column;
     position: absolute;
     opacity: 0;
     width: 1px;
     height: 1px;
     border-radius: 50%;
     transition: all 250ms ease-out;
     margin: auto;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
}
 .floating-chat .chat.enter {
     opacity: 1;
     border-radius: 0;
     margin: 10px;
     width: auto;
     height: auto;
}
 .floating-chat .chat .header {
     flex-shrink: 0;
     padding-bottom: 10px;
     display: flex;
     background: transparent;
}
 .floating-chat .chat .header .title {
     flex-grow: 1;
     flex-shrink: 1;
     padding: 0 5px;
}
 .floating-chat .chat .header button {
     flex-shrink: 0;
}
 .floating-chat .chat .messages {
     padding: 10px;
     margin: 0;
     list-style: none;
     overflow-y: scroll;
     overflow-x: hidden;
     flex-grow: 1;
     border-radius: 4px;
     background: transparent;
}
 .floating-chat .chat .messages::-webkit-scrollbar {
     width: 5px;
}
 .floating-chat .chat .messages::-webkit-scrollbar-track {
     border-radius: 5px;
     background-color: rgba(54, 57, 62, 0.4);
}
 .floating-chat .chat .messages::-webkit-scrollbar-thumb {
     border-radius: 5px;
     background-color: rgba(54, 57, 62, 1);
}
.floating-chat .chat .messages li {
    position: relative;
    clear: both;
    display: inline-block;
    padding: 5px 10px;
    margin: 0 0 10px 0;
    font: 14px/16px 'Noto Sans', sans-serif;
    border-radius: 10px;
    background-color: rgb(54 57 62);
    word-wrap: break-word;
    max-width: 81%;
}
 .floating-chat .chat .messages li:before {
     position: absolute;
     top: 0;
     width: 25px;
     height: 25px;
     border-radius: 25px;
     content: '';
     background-size: cover;
}
 .floating-chat .chat .messages li:after {
     position: absolute;
     top: 10px;
     content: '';
     width: 0;
     height: 0;
     border-top: 10px solid rgb(54 57 62);
}
.floating-chat .chat .messages li.other:after {
     border-top: 10px solid #1890ff;
}
 .floating-chat .chat .messages li.other {
     animation: show-chat-odd 0.15s 1 ease-in;
     -moz-animation: show-chat-odd 0.15s 1 ease-in;
     -webkit-animation: show-chat-odd 0.15s 1 ease-in;
     float: right;
     margin-right: 45px;
     color: #fff;
     background: #1890ff;
}
 .floating-chat .chat .messages li.other:before {
     right: -45px;
     background-image: url(https://github.com/Thatkookooguy.png);
}
 .floating-chat .chat .messages li.other:after {
     border-right: 10px solid transparent;
     right: -10px;
}
 .floating-chat .chat .messages li.self {
     animation: show-chat-even 0.15s 1 ease-in;
     -moz-animation: show-chat-even 0.15s 1 ease-in;
     -webkit-animation: show-chat-even 0.15s 1 ease-in;
     float: left;
     margin-left: 45px;
     color: #fff;
}
 .floating-chat .chat .messages li.self:before {
     left: -45px;
     background-image: url(https://github.com/ortichon.png);
}
 .floating-chat .chat .messages li.self:after {
     border-left: 10px solid transparent;
     left: -10px;
}
 .floating-chat .chat .footer {
     flex-shrink: 0;
     display: flex;
     padding-top: 19px;
     padding-bottom: 20px;
     max-height: 90px;
     background: transparent;
}
 .floating-chat .chat .footer .text-box {
     border-radius: 3px;
     background: #36393e;
     min-height: 100%;
     width: 100%;
     margin-right: 5px;
     color: #fff;
     overflow-y: auto;
     padding: 2px 5px;
     padding-top: 3px;
}
 .floating-chat .chat .footer .text-box::-webkit-scrollbar {
     width: 5px;
}
 .floating-chat .chat .footer .text-box::-webkit-scrollbar-track {
     border-radius: 5px;
     background-color: rgba(24, 144, 255, 0.1);
}
 .floating-chat .chat .footer .text-box::-webkit-scrollbar-thumb {
     border-radius: 5px;
     background-color: rgba(24, 144, 255, 0.2);
}
 @keyframes show-chat-even {
     0% {
         margin-left: -480px;
    }
     100% {
         margin-left: 0;
    }
}
 @-moz-keyframes show-chat-even {
     0% {
         margin-left: -480px;
    }
     100% {
         margin-left: 0;
    }
}
 @-webkit-keyframes show-chat-even {
     0% {
         margin-left: -480px;
    }
     100% {
         margin-left: 0;
    }
}
 @keyframes show-chat-odd {
     0% {
         margin-right: -480px;
    }
     100% {
         margin-right: 0;
    }
}
 @-moz-keyframes show-chat-odd {
     0% {
         margin-right: -480px;
    }
     100% {
         margin-right: 0;
    }
}
 @-webkit-keyframes show-chat-odd {
     0% {
         margin-right: -480px;
    }
     100% {
         margin-right: 0;
    }
}
 .ant-btn {
     line-height: 1.5715;
     position: relative;
     display: inline-block;
     font-weight: 400;
     white-space: nowrap;
     text-align: center;
     background-image: none;
     border: 1px solid transparent;
     box-shadow: 0 2px #00000004;
     cursor: pointer;
     transition: all .3s cubic-bezier(.645,.045,.355,1);
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     touch-action: manipulation;
     height: 32px;
     padding: 4px 15px;
     font-size: 14px;
     border-radius: 2px;
     color: #000000d9;
     border-color: #d9d9d9;
     background: #fff;
}
 .ant-btn-primary {
     color: #fff;
     border-color: #1890ff;
     background: #1890ff;
     text-shadow: 0 -1px 0 rgb(0 0 0 / 12%);
     box-shadow: 0 2px #0000000b;
}
 .ant-btn-primary img {
     filter: invert(1);
     padding-right: 3px;
     padding-bottom: 3px;
}
 .box_text_send {
     width: 100%;
     margin-right: 9px;
}
 .box_text_send p {
     width: 100%;
     font-size: 11px;
     color: #999;
     position: absolute;
     top: -3px;
     font-weight: 400;
}
 .link_offer {
     text-align: center;
}
 .link_offer a {
     background: #c92417;
     color: #fff;
     padding: 10px 20px;
     margin-right: 5px;
     border-bottom: 0;
     text-transform: uppercase;
     font-weight: bold;
     border-radius: 10px;
     display: inline-flex;
     margin-top: 3px;
     font-size: 0.91rem;
     margin-bottom: 30px;
     display: block;
     margin: 0px auto 10px;
     text-align: center;
}
 @media only screen and (max-width:995px){
     .offer_d {
         display: none;
    }
     div#video {
         position: relative;
         padding-bottom: 0;
    }
     .link_offer {
         width: 320px;
         text-align: center;
         position: fixed;
         z-index: 70;
         left: 0;
         right: 0;
         margin: auto;
         top: 75px;
    }
     .floating-chat .chat .messages.active {
         padding-top: 50px;
    }
     .offer {
         width: 100%;
    }
     .offer img {
         height: 3rem;
    }
     .img img {
         border-radius: 0px;
         width: 50px;
         height: 50px;
    }
     .offer .col {
         display: -webkit-inline-box;
         flex: 0 0 80%;
         max-width: fit-content;
         white-space: nowrap;
         width: fit-content;
         min-width: fit-content;
         margin-right: 0px;
         padding-right: 10px;
         border-right: 1px solid #565656;
    }
}
 .admin {
     border: 1px solid transparent;
    /*2*/
     background: linear-gradient(45deg,red,blue) border-box;
    /*3*/
}
 .check {
     width: 100%;
     background: #36393e !important;
}
 .check b {
     display: block;
     width: 100%;
     text-align: center;
     margin-bottom: 10px;
}
 .check p{
     display: block;
     width: 100%;
     text-align: left;
}
 .f {
     display: flex;
     justify-content: space-around;
     align-items: center;
}
 .f a{
     clear: both;
     display: inline-block;
     padding: 5px 10px;
     border-radius: 5px;
     background-color: rgb(24 144 255);
     color: #fff;
     text-decoration: none;
     border-bottom: 0;
     font-weight: 900;
}