Виталий, спасибо! Поиск у меня теперь лежит внутри слоя header переделала все .footer на соответствующий слой. И перенесла этот блок search под header (надеюсь я правильно изъясняюсь) И вид у поиска стал симпатичнее
Но вот какой момент, при наведении мышки он работает не только как поиск, но и как ссылка на страницу поиска. Может подскажите где еще поправить? У вас это хорошо и очень понятно получается)
Это то как сейчас все выглядит:
http://world-lash.com/
/* |===============| header start |===============| */
.header{
margin: 0 0 30px;
}
.header__center{
display: table;
height: 130px;
}
.logo{
display: table-cell;
vertical-align: middle;
padding: 10px 20px 10px 0;
width: 362px;
color: #2e2e2e;
font-weight: 300;
}
.header__unit{
display: table-cell;
vertical-align: middle;
padding: 10px 18px 10px 0;
font: 14px/20px 'Myriad Pro';
}
.logo + .header__unit{
width: 250px;
}
.header__unit:last-child{
padding: 0 2px 0 0;
width: 219px;
}
.header__unit a:hover{
color: #a21712;
}
.tel{
font: 300 24px/26px 'Myriad Pro';
letter-spacing: -0.8px;
}
.light-nav{
overflow: hidden;
font: 14px/20px 'Myriad Pro';
}
.light-nav li{
position: relative;
display: inline-block;
margin-right: 7px;
}
.light-nav li:before{
content: "•";
position: absolute;
left: -7px;
top: 0;
}
.light-nav a{
color: #2e2e2e;
padding-right: 3px;
}
.light-nav a:hover{
color: #e32119;
}
.header__unit .fa{
margin: 0 5px 0 0;
}
/* |===============| header end |===============| */
/* |===============| search start |===============| */
#wrapper .header .search{
position: relative;
float: right;
margin: 14px 0 0;
}
#wrapper .header .search input{
margin: 0;
padding: 7px 31px 6px 9px;
font: 14px/18px 'Myriad Pro';
width: 231px;
height: 31px;
background-color: transparent;
color: #fff;
}
#wrapper .header .search input:focus{
border-color: #fff;
}
#wrapper .header .submit_search,
#wrapper .header .submit_search:hover,
#wrapper .header .submit_search:focus{
position: absolute;
top: -2px;
right: 6px;
border: 0;
padding: 0;
width: 23px;
height: 31px;
background: none;
color: #bbc3c6;
}
#wrapper .header .submit_search:after{
content: "\f002";
font: 13px fontawesome;
vertical-align: middle;
}
#wrapper .header .submit_search:hover,
#wrapper .header .submit_search:focus{
color: #fff;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.header__copy{
float: left;
text-align: center;
margin: 0 0 0 164px;
width: 520px;
font-size: 14px;
}
/* |===============| search end |===============| */