::before {
    box-sizing: inherit
}

div.video {
    position: relative
}

.video__still {
    width: 100%
}

.video__still img {
    -o-object-fit: cover;
    object-fit: cover;
    font-family: 'object-fit:cover;';
    width: 100%
}

.video__still__play-button {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    background-color: #fff;
    border: none;
    border-radius: 100%;
    z-index: 1;
    transition: .7s cubic-bezier(.19,1,.22,1) -webkit-transform;
    transition: .7s cubic-bezier(.19,1,.22,1) transform;
    transition: .7s cubic-bezier(.19,1,.22,1) transform,.7s cubic-bezier(.19,1,.22,1) -webkit-transform;
    cursor: pointer
}

@media (min-width:992px) {
    .video__still__play-button {
        width: 78px;
        height: 78px
    }
}

.video__still__play-button:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.video__still__play-button::before {
    content: '';
    position: absolute;
    height: 45px;
    width: 45px;
    top: -3px;
    left: -3px;
    border: .8rem solid #fff;
    border-radius: 100%
}

@media (min-width:992px) {
    .video__still__play-button::before {
        width: 90px;
        height: 90px;
        top: -6px;
        left: -6px
    }
}

@media (min-width:992px) {
    .video__still__play-button::before {
        -webkit-animation: pulse 2.5s cubic-bezier(0,0,.6,1);
        animation: pulse 2.5s cubic-bezier(0,0,.6,1);
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        -webkit-animation-delay: .5s;
        animation-delay: .5s
    }
}

.video__still__play-button svg {
    width: 12px;
    height: 13px;
    margin-left: 3px;
    pointer-events: none
}

@media (min-width:992px) {
    .video__still__play-button svg {
        width: 14px;
        height: 19px;
        margin-left: 6px
    }
}

.video__still.js-inactive {
    display: none
}

.video__media {
    display: none;
    background-color: #ededed;
}

.video__media--small {
    padding: 0
}

.video__media__content {
    margin: 0 auto
}

.video__media.js-active {
    display: block
}

.playIcon {
    fill: currentColor;
    vertical-align: middle;
    width: 1rem;
    height: 1rem
}

img.videoplaceholder {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }

    25% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: .1
    }

    50% {
        -webkit-transform: scale(.25);
        transform: scale(.25);
        opacity: .3
    }

    75% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: .5
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 0
    }

    25% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: .1
    }

    50% {
        -webkit-transform: scale(.25);
        transform: scale(.25);
        opacity: .3
    }

    75% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: .5
    }

    to {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        opacity: 0
    }
}