html {
}
header {
float: right;
top: 20px;
left: 440px;
position: relative;
width:40px
}
.header-button {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-indent: -119988px;
overflow: hidden;
text-align: left;
text-transform: capitalize;
position: relative;
z-index: 1;
display: block;
width: 60px;
height: 60px;
margin: 0;
padding: 0;
outline: none;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALQAAAA8CAQAAABlJ1gMAAABfElEQVR42u3ZsU7CUBhA4U6Iib5IITigOzMzzwUMmNA3MRofwMSRCDB1MPIAOoDBHAch0VhUCb2Ecr4uBJb23Oa/FKJIkiRJkiRJkiRJygENElJSEhpEmxz6W+Z7Vu43S71PlxvTZsiMGQ+0iTe7szY6EuCOmJg7IClwaEr0eOOzN/ocBwqdwnJhYyAtbGhK3ACQcEGZMhckANxSChIayHxduNCXwISzL6deYQT0Chma3+RzmRUWQO3b+2fAgkrOgbd0vfsQurN2A0qATgFD72hwDIHzzNM/B4YBRkbW6Chg6DlwlHn6R8Dc0PmHPgWeA22C//lsT2f0+tFRBwaGDrMZdgsYekejo7rm610NWFA1dIgHlqtgDyoHEXr1CN6nTokT6vQBgAktZ/Q2j6wfla6ZAOMcUx9g6I9h0WXEKy8M6FIlosU419SHNjp+WPp8Uxs6UGpDZ6Y2dJDUedzRTz/uSFP/nN3WAjaZrs38SNPQkiRJkiRJkiRJKoB36w+U2Cj/A/EAAAAASUVORK5CYII=");
border: none;
cursor: pointer;
}
#toggle-menu {
float: left;
background-position: 0 0;
background-color: #bc0023;
}
#toggle-search {
float: right;
background-position: -60px 0;
}
#toggle-search.open:after {
top: 40px;
}
#toggle-search:after {
-moz-transition: top, 0.5s;
-o-transition: top, 0.5s;
-webkit-transition: top, 0.5s;
transition: top, 0.5s;
position: absolute;
top: 52px;
left: 50%;
margin-left: -8px;
content: "";
border-color: transparent transparent #e1e4e7;
border-style: solid;
border-width: 8px 8px 12px;
}
#toggle-basket {
position: relative;
float: right;
background-position: -120px 0;
}
#toggle-basket:before {
position: absolute;
top: 5px;
left: 0;
width: 2px;
height: 50px;
content: "";
background-color: #000;
}
#search-form {
-moz-transition: max-height, 0.5s;
-o-transition: max-height, 0.5s;
-webkit-transition: max-height, 0.5s;
transition: max-height, 0.5s;
position: relative;
right: 241px;
top: 0px;
width: 260px;
max-height: 0;
overflow: hidden;
background-color: #e1e4e7;
}
#search-form.open {
max-height: 40px;
}
#search-form fieldset {
position: relative;
margin: 0 60px 0 0;
padding: 0;
border: none;
}
#search-form input {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;
height: 40px;
}
#search-form input[type="search"] {
width: 100%;
padding-left:10px;
background: transparent;
border: none;
}
#search-form input[type="submit"] {
position: absolute;
bottom: 0;
right: 0;
width: 60px;
margin: 0;
padding: 0;
font-weight: 700;
text-transform: uppercase;
color: #516270;
background: #c6cacd;
border: none;
cursor: pointer;
}