MhMadHamster

jsfiddle.net/zLeau0qz/1

как-то так вышло
jsfiddle.net/6hwj9Le1/3

вы выставили 0 слайдов показывать и прокручивать, конечно у вас ничего не будет скролиться

slidesToShow: 1,
slidesToScroll: 1,

codepen.io/anon/pen/zGMXBr?editors=110
не кроссбраузерно

jsfiddle.net/9q1L7vx7/2 я задал высоту блоку #add-content в пикселях для наглядности (можно auto), если оставить там 100% высоту то с данной функцией ресайза это не сработает потому как колонка будет подгоняться по высоте и после непосредственного задания высоты блок #add-сontent будет становиться 100% от этой высоты колонки, хотя непонятно зачем это нужно было

jsfiddle.net/9btrar6s
адаптивно, под любое количество ячеек четное количеству строк

в опциях карте передавайте mapTypeId: google.maps.MapTypeId.SATELLITE

jsfiddle.net/vrLkrtex

jsfiddle.net/1vf7rkmk/3

codepen.io/anon/pen/XbPEpJ
в приведенном примере есть 2 способа решения данной проблемы, учтите что при использовании inline-block необходим комментарий на строчке 8, чтобы не было лишнего пространства между колонками
для того чтобы посмотреть в действии второй вариант необходимо добавить row класс va-bottom-flex и убрать у колонок класс va-bottom конечно же, учтите что не все браузеры поддерживают flexbox

jsfiddle.net/1cokLxfs/2

jsfiddle.net/bp0xrp1a

media screen and (max-width: 991px) and (min-width: 768px)
#mainmenu1 {
display: none;
}

codepen.io/anon/pen/KpeXvb

или поставьте background-size: 100% 100%; если не надо поддерживать ie8
картинка сплошной фон так что не заметно особо

Лишняя закрывающая скобка

#left-side{
  padding: 40px 40px;
  width: 50%;
  
}

  
}
#hide{