.instruction__row {
 display: grid;
 grid-template-columns: 1.3fr 1fr;
 align-items: center;
 gap: var(--spacer-md);
}
.video-tutorial {
 background: var(--filling-space);
 border-radius: 1rem;
 overflow: clip;
 box-shadow: var(--panel-shadow-setup);
}
.video-tutorial p {
 padding: var(--spacer-xs) var(--spacer-sm);
 text-align: center;
}
.youtube-player {
 position: relative;
 padding-bottom: 56.25%;
 height: 0;
 overflow: clip;
 max-width: 100%;
 background: #000;
}

.youtube-player iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: 100;
 background: transparent;
}

.youtube-player img {
 object-fit: cover;
 display: block;
 left: 0;
 bottom: 0;
 margin: auto;
 max-width: 100%;
 width: 100%;
 position: absolute;
 right: 0;
 top: 0;
 border: none;
 height: auto;
 cursor: pointer;
 -webkit-transition: 0.4s all;
 -moz-transition: 0.4s all;
 transition: 0.4s all;
}
.youtube-player .play {
 height: 3rem;
 width: 4.25rem;
 left: 50%;
 top: 50%;
 margin-left: -2.125rem;
 margin-top: -1.5rem;
 position: absolute;
 background: url("../images/logos--youtube-icon.svg") no-repeat;
 cursor: pointer;
 -webkit-filter: grayscale(100%) opacity(70%);
 filter: grayscale(100%) opacity(70%);
 transition: 0.3s ease;
}
.youtube-player:hover .play {
 -webkit-filter: grayscale(0%) opacity(100%);
 filter: grayscale(0%) opacity(100%);
}

.instruction__content {
 display: flex;
 flex-direction: column;
 gap: var(--spacer-sm);
}
@media (max-width: 39em) {
 .instruction__row {
  grid-template-columns: 1fr;
 }
}