Rsa97

В элемент <a> нельзя вкладывать интерактивные элементы (<a>, <button>, <details>, <embed>, <iframe>, <keygen>, <label>, <select> и <textarea>).
Повесьте на вложенный элемент обработчик события click и выполняйте переход средствами JavaScript.

Потому что общее правило для .content идёт после секции media и, соответственно, перекрывает правила, указанные в секции.

Откройте в инспекторе вкладку "Вычислено" для нужного элемента, найдите там font-size и посмотрите весь ранжированный список правил.

Отталкивайтесь от чего-то одного. Например:

width: 15vw;
height: 20vw;

document.querySelector('[field="li_text__1548019878534"]').style.display='none';

document.addEventListener(
  'click',
  (e) => {
    if (e.target.closest('.youCantClickMe')) {
      e.stopPropagation()
      return
    }
    if (!e.target.closest('.clickMe')) {
      return
    }
    // do something
  }
)

.block .item { } - все потомки элемента с классом block имеющие класс item
.block > .item { } - непосредственные потомки элемента с классом block имеющие класс item

Потому что размер можно задавать только блочным элементам, а у вас стоит display: inline. Поставьте inline-block.

nth-child() считает среди всех потомков родителя, а не среди предварительно выбранных.
Запись .slick-active:nth-child(2) означает, что элемент должен иметь класс slick-active и при этом являться вторым потомком своего родителя.

Категория иконок не указана, этот символ есть только в solid-версии (fas).

<a href="#" class="fas fa-long-arrow-alt-right"></a>