form.header-search{
display: inline-block;
vertical-align: middle;
float: right;
margin: 0;
.searchContainer{
display: block;
float: none;
margin: 0;
}
#siteSearch{
width: 0px;
padding: 0px;
border: none;
margin: 0;
height: 50px;
position: absolute;
top: 50px;
right: $site-container-padding;
box-shadow: 0 3px 10px rgba(0,0,0,0.2);
transition: all $transition-duration $transition-curve;
&:focus {
outline: 0;
}
}
button{
width: 40px;
height: 40px;
overflow: hidden;
padding: 0;
background-color: transparent;
border-radius: 0px;
margin: 0;
&:before{
margin: 0;
font-weight: normal;
width: 40px;
height: 40px;
line-height: 40px;
display: block;
color: $main-font-colour;
font-size: 20px;
font-family: $icon-font-family;
@if $icon-font-family == 'Genericons' {
content: '\f400';
}
@if $icon-font-family == 'FontAwesome' {
content: '\f002';
}
}
&:hover:before {
color: $primary-colour;
}
}
&.search-exposed #siteSearch {
width: 400px;
padding: 15px;
border: 1px solid $border-color;
}
}