app.css

/**
* --------------------------------------------------------------------------
* HEADER
* --------------------------------------------------------------------------
*/

header {background:#242424; position: fixed; width: 100%; top: 0; height: 70px; z-index: 3; }

header .header-container {text-align: center; }
header .header-container .menu-search {float: left; text-align: left; }
header .menu-btn {color: #fff; padding: 25px 20px; cursor: pointer; float: left; border-right: 1px solid #acacac; }
header .searchArea {float: left; }
header .searchArea .search-btn {font-size: 16px; color: #fff; padding: 25px 5px 23px 25px;float: left; }
header .searchArea .form-search {display: none; position: absolute; background: #242424; top: 0; left: 155px; right: 0; z-index: 5; }
header .searchArea .search-tag-container {display: none; position: absolute; background: #242424; top: 0; bottom: 0; left: 109px; right: 0; z-index: 6; }
header .searchArea .search-tag-container .search-tag-list {display: table; margin-left: 15px; height: 100%;}
header .searchArea .search-tag-container .search-tag-list li {display: table-cell; vertical-align: middle; padding-right: 10px;}
header .searchArea .search-tag-container .search-tag-list li a {display: block; color: #fff; padding-left: 10px; border: 1px solid #fff; border-radius: 3px; text-decoration: none;}
header .searchArea .search-tag-container .search-tag-list li a:hover {border-color: #d9230f; color: #d9230f;}
header .searchArea .search-tag-container .search-tag-list li a:hover i {border-color: #d9230f;}
header .searchArea .search-tag-container .search-tag-list li a i {display: inline-block; padding: 9px 7px; border-left: 1px solid #fff; margin-left: 7px;}
header .searchArea .form-search input {-webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color: transparent; color: #fff; font-size: 16px; height: 70px; width: 95%; }
header .searchArea .form-search .close-search {float: right; padding: 20px; background-color: #555656; height: 70px; width: 5%; font-size: 20px; color: #fff; text-align: center; }
header .header-container .logo-container {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 4; }
header .menu-btn span {display: inline-block; vertical-align: middle; font-weight: bold; }
header .menu-btn span.img {margin-right: 10px; }
header .header-container .soc-m-container {float: right; }
header .soc-m-container ul li {float: left; vertical-align: middle; border-left: 1px solid #acacac; }
header .soc-m-container ul li:first-child {display: none; }
header .soc-m-container ul li a {display: block; padding: 18px 20px 17px; color: #fff; font-size: 25px; }
header .soc-m-container ul li:hover a {background:#fff;color:#242424;}