Работа с Landing page

Добрый день, коллеги! Нужны пара советов новичку, т.е. мне.

Сейчас разбираю структуру Landing page.

Скачал с одного сайта Шаблон-образец Landing page и не могу понять два вопроса:

1. Почему в оригинале logo.png (2 сотки) не имеют белых границ по краям на сайте, а сохраненный вместо него холодильник, тоже в формате *.png имеет белые границы, как в оригинале. В чем причина?

2. Как именно при уменьшении экрана исчезает верхнее меню и вместо него появляется кнопка с 3 полосками, содержащее выпадающее меню.

Смотрю вложенный responsive.css, в нем в основном уменьшаются тексты и кнопки. А код выпадающей кнопки в него не входит. Где искать эту кнопку? В CSS-файлах или в JS-файлах?

Это код выпадающей кнопки:

<div class="container-fluid nav-bar">
    <div class="navbar-header"> // код выпадающей кнопки
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    <a href="index.html"><img src="img/logo.png" alt="" class="img-responsive logo"></a>
</div>    

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> // код верхнего меню
    <ul class="nav navbar-nav navbar-right">
        <li><a href="#home">Домой</a></li>
        <li><a href="#features">Функции</a></li>
        <li><a href="#about">Описание</a></li>
        <li><a href="#testimonials">Отзывы</a></li>
        <li><a href="#pricing">Цены</a></li>
        <li><a href="#contact">Контакты</a></li>
    </ul>
</div>

А это код responsive.css:

@media (min-width: 480px) and (max-width: 767px) {
.banner h3 {
  font-size: 11px;
  margin-top: 105px;
}
.banner h1 {
  font-size: 25px;
}
.banner p {
  font-size: 14px;
  margin-top: 17px;
}
.download-btn {
  width: 130px;
  height: 40px;
  font-size: 12px;
  margin-top: 30px;
}
.features-btn {
  width: 130px;
  height: 40px;
  font-size: 12px;
  margin-top: 30px;
}
h2 {
  font-size: 25px;
  margin-bottom: 20px;
}
.contact {
  height: 900px;
}
h4 {
  font-size: 12px;
  margin-top: 40px;
}
.features p {
  font-size: 15px;
  margin-bottom: 40px;
}
.features h3 {
  font-size: 20px;
}
.details p {
  font-size: 14px;
  margin: 20px 0;
}
    .details ul li {
  font-size: 14px;
}
.feature-detail h4 {
  margin-top: 50px;
}
.feature-detail p {
  font-size: 13px;
  margin-top: 10px;
}
.pricing-slide p {
  font-size: 16px;
  margin-top: 35px;
  margin-bottom: 20px;
}
.item h6 {
  font-size: 13px;
}
.item h5 {
  font-size: 12px;
}
.item img {
  margin-bottom: 95px;
}
.download p {
  font-size: 24px;
  padding: 30px 0;
}
.download button{
    margin-top: 0;
    margin-bottom: 20px;
}
.contact p {
  font-size: 14px;
}
.contact-heading img {
  margin-bottom: 25px;
}