Здравствуйте. Подскажите пожалуйста, могу ли я свободно задавать стили для бутстрап меню?
<!DOCTYPE HTML>
<html lang="en-US">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="style.css">
<title>Zont-SPB</title>
<meta charset="UTF-8">
<head>
<div class="container">
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div id="logo">
<a href="index.html">
<img src="logo1.png" alt="" />
</a>
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div id="contacts">
<span style="font-size: 16px;" class="glyphicon glyphicon-envelope"></span>E-mail:
<p>
<span style="font-size: 16px"; class="glyphicon glyphicon-phone"></span>Телефон:
</p>
</div>
</div>
</div>
<div class="navbar ">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse">
<ul class="nav navbar-nav">
<li>
<a href="#">Главная</a>
</li>
<li>
<a href="#">Демо-доступ</a>
</li>
<li>
<a href="catalog.html">Каталог</a>
</li>
<li>
<a href="contact.html">Контакты</a>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
Мне нужно, чтобы финальный результат был такой как на скрине:
И если вам не трудно, может быть вы могли бы подсказать, необходимые стили , и + стиль для изменения цвета ссылки в главном меню, когда на неё наводишь курсор. Заранее спасибо, всем удачи.