@include responsive_320
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        .relative-el
          .content
            font-size: 20px
          .button
            width: 32px
            height: 32px
          .arrow
            border-width: 12px 0 15px 24px
            top: 54%
          .mute, .stop
            font-size: 20px
            i
              width: 10px
@include responsive_375
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        .relative-el
          .content
            font-size: 24px
          .button
            width: 50px
            height: 50px
          .arrow
            border-width: 12px 0 15px 24px
            top: 52%
          .mute, .stop
            font-size: 20px
            i
              width: 10px
@include responsive_425
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        .relative-el
          .content
            font-size: 28px
          .button
            width: 50px
            height: 50px
          .arrow
            border-width: 12px 0 15px 24px
            top: 52%
          .mute, .stop
            font-size: 20px
            i
              width: 10px
@include responsive_768
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        flex: 0 0 30%
        .relative-el
          .content
            font-size: 18px
            line-height: 20px
            margin-left: 10px!important
            padding-right: 30px
          .button
            width: 50px
            height: 50px
          .arrow
            border-width: 12px 0 15px 24px
            top: 51%
          .middle-arrow
            border-width: 5px 0 5px 10px
            top: 51%
            left: 95%
          .mute, .stop
            font-size: 26px
            i
              width: 20px

@include responsive_992
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        flex: 0 0 30%
        .relative-el
          .content
            font-size: 37px
            line-height: 40px
            margin-left: 10px!important
            padding-right: 30px
          .button
            width: 50px
            height: 50px
          .arrow
            border-width: 12px 0 15px 24px
            top: 51%
          .middle-arrow
            border-width: 7px 0 7px 14px
            top: 50.5%
            left: 97%

@include responsive_1024
  .bl-video
    width: 100%
    height: 0!important
    padding-bottom: 40%
    .relative
      width: 100%
      height: 100%
      position: absolute
      .left-bar
        flex: 0 0 30%
        .relative-el
          .content
            font-size: 37px
            line-height: 40px
            margin-left: 10px!important
            padding-right: 30px
          .button
            width: 50px
            height: 50px
          .arrow
            border-width: 11px 0 11px 24px
            top: 50.4%
          .middle-arrow
            border-width: 7px 0 7px 14px
            top: 50.5%
            left: 97%

@include responsive_1200
  .bl-video
    .relative
      .left-bar
        .relative-el
          flex: 0 0 30%
          align-items: start
          .content
            font-size: 40px
            line-height: 50px
            margin-left: 30px!important
          .button
            width: 150px
            height: 170px
          .arrow
            border-width: 35px 0 40px 77px
@include responsive_1400

@include responsive_mobile
  .bl-video
    height: auto!important
    padding-bottom: unset
    .relative
      display: flex
      flex-direction: column-reverse
      position: unset
      .left-bar
        height: auto
        flex: unset
        .relative-el
          padding: 15px
          .content
            margin-left: 0!important
          .middle-arrow
            display: none!important
          .button
            right: 15px
            transform: translate(0%, -50%)
          .mute
            top: 50%
            left: 25%
          .stop
            top: 50%
            left: 75%
      .group-video
        position: relative
        height: 0
        padding-bottom: 56.25%
        .relative-el
          position: absolute
          width: 100%
          height: 100%
          img
            position: absolute
            width: 100%
            height: 100%
            object-fit: cover