.plyr { font-family: 'Inter', sans-serif; font-weight: 400; // border-radius: 16px; // margin-top: 30px; } .plyr__tooltip { font-weight: 400; } .plyr__tab-focus { box-shadow: none; outline: none; } .plyr__control { border-radius: 10px; } @media (min-width: 768px) { .plyr { // margin-top: 40px; } } @media (min-width: 1200px) { .plyr { // margin-right: 30px; } .plyr__controls { padding: 20px !important; } } .plyr__menu__container .plyr__control { transition: 0s ease; } .plyr__control.plyr__control--overlaid { border-radius: 50%; } .plyr--video { .plyr__control { &.plyr__tab-focus, &:hover, &[aria-expanded="true"] { background: none; background-color: $theme-color; } } .plyr__control--overlaid { background-color: $theme-color; box-shadow: none; padding: 26px; transition: 0.5s ease; color: #fff; border: 3px solid #fff; opacity: 1; // &:before { // content: ''; // position: absolute; // flexbox: flex; // flex-direction: row; // justify-content: center; // align-items: center; // top: 0; // left: 0; // right: 0; // bottom: 0; // margin: 0; // border-radius: 50%; // background: url("../images/play.svg") no-repeat center; // background-size: 18px auto; // z-index: 1; // } // svg { // display: none; // } &:hover, &.plyr__tab-focus { background-color: #151f30; color: #fff; } } .plyr__progress__buffer { box-shadow: none; } } @media (min-width: 768px) { .plyr--video .plyr__control--overlaid { padding: 33px; &:before { background-size: 20px auto; } } } .plyr__progress__buffer { border-radius: 0; } .plyr--full-ui input[type="range"] { color: $theme-color; border-radius: 0; } .plyr__control.plyr__tab-focus { box-shadow: none; } .plyr__menu__container .plyr__control[role="menuitemradio"][aria-checked="true"]::before { background: none; background-color: $theme-color; } .plyr--video .plyr__control svg { filter: none; }