.intro-section{
  width:100%;
}
.intro-section article{
  padding:28px 32px;
  border-radius:10px;
  background:#f6f6f7;
}
.intro-section article p{
  margin-bottom:0;
}
.intro-section article p+p,.intro-section article picture{
  margin-top:15px;
}
.intro-section article picture[data-url],.intro-section article picture[data-video-id]{
  position:relative;
  display:block;
}
.intro-section article picture[data-url]:after,.intro-section article picture[data-video-id]:after{
  position:absolute;
  top:50%;
  left:50%;
  padding:.155em;
  color:#fff;
  font-family:icomoon;
  font-weight:400;
  font-style:normal;
  font-variant:normal;
  line-height:1;
  text-transform:none;
  vertical-align:top;
  -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased;
  speak:never;
  font-size:52px;
  border-radius:50%;
  background:rgba(0,0,0,.35);
  transform:translate(-50%, -50%);
  content:"\e90d";
}
.intro-section article picture[data-url],.intro-section article picture[data-video-id]{
  width:60%;
}
.intro-section article picture[data-url] img,.intro-section article picture[data-video-id] img{
  width:100%;
  vertical-align:top;
  border-radius:10px;
}
.intro-section article picture[data-label-text]:before{
  position:absolute;
  bottom:22px;
  left:20px;
  color:#fff;
  font-weight:500;
  content:attr(data-label-text);
}
.intro-section article picture[data-label-text]:after{
  inset:auto 20px 10px auto;
  font-size:35px;
  transform:none;
}
@media screen and (max-width:991px){
  .intro-section article{
    padding:0;
    border-radius:0;
    background:none;
  }
}
@media screen and (max-width:767px){
  .intro-section article picture[data-url],.intro-section article picture[data-video-id]{
    width:100%;
  }
}