@charset "UTF-8"; @import 'base_config'; @import '../custom_config'; @import '../custom_color', '../custom_layout'; @import 'mixins'; .media-gallery { border-radius: 0; &__item { border-radius: 0 } } .media-modal__close { align-content: center; &.icon-button { background: transparent; color: $media-icon-color; text-align: center !important; font-size: 24px !important; width: 48px !important; height: 48px !important; border: 12px; &:hover { background: $media-icon-background-hover-color; color: $media-icon-hover-color; } .fa-fw { width: 24px } } } .media-modal { &__nav { background: $media-icon-background-color; color: $media-icon-color; height: 48px; width: 48px; margin: auto 16px; padding: 8px; border-radius: 50%; .fa { width: 32px } } &__button { background-color: $media-page-indicator-color; &--active { background-color: $media-page-indicator-active-color } } } .video-player { &__controls { background: linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,.2) 60%,transparent); padding: 0 12px; } &__seek { &::before { background: rgba(255,255,255,.2); border-radius: 0; } &__buffer { background: rgba(255,255,255,.4); border-radius: 0; } &__progress { background: $primary-color; border-radius: 0; } &__handle { transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1); background-color: $primary-color; box-shadow: none; } } &__volume { &::before { background: rgba(255,255,255,.4); border-radius: 0; } &__current { background: $primary-color; border-radius: 0; } &__handle { transition: opacity .25s cubic-bezier(0.0,0.0,0.2,1); background-color: $primary-color; box-shadow: none; } } &__time-current { margin-left: 68px } &__buttons button { font-size: 20px } }