Mary Солнечная

Надо добавить блоку #news
position:relative; z-index:1;
а картинке:

position: relative;
 z-index: -1;

Тыц

теперь css такой:

.clearfix:after{
  content:'';
  display:table;
  clear:both;
}
#news a{
  display:block;
}
#news {
  float: left;
  width: 100%;
  height: 300px;
  background: #3E3E3E;
  position: relative;
  z-index: 1;
}

#news article {
  width: 400px;
  height: 250px;
  margin: 15px;
  box-shadow: inset 0px 0px 20px 10px rgba(0,0,0,0.6);  /*Тень*/
}

#news article img {
  width: 400px;
  height: 250px;
  position: relative;
  z-index: -10;
}

#news article h1 {
  position: absolute;
  top: 190px;
  left: 15px;
  font-size: 1.1em;
  color: #FFF;
}

Это самые обыкновенные табы:
Тыц.
Только вам надо добавить треугольничек, это тоже просто делается:
Например, отследить по клику: если есть класс, который делает активным цифру, то показать его треугольник, если нет - не показывать

Не на codepen, но типа таво. Это один из многих вариантов верстки такого блока
Тыц

Совет - если хотите научиться - не стоит бездумно копировать. Копируя, не разобравшись, траблов будет в десятки раз больше, что приведет к полному тупизму и неспособности решать самые простые задачи (что уже говорить о программировании)

а вы инициализировали сам плагин карусельки?

типа таво:

$(document).ready(function(){
  $(".owl-carousel").owlCarousel();
});

Создаете родительский блок, вокруг которого будут несколько дочерних:

<div class="content_wrap">
    <div class="content_box">
         <i></i>
         <span>Признание</span>
     </div>
<div class="content_box">
         <i></i>
         <span>Отношение</span>
     </div>
</div>
<div class="content_box">
         <i></i>
         <span>Самосовершенствование</span>
</div>

и т.д.

Родительскому - position: relative
Дочерним - position: absolute и вертите их и переставляйте как вам надо

Внутри дочерних у вас идет иконка и текст. Делаете внутренности блочными элементами, выравнивайте по центру и они сами встанут куда надо

Доброго дня! :)
Последнее, чем я пользовалась:
stackoverflow.com/questions/33800622/slick-carouse...

Статья годовалыш, но можно поковыряться в документации: там тоже есть rows, можно поиграца

У вас там разметка такая забавная. Скорее всего там все было под ваши задачи, но вам можно ее немного упростить:
1) родительский блок > блок-контейнер для флекса>дочерние блоки, которые вы будете флексить
Дочерние блоки - ссылки. Добавьте логотип ссылкой в меню
Вроде так:
Тыц