.search-wrapper { margin:0 auto; max-width:940px; padding:0 20px; position:relative; z-index:450; }
.search-wrapper .search-box { float:right; margin:5px 0 -40px 10px; height:40px; display:inline-block; vertical-align:top; }
.search-wrapper .search-box .form-search { border:1px solid #d7d7d7; background:#f5f5f5; border-radius:2px; position:relative; }
.search-wrapper .search-box .focus .form-search { border-color:#3aa8b9; background:#fff; }
.search-wrapper .search-box .form-list { float:left; }
.search-wrapper .search-box .form-list li { margin:0; }

.search-wrapper .search-box .input-box { margin:0; padding:0; display:inline-block; width:auto; background:none; }
.search-wrapper .search-box .input-text { width:240px; margin:0; padding:4px 7px; height:20px; color:#777; font-size:13px; line-height:16px; background:none; border:0; vertical-align:middle; }
.search-wrapper .search-box .input-text:focus { color:#444; font-style:normal; }
.search-wrapper .search-box .button { margin:0 0 0 -9px; padding:0; width:36px; height:29px; float:right; text-indent:-9999em; cursor:pointer; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAWlJREFUeNqc000oRFEYxvF7p/FRNoosaFayko2PxSjZSFKyEBayQGKshKw0JRbKipgispESCxuyEBvJykdSI7ZKWZBIMsX/TM/UdJ0Z07z169yZTs957znnuqFQyEmqIrShFsV4xz0Oce1YKhKJxEd/0n8DWECBZf4cdtCv8D/l0ziMNYWYsQb5KEEP7tCJA+SmCirHIn7QhUFc4AvP2FLwCRowmSpoDDlYVvu2+kA33jBu68oEtep50UlfprttFCJoCwrgU6fzX11qDNiCYjo9XwZBeRpjtqCo9iiYQVCjxqgtaFfPYbhpQqrRjgdc2YLMJj+hGUueS5qoSuxpoUeU2oLMkXboxo7gBhNo0SVc1SYHdCDm9c5RlRyUWP0M9VhHHeY9C75gWlelQqGnauDITHA9H62rwCaU4VXd7Ktzcygr6NP8bwzx4W54gzKtKcwk/Q77nOxqFr3qKB7kd7KvTdxiFMe/AgwAES9MFaxsq6oAAAAASUVORK5CYII=) no-repeat 50% 50%; }

.search-box .close-mark { display:none !important; }
.search-box .icon-mark,
.search-box .search-cancel,
.search-box .selected,
.search-box .arrow-up,
.search-box .amount { display:none; }


.search-box .search-autocomplete { padding:0; width:283px; position:absolute; left:-1px; top:33px; z-index:500; }
.search-box .search-autocomplete ul { padding:0; background:#fff; border:1px solid #3aa8b9; box-shadow:4px 4px 0 rgba(0,0,0,0.07); text-align:left; }
.search-box .search-autocomplete li { margin:0; padding:8px 10px 8px 30px; position:relative; z-index:99; cursor:pointer; color:#777; font-size:14px; line-height:16px; }
.search-box .search-autocomplete .last { padding-bottom:12px; }
.search-box .search-autocomplete .match,
.search-box .search-autocomplete .partial-found { font-weight:bold; color:#444; }
.search-box .search-autocomplete li:hover, 
.search-box .search-autocomplete li.selected { background:#f0f0f0; }
.search-box .search-autocomplete .find-more a,
.search-box .search-autocomplete .match .text { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.search-box .search-autocomplete .match .text { float:left; width:86%; }
.search-box .search-autocomplete .match .count { float:left; width:14%; font-weight:normal; color:#aaa; font-size:13px; text-align:right; }
.search-box .search-autocomplete div.location { margin:0; color:#777; font-size:13px; line-height:15px; clear:both; }
.search-box .search-autocomplete .s-icon { margin:3px 0 -10px -20px; width:12px; height:15px; float:left; }
.search-box .search-autocomplete .location_category .s-icon,
.search-box .search-autocomplete .category .s-icon { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAGlJREFUeNpi/P//PwM2kJWVVQ+kGtDFmUhRjFUDuuJp06YxgjBWDfhMhgFGmB+IUQy3gVjFQNDI/OrVK6IVA/3SALKBkVjFYCdBGY3EKIb7AY8mFMUowYpFE4ZilGBFiosGJAMwAECAAQAVLjhZE3TlXgAAAABJRU5ErkJggg==) no-repeat 0 0; }
.search-box .search-autocomplete .product_mock .s-icon { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAFZJREFUeNpizMzMfMzAwCDDAAXTpk1jzMrK+g+jGRDgCROyQmQNDJhAhgVdBM00VAB0xn8gYCCEQeqYGEgATNicgE5T7gzamUwIgML5Kd6wRYpBgAADAHUDfukzYSmHAAAAAElFTkSuQmCC) no-repeat 0 0; }
.search-box .search-autocomplete .location .s-icon { background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAMCAYAAACwXJejAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAANlJREFUeNpskL2uAWEQhr/dSISWikhErybUp6d1opXsXgDKLfVkiV6OigtQ+zkugYSIkoSObj2TzCayTPJkZr55953JWkEQGNd1E8aYLvxCDs4wgZ7v+w/LcZwkzQIq5jNW8GOrgwiu0IC85qu+t2P6INHCeq71iROe5Bk0xSmrg01kVdhnRLTXphwRhf1O1v1BEcasiJOXUIW+iqYiGkEH0vrBe9xhaHPsjcIz38Njfre1Eev/iGANAyks+eMS3FMgbSEFFyjhcpRZ6GR4OJBqIIN6KJB4CTAA4rM9wB8eAkYAAAAASUVORK5CYII=) no-repeat 0 0; }
.search-box .search-autocomplete .find-more { padding:0; border-top:1px solid #cdcdcd; }
.search-box .search-autocomplete .find-more a { padding:15px 28px 16px 10px; display:block; position:relative; z-index:99; color:#777; }
.search-box .search-autocomplete .find-more a:hover { text-decoration:none; color:#222; }
.search-box .search-autocomplete .find-more .r-icon { position:absolute; right:20px; top:14px; line-height:1; font-size:17px; line-height:1; }


#mob-search-trigger { display:none; }
#location-search-name-container { display:none; }


/* === < 600px === */
@media screen and (max-width:600px) {

  #mob-search-trigger { display:inline-block; float:right; margin:6px 10px 0 0; padding:5px; cursor:pointer; }
  #mob-search-trigger span { width:30px; height:30px; display:block; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAgZJREFUeNrslk9IVFEUh2fGKXIVROSmZECLELSdRgqKRRAI0jIaLIQWCVLgIo1CESELZtPGQJAggghRVy0qIkHURSESQUGgoEKUm6Acxer5HfgNXGT+vTcws5kDH+fO3Hff7513zzvnhj3PC5XCIqESWVm4aBbNdcHAp0QMdwMuwWk4CBvwHp7D62zrH9T3+RNGsAI3CHck5lo1dAl7gG5YKThiRE3oJXTqr28wDouwBSegA+LQBgtwHj4X+qpHHNGHcA/+OvMfYBoewRTUwQyc0YP5Ty6iPYm7rZ8J6N8n6tpXRWx7XuusC5TVlkgHYB3u53GPn/a8Gt+EcFDhi/IvyMhkngFYPvyB41AfVDgm/9FHku7AF41rgwpXyP/zWRP++ylK6S5ak2/wIWo5cUrj1aDCb+SvkOHRPIXtmz4MP2ApqPCEXluNPqVcZoKjGj/Nd4siaWrrsqqU2RD0Zll/DF45r7kJjhTSnW7BvBLtMcyqPFpxqYJGGFaJPOesa1VZzZnZ4UxHH/b3EO4JXMtxD6te71Q8UrYJl2EuU3eKZGln23CdYYv27rszbYXlraqcZX+PxruaP6r5uO+Incjdn5Vqkb8yXH4BJpVwZp4aziBBeIWcQJJZREOKstnpzWHV+7FiHH0s4c6qR6fsarHOXFZI2uEZ/Ia7vve4fLwtCwe1PQEGAAYveRCz0mL6AAAAAElFTkSuQmCC) no-repeat 0 0; }

  .cms-index-index #mob-search-trigger { display:none; }

  .mobile-view .search-box { display:block; margin:0; position:absolute; top:0; right:0; left:auto; width:auto; height:auto; z-index:1000; background:transparent; border:none; }
  .mobile-view .search-box .input-box { display:block; width:100%; padding:0; }
  .mobile-view .search-box .form-search { height:auto; border:none; border-radius:0; background:none; }
  .mobile-view .search-box .form-search button { display:none; }
  .mobile-view .search-box .form-search .form-list { width:auto; float:none; }
  .mobile-view .search-box #search { display:block; width:1px; height:1px; margin:0; padding:0; background:none; cursor:pointer; opacity:0; }
 
  .mobile-view #header-w .search-box { display:none; }

  /* Mobile search ON */
  .mobile-view.on-search #header-w,
  .mobile-view.on-search .topline,
  .mobile-view.on-search #nav,
  .mobile-view.on-search #main-banner,
  .mobile-view.on-search .search-wrapper .advert,
  .mobile-view.on-search .wrapper,
  .mobile-view.on-search .footer,
  .mobile-view.on-search #footer { display:none; }

  .mobile-view.on-search .search-container { border:0; }

  .mobile-view.on-search .search-wrapper { display:block; }
  .mobile-view.on-search .search-box { float:none; position:static; height:auto; width:auto; padding:12px; background:#fff; }
  .mobile-view.on-search .form-search { border:none; border-radius:0; height:auto; }
  .mobile-view.on-search .form-search .form-list { width:auto; float:none; }
  .mobile-view.on-search .search-autocomplete .arrow-up { display:none; }

  .mobile-view.on-search .search-box #search,
  .mobile-view.on-search .search-wrapper .search-cancel { font-size:16px; line-height:22px; font-weight:bold; height:auto; color:#404040; border:1px solid #d7d7d7; vertical-align:middle; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
  .mobile-view.on-search .search-box #search { width:68%; padding:9px 14px 9px 40px; cursor:auto; opacity:1; background:#f8f8f8 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAWlJREFUeNqc000oRFEYxvF7p/FRNoosaFayko2PxSjZSFKyEBayQGKshKw0JRbKipgispESCxuyEBvJykdSI7ZKWZBIMsX/TM/UdJ0Z07z169yZTs957znnuqFQyEmqIrShFsV4xz0Oce1YKhKJxEd/0n8DWECBZf4cdtCv8D/l0ziMNYWYsQb5KEEP7tCJA+SmCirHIn7QhUFc4AvP2FLwCRowmSpoDDlYVvu2+kA33jBu68oEtep50UlfprttFCJoCwrgU6fzX11qDNiCYjo9XwZBeRpjtqCo9iiYQVCjxqgtaFfPYbhpQqrRjgdc2YLMJj+hGUueS5qoSuxpoUeU2oLMkXboxo7gBhNo0SVc1SYHdCDm9c5RlRyUWP0M9VhHHeY9C75gWlelQqGnauDITHA9H62rwCaU4VXd7Ktzcygr6NP8bwzx4W54gzKtKcwk/Q77nOxqFr3qKB7kd7KvTdxiFMe/AgwAES9MFaxsq6oAAAAASUVORK5CYII=) no-repeat 12px 11px; }
  .mobile-view.on-search .search-wrapper .search-cancel { width:30%; padding:9px 0; position:absolute; top:0; right:0; display:block; text-align:center; background:#f8f8f8; cursor:pointer; }
  .mobile-view.on-search .search-wrapper .search-cancel:hover,
  .mobile-view.on-search .search-wrapper .search-cancel:active { background:#f0f0f0; }

  .mobile-view.on-search .ac-wrapper { margin:0 -12px !important; position:relative; }
  .mobile-view.on-search .search-autocomplete { width:100% !important; top:12px !important; left:0 !important; }
  .mobile-view.on-search .search-autocomplete ul { padding:10px 0 0; border:0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; }
  .mobile-view.on-search .search-autocomplete ul li { padding:5px 20px 5px 46px; }
  .mobile-view.on-search .search-autocomplete .find-more { padding:0; margin-top:10px; }
  .mobile-view.on-search .search-autocomplete .find-more a { padding-left:46px; }
}

/* === 600px - 979px === */
@media screen and (min-width:600px) and (max-width:979px) {
  #top-searchbox { margin:0; }
  #header-w .search-wrapper { clear:right; display:block; margin:0; padding:6px 0 0; }
  #header-w .form-search .input-text { width:260px; }
}

/* === < 320px === */
@media screen and (max-width:320px)  {
  #mob-search-trigger { padding:5px 0; margin:6px 7px 0 -10px; }
}
