.desktop-screenshot {
    border-radius: 10px 10px 6px 6px;  /* Must be same as browser-frame and img/video */
    box-shadow: 2px 8px 32px rgba(0, 0, 0, 0.1),
                4px 16px 64px rgba(0, 0, 0, 0.1);
    border: 1px solid #ddd;
    overflow: hidden;
    opacity: 0;
    transform: scale(.98);
    transform-origin: 50% 20%;
    transition: opacity, transform .6s;
}

.print .desktop-screenshot {
    box-shadow: none;
    overflow: visible;
}

.desktop-screenshot.LOADED {
    transform: none;
    opacity: 1;
}

.desktop-screenshot__browser-frame {
    background: #f2f2f2;
    padding: 0 10px;
    height: 36px;
    display: flex;
    align-items: center;
    border-radius: 10px 10px 0 0; /* Must be same as wrapper */
}

.desktop-screenshot.dark .desktop-screenshot__browser-frame {
    background: #555;
}

.desktop-screenshot__browser-frame-button {
    height: 12px;
    width: 12px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .12);
    margin: 0 3px;
}

.desktop-screenshot__browser-frame-button:nth-child(1) {
    background-color: #FF6058;
}

.desktop-screenshot__browser-frame-button:nth-child(2) {
    background-color: #FFBE2F;
}

.desktop-screenshot__browser-frame-button:nth-child(3) {
    background-color: #27CA41;
}

.desktop-screenshot img,
.desktop-screenshot video {
    display: block;
    width: 100%;
    border-radius: 0 0 6px 6px; /* Must be same as wrapper */
}