Advertisement
Guest User

Untitled

a guest
Jun 19th, 2017
61
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.01 KB | None | 0 0
  1. @media screen and (min-width:1024px) {
  2. header {
  3. position: relative; @include header-de; z-index: 105;
  4. &#header-container {
  5. background: $de-body-bg-color-2;
  6. }
  7. .header {
  8. min-height: 150px; position: relative; @include site-width; padding: 0 20px; @include box-sizing;
  9. }
  10. #networks {
  11. float: right; margin: 8px 0 0 0;
  12. span {
  13. width: 20px; height: 20px; background: url("../images/social.png") no-repeat scroll 0 0 transparent;
  14. &.network-tw {
  15. background-position: -21px 0;
  16. }
  17. &.network-gp {
  18. background-position: -42px 0;
  19. }
  20. }
  21. }
  22. #logo {
  23. left: 13%; top: 50%; position: absolute; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);
  24. * {
  25. display: block; white-space: nowrap; text-align: center;
  26. }
  27. img {
  28. max-height: 130px; height: auto; width: auto; margin: 0 auto; max-width: 100%;
  29. }
  30. }
  31. #header-search, #header-cart {
  32. display: block; position:absolute; left: 30%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); text-align: right;
  33. }
  34. #header-search {
  35. form {
  36. width: 500px; height: 38px; @include box-sizing; @include border(1px, 1px, 1px, 1px, solid, $de-header-search-border-color);
  37. }
  38. #sbox {
  39. width: 462px; height: 36px; line-height: 36px; font-size: 14px;
  40. }
  41. .headerSearchButton {
  42. @include open-iconic('\e08f', 14px, $de-header-search-icon); position: relative; z-index: 1;
  43. &:before {
  44. position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%);
  45. }
  46. input {
  47. background: none; border: none; z-index: 2; position: relative; overflow: hidden; text-indent: -9999px; cursor: pointer; height: 36px; width: 36px;
  48. }
  49. }
  50. .header-search-advanced {
  51. margin: 0 0 3px;
  52. a {
  53. color: $de-header-text-color; opacity: 0.6;
  54. }
  55. }
  56. }
  57. #mobile-search, #mobile-cart, #mobile-international{
  58. display: none;
  59. }
  60. @media screen and (min-width:1024px) {
  61. #header-cart {
  62. left: auto; right: 20px; padding: 0 55px 0 0;
  63. .header-mini-cart-content {
  64. *:not('.view-more') {
  65. color: $de-main-color-2;
  66. }
  67. }
  68. #header-mini-cart-items{
  69. .mini-cart-box-name{
  70. max-width: 120px;
  71. a{
  72. word-wrap: break-word;
  73. }
  74. }
  75. }
  76. }
  77. }
  78. .header_mini_cart_wrapper {
  79. background: url("../images/cart.png") no-repeat scroll 100% 0 transparent; height: 46px; width: 45px; @include border(0, 0, 0, 1px, solid, $de-header-search-border-color); position: absolute; right: 0; top: 0;
  80. .header-mini-cart-link{ display: block; position: relative; width: 100%; height: 100%; z-index: 2; }
  81. }
  82. .header-mini-cart {
  83. background: $de-main-color-1; @include arrow(0, 5px, 5px, 5px, transparent, transparent, transparent, transparent, -6px, 15px, null, null); top: 55px; @include border(0, 1px, 1px, 1px, solid, $de-main-color-3);
  84. &:before {
  85. border-top-color: transparent;
  86. border-left-color: transparent;
  87. border-right-color: transparent;
  88. border-bottom-color: $de-main-color-2;
  89. }
  90. &:after {
  91. height: 20px; background: transparent; top: -21px; left: -1px; right: -1px; @include border(0, 0, 3px, 0, solid, $de-main-color-2); display: block; content: ""; position: absolute; z-index: 999;
  92. }
  93. }
  94. .header-cart-title {
  95. text-transform: uppercase; margin: 4px 0 0;
  96. }
  97. .view_cart {
  98. font-size: 18px; margin: 2px 0 0;
  99. }
  100. #responsive-menu-link{
  101. @include box-sizing-default;
  102. }
  103. }
  104. }
  105. @media screen and (width:800px) {
  106. .quick_search_results { top: 45%!important; width: 500px!important; left: 87px!important;
  107. li span.name {
  108. width: 400px;
  109. }
  110. li span.description {
  111. width: 400px;
  112. }
  113. li span.price {
  114. width: 400px;
  115. text-align: right;
  116. }
  117. }
  118. }
  119. @media screen and (width:1024px) {
  120. .quick_search_results { width: 500px!important; left: 356px!important;
  121. li span.name {
  122. width: 400px;
  123. }
  124. li span.description {
  125. width: 400px;
  126. }
  127. li span.price {
  128. width: 400px;
  129. text-align: right;
  130. }
  131. }
  132. }
  133. @media screen and (width:1152px) {
  134. .quick_search_results { width: 500px!important; left: 412px!important;
  135. li span.name {
  136. width: 400px;
  137. }
  138. li span.description {
  139. width: 400px;
  140. }
  141. li span.price {
  142. width: 400px;
  143. text-align: right;
  144. }
  145. }
  146. }
  147. @media screen and (width:1280px) {
  148. .quick_search_results { width: 500px!important; left: 434px!important;
  149. li span.name {
  150. width: 400px;
  151. }
  152. li span.description {
  153. width: 400px;
  154. }
  155. li span.price {
  156. width: 400px;
  157. text-align: right;
  158. }
  159. }
  160. }
  161. @media screen and (width:1360px) { /** netestat **/
  162. .quick_search_results { width: 500px!important; left: 474px!important;
  163. li span.name {
  164. width: 400px;
  165. }
  166. li span.description {
  167. width: 400px;
  168. }
  169. li span.price {
  170. width: 400px;
  171. text-align: right;
  172. }
  173. }
  174. }
  175. @media screen and (width:1366px) {
  176. .quick_search_results { width: 500px!important; left: 477px!important;
  177. li span.name {
  178. width: 400px;
  179. }
  180. li span.description {
  181. width: 400px;
  182. }
  183. li span.price {
  184. width: 400px;
  185. text-align: right;
  186. }
  187. }
  188. }
  189. @media screen and (width:1400px) {
  190. .quick_search_results { width: 500px!important; left: 494px!important;
  191. li span.name {
  192. width: 400px;
  193. }
  194. li span.description {
  195. width: 400px;
  196. }
  197. li span.price {
  198. width: 400px;
  199. text-align: right;
  200. }
  201. }
  202. }
  203. @media screen and (width:1440px) { /** netestat **/
  204. .quick_search_results { width: 500px!important; left: 514px!important;
  205. li span.name {
  206. width: 400px;
  207. }
  208. li span.description {
  209. width: 400px;
  210. }
  211. li span.price {
  212. width: 400px;
  213. text-align: right;
  214. }
  215. }
  216. }
  217. @media screen and (width:1600px) {
  218. .quick_search_results { width: 500px!important; left: 594px!important;
  219. li span.name {
  220. width: 400px;
  221. }
  222. li span.description {
  223. width: 400px;
  224. }
  225. li span.price {
  226. width: 400px;
  227. text-align: right;
  228. }
  229. }
  230. }
  231. @media screen and (width:1680px) {
  232. .quick_search_results { width: 500px!important; left: 634px!important;
  233. li span.name {
  234. width: 400px;
  235. }
  236. li span.description {
  237. width: 400px;
  238. }
  239. li span.price {
  240. width: 400px;
  241. text-align: right;
  242. }
  243. }
  244. }
  245. @media screen and (width:1920px) {
  246. .quick_search_results { width: 500px!important; left: 754px!important;
  247. li span.name {
  248. width: 400px;
  249. }
  250. li span.description {
  251. width: 400px;
  252. }
  253. li span.price {
  254. width: 400px;
  255. text-align: right;
  256. }
  257. }
  258. }
  259. @media screen and (width:2560px) {
  260. .quick_search_results { width: 500px!important; left: 1075px!important;
  261. li span.name {
  262. width: 400px;
  263. }
  264. li span.description {
  265. width: 400px;
  266. }
  267. li span.price {
  268. width: 400px;
  269. text-align: right;
  270. }
  271. }
  272. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement