style.less 49 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782
  1. // imports
  2. @import "elements.less";
  3. @import "colors.less";
  4. @import "reset.less";
  5. @import "form-elements.less";
  6. // reset
  7. body {
  8. -webkit-font-smoothing: subpixel-antialiased;
  9. font-family: 'Open Sans', sans-serif;
  10. font-weight: 400;
  11. background: @bg;
  12. color: @default-font-color;
  13. font-size: 14px;
  14. }
  15. ::-webkit-input-placeholder {
  16. color: #38424a;
  17. }
  18. :-moz-placeholder { /* Firefox 18- */
  19. color: #38424a;
  20. }
  21. ::-moz-placeholder { /* Firefox 19+ */
  22. color: #38424a;
  23. }
  24. :-ms-input-placeholder {
  25. color: #38424a;
  26. }
  27. // top
  28. .nav-mobile,
  29. .search-mobile,
  30. .login-mobile,
  31. .cart-mobile {
  32. display: none;
  33. }
  34. .top {
  35. position: static;
  36. width: 100%;
  37. height: 150px;
  38. background: @top-bg;
  39. z-index: 9999;
  40. }
  41. .top-links {
  42. background: @top-links-bg;
  43. border-bottom: 1px solid @top-links-border-bottom;
  44. height: 30px;
  45. }
  46. .top-links a {
  47. color: @top-links-link-color;
  48. text-decoration: none;
  49. font-size: 11px;
  50. font-weight: 400;
  51. }
  52. .top-links a:hover {
  53. color: @top-links-link-color-hover;
  54. }
  55. .top-links a > i {
  56. padding: 0 3px 0 0;
  57. }
  58. .top-links > .inner {
  59. width: 1180px;
  60. margin: 0 auto;
  61. height: 30px;
  62. position: relative;
  63. }
  64. .top-links .c-service {
  65. float: left;
  66. height: 30px;
  67. }
  68. .top-links .c-service > a {
  69. display: inline-block;
  70. margin: 7px 0 0 0;
  71. }
  72. .top-links .links {
  73. margin: 0 auto;
  74. position: absolute;
  75. left: 0;
  76. right: 0;
  77. width: 500px;
  78. }
  79. .top-links .links > ul {
  80. list-style-type: none;
  81. white-space: nowrap;
  82. text-align: center;
  83. font-size: 0;
  84. }
  85. .top-links .links > ul li {
  86. display: inline-block;
  87. padding: 0 10px 0 0;
  88. }
  89. .top-links .links > ul li:before {
  90. display: inline-block;
  91. content: "\f111";
  92. font-size: 5px;
  93. font-family: 'FontAwesome';
  94. color: @top-links-link-color;
  95. padding: 0 10px 0 0;
  96. position: relative;
  97. top: 3px;
  98. }
  99. .top-links .links > ul li:first-child:before {
  100. content:"";
  101. display: none;
  102. }
  103. .top-links .links > ul li > a {
  104. font-size: 11px;
  105. display: inline-block;
  106. margin: 7px 0 0 0;
  107. vertical-align: middle;
  108. }
  109. .logout-btn {
  110. margin: 0;
  111. border-left: 1px solid @top-links-border-bottom;
  112. border-right: 1px solid @top-links-border-bottom;
  113. display: inline-block;
  114. padding: 7px 10px;
  115. height: 30px;
  116. vertical-align: top;
  117. }
  118. .login-reg {
  119. float: right;
  120. height: 30px;
  121. }
  122. .login-reg-btn {
  123. margin: 0;
  124. border-left: 1px solid @top-links-border-bottom;
  125. border-right: 1px solid @top-links-border-bottom;
  126. display: inline-block;
  127. padding: 7px 10px;
  128. height: 30px;
  129. vertical-align: top;
  130. }
  131. .login-reg-dropdown .login-reg-btn {
  132. background: @top-links-border-bottom;
  133. color: @top-links-link-color-hover;
  134. }
  135. .login-dropdown {display: none;}
  136. .login-reg-dropdown .login-dropdown {
  137. display: block;
  138. position: absolute;
  139. right: 0;
  140. top: 30px;
  141. background: @top-links-border-bottom;
  142. width: 300px;
  143. padding: 0 15px 15px 15px;
  144. color: @login-dropdown-font-color;
  145. z-index: 99999999;
  146. }
  147. .login-dropdown .title {
  148. width: 100%;
  149. border-bottom: 1px solid @login-dropdown-font-color;
  150. font-family: 'geomanistbook';
  151. font-size: 14px;
  152. text-transform: uppercase;
  153. padding: 0 0 5px 0;
  154. margin: 15px 0 10px 0;
  155. }
  156. .login-dropdown .input-row {
  157. height: 65px;
  158. }
  159. .login-dropdown .input-row > label {
  160. display: block;
  161. font-size: 12px;
  162. font-weight: 600;
  163. height: 19px;
  164. }
  165. .login-dropdown .input-row > label > span {
  166. display: inline;
  167. color: #e5e8ed;
  168. }
  169. .login-dropdown .input-row > .error-msg {
  170. display: none;
  171. }
  172. .login-dropdown .error > .error-msg {
  173. height: 12px;
  174. color: @error;
  175. font-size: 11px;
  176. display: block;
  177. }
  178. .login-dropdown .input-row > .form-check > .error-msg {
  179. display: none;
  180. }
  181. .login-dropdown .input-row > .form-check > .error-msg {
  182. height: 12px;
  183. color: @error;
  184. font-size: 11px;
  185. display: block;
  186. }
  187. .login-dropdown .input-row > label > .fg-passw {
  188. float: right;
  189. display: inline-block;
  190. }
  191. .login-dropdown > .btn {
  192. margin: 0 0 10px 0;
  193. font-size: 14px;
  194. color: @button-color;
  195. padding-top: 5px;
  196. }
  197. .login-dropdown > p, .login-dropdown > p > a {
  198. font-size: 12px;
  199. }
  200. .or {
  201. margin: 15px 0 15px 0;
  202. height: 1px;
  203. border-bottom: 1px solid @or-line;
  204. position: relative;
  205. }
  206. .or > span {
  207. display: inline-block;
  208. position: absolute;
  209. margin: 0 auto;
  210. top: -10px;
  211. left: 0;
  212. right: 0;
  213. padding: 0 10px;
  214. text-align: center;
  215. }
  216. .or > span > span {
  217. display: inline-block;
  218. background: @top-links-border-bottom;
  219. font-family: 'geomanistbook';
  220. font-size: 10px;
  221. text-transform: uppercase;
  222. padding: 0 5px;
  223. color: @or-line;
  224. }
  225. // top-middle - logo, searc, cart
  226. .top-middle {
  227. background: @top-middle-bg;
  228. height: 80px;
  229. position: relative;
  230. background: @top-bg;
  231. z-index: 999;
  232. }
  233. .top-middle > .inner {
  234. width: 1180px;
  235. margin: 0 auto;
  236. }
  237. .logo {
  238. display: block;
  239. border: none;
  240. width: 250px;
  241. height: 50px;
  242. background: url('../img/logo_web.png') center no-repeat;
  243. background-position: left;
  244. background-size: contain;
  245. float: left;
  246. margin: 15px 0 0 0;
  247. }
  248. .search {
  249. display: block;
  250. width: 580px;
  251. height: 40px;
  252. position: absolute;
  253. left: 0;
  254. right: 0;
  255. top: 20px;
  256. margin: 0 auto;
  257. }
  258. .cart {
  259. float: right;
  260. color: @cart-color;
  261. text-align: right;
  262. font-size: 16px;
  263. font-family: 'geomanistbook';
  264. margin: -22px 0 0 0;
  265. text-transform: uppercase;
  266. }
  267. .cart > span {
  268. display: block;
  269. }
  270. .cart > span > i {
  271. padding: 0 8px 0 0;
  272. }
  273. .cart > .desc {
  274. float: right;
  275. color: @cart-desc-color;
  276. font-family: 'Open Sans', sans-serif;
  277. font-size: 12px;
  278. text-transform: lowercase;
  279. }
  280. .cart:hover > .desc {
  281. text-decoration: underline;
  282. }
  283. .cart:hover {
  284. text-decoration: none;
  285. }
  286. // main nav
  287. .nav {
  288. border-top: 1px solid @nav-border-color;
  289. border-bottom: 1px solid @nav-border-color;
  290. height: 40px;
  291. background: @top-bg;
  292. z-index: 99;
  293. }
  294. .nav > .inner {
  295. width: 1180px;
  296. height: 40px;
  297. margin: 0 auto;
  298. }
  299. .nav > .inner > ul {
  300. -ms-flex-wrap:wrap;
  301. -webkit-flex-wrap:wrap;
  302. display:-ms-flexbox;
  303. display:-webkit-box;
  304. display:-webkit-flex;
  305. display:flex;
  306. flex-wrap:wrap;
  307. list-style:none;
  308. margin:0;
  309. padding:0;
  310. position:relative;
  311. width:100%;
  312. height: 38px;
  313. }
  314. .nav > .inner > ul li {
  315. box-sizing: border-box;
  316. height: 38px;
  317. -ms-flex:1 1 auto;
  318. -webkit-box-flex:1;
  319. -webkit-flex:1 1 auto;
  320. flex:1 1 auto;
  321. position:relative;
  322. border-left: 1px solid @nav-border-color;
  323. }
  324. .nav > .inner > ul li:last-child {
  325. border-right: 1px solid @nav-border-color;
  326. }
  327. .nav > .inner > ul li > a {
  328. color: @nav-color;
  329. height: 38px;
  330. -ms-flex-align:center;
  331. -ms-flex-pack:center;
  332. -webkit-align-items:center;
  333. -webkit-box-align:center;
  334. -webkit-box-pack:center;
  335. -webkit-justify-content:center;
  336. align-items:center;
  337. display:-ms-flexbox;
  338. display:-webkit-box;
  339. display:-webkit-flex;
  340. display:flex;
  341. justify-content:center;
  342. line-height: 14px;
  343. font-size: 13px;
  344. font-family: 'geomanistbook';
  345. text-transform: uppercase;
  346. }
  347. .nav > .inner > ul li > a:hover {
  348. color: @nav-hover-color;
  349. text-decoration: none;
  350. }
  351. // footer
  352. .footer {
  353. position: relative;
  354. z-index: 0;
  355. }
  356. .footer > .social {
  357. background: @top-links-bg;
  358. border-top: 1px solid @top-links-border-bottom;
  359. border-bottom: 1px solid @top-links-border-bottom;
  360. height: 70px;
  361. }
  362. .footer > .social > .inner {
  363. width: 1180px;
  364. text-align: center;
  365. margin: 0 auto;
  366. }
  367. .footer > .social > .inner > a {
  368. display: inline-block;
  369. width: 36px;
  370. height: 36px;
  371. margin: 16px 5px 0 5px;
  372. color: @top-links-link-color;
  373. text-align: center;
  374. }
  375. .footer > .social > .inner > a:hover {
  376. color: @top-links-link-color-hover;
  377. background: @social-link-hover;
  378. }
  379. .footer > .social > .inner > a > i {
  380. font-size: 18px;
  381. padding: 10px 0 0 0;
  382. z-index: 2;
  383. }
  384. .copyright {
  385. background: @copyright-bg;
  386. color: @top-links-link-color;
  387. text-align: center;
  388. padding: 15px 0;
  389. font-family: 'geomanistlight';
  390. font-size: 12px;
  391. text-transform: uppercase;
  392. border-top: 1px solid @top-links-border-bottom;
  393. border-bottom: 1px solid @top-links-border-bottom;
  394. }
  395. .bottom-boxes {
  396. background: @copyright-bg;
  397. color: @top-links-link-color;
  398. }
  399. .bottom-boxes > .inner {
  400. width: 1180px;
  401. margin: 0 auto;
  402. display: table;
  403. }
  404. .bottom-boxes > .inner > .box {
  405. width: 25%;
  406. display: table-cell;
  407. border-left: 1px solid @top-links-border-bottom;
  408. padding: 20px 20px;
  409. }
  410. .bottom-boxes > .inner > .last {
  411. border-right: 1px solid @top-links-border-bottom;
  412. }
  413. .bottom-boxes > .inner > .box > .footer-title {
  414. font-size: 16px;
  415. color: @bottom-box-title;
  416. font-family: 'geomanist_regularregular';
  417. text-transform: uppercase;
  418. margin: 0 0 15px 0;
  419. }
  420. .bottom-boxes > .inner > .box > .footer-title > i {
  421. display: none;
  422. }
  423. .bottom-boxes > .inner > .box > .footer-dropdown > ul {
  424. list-style: none;
  425. font-size: 12px;
  426. }
  427. .bottom-boxes > .inner > .box > .footer-dropdown > ul li {
  428. display: block;
  429. padding: 0 0 1px 13px;
  430. position: relative;
  431. }
  432. .bottom-boxes > .inner > .box > .footer-dropdown > ul li:before {
  433. display: inline-block;
  434. content: "\f111";
  435. font-size: 5px;
  436. font-family: 'FontAwesome';
  437. color: @top-links-link-color;
  438. padding: 0 10px 0 0;
  439. position: absolute;
  440. top: 9px;
  441. left: 0px;
  442. }
  443. .bottom-boxes > .inner > .box > .footer-dropdown > ul li a,
  444. .bottom-boxes > .inner > .box > .footer-dropdown > p > a {
  445. color: @bottom-box-color;
  446. font-size: 12px;
  447. }
  448. .bottom-boxes > .inner > .box > .footer-dropdown > ul li a:hover,
  449. .bottom-boxes > .inner > .box > .footer-dropdown > p > a:hover {
  450. color: @bottom-box-color-hover;
  451. }
  452. .bottom-boxes > .inner > .box > .footer-dropdown > p {
  453. font-size: 12px;
  454. margin: 0 0 10px 0;
  455. }
  456. .bottom-boxes > .inner > .box > .footer-dropdown > p > strong {
  457. color: @bottom-box-title;
  458. }
  459. .bottom-boxes > .inner > .box > .footer-dropdown .input-container {
  460. position: relative;
  461. height: 36px;
  462. overflow: hidden;
  463. }
  464. .bottom-boxes > .inner > .box > .footer-dropdown .txt {
  465. margin: 0 0 10px 0;
  466. }
  467. .bottom-boxes > .inner > .box > .footer-dropdown .search-btn {
  468. width: 36px;
  469. height: 36px;
  470. background: @button-2-color url('../img/newsletter-btn-bg.png') no-repeat center;
  471. }
  472. // main
  473. .main {
  474. padding-top: 30px;
  475. }
  476. .cart-dropdown {
  477. display: none;
  478. }
  479. .cart:hover .cart-dropdown {
  480. display: block;
  481. position: absolute;
  482. top: 40px;
  483. right: 0;
  484. width: 500px;
  485. z-index: 8889;
  486. background: #fff;
  487. border: 10px solid #38424a;
  488. padding: 0 15px 15px 15px;
  489. text-align: left;
  490. color: #38424a;
  491. }
  492. .cart-dropdown > .title {
  493. width: 100%;
  494. border-bottom: 1px solid #e5e8ed;
  495. font-family: 'geomanistbook';
  496. font-size: 14px;
  497. text-transform: uppercase;
  498. padding: 0 0 5px 0;
  499. margin: 15px 0 10px 0;
  500. }
  501. .cart-dropdown > .btn {
  502. margin: 0 0 10px 0;
  503. font-size: 14px;
  504. color: #ffffff;
  505. padding-top: 5px;
  506. text-decoration: none;
  507. }
  508. .cart-dropdown > .btn > i {
  509. padding: 0 7px 0 0 ;
  510. }
  511. .cart-dropdown > table {
  512. border-collapse: collapse;
  513. }
  514. //prod-categories
  515. .prod-categories {
  516. background: @prod-categories-bg;
  517. width: 100%;
  518. padding: 30px 0 0 0;
  519. }
  520. .cat,
  521. .cat:hover {
  522. float: left;
  523. padding: 0 10px;
  524. width: 25%;
  525. display: block;
  526. text-transform: uppercase;
  527. text-decoration: none;
  528. cursor: pointer;
  529. margin: 0 0 30px 0;
  530. }
  531. .cat > .img-container {
  532. position: relative;
  533. border: 1px solid @img-count-border-color;
  534. cursor: pointer;
  535. }
  536. .cat > .img-container > img {
  537. width: 100%;
  538. height: auto;
  539. display: block;
  540. }
  541. .prod-count {
  542. display: none;
  543. }
  544. .cat:hover > .img-container > .prod-count {
  545. display: block;
  546. position: absolute;
  547. background: #333;
  548. top: 0;
  549. left: 0;
  550. width: 100%;
  551. height: 100%;
  552. background: @prod-count-bg;
  553. }
  554. .cat > .img-container > .prod-count > span {
  555. display: block;
  556. margin: 0 auto 0 auto;
  557. position: absolute;
  558. left: 0;
  559. right: 0;
  560. top: 0;
  561. bottom: 0;
  562. text-align: center;
  563. }
  564. .cat > .img-container > .prod-count > span > span {
  565. display: inline-block;
  566. padding: 5px 10px;
  567. border: 2px solid @prod-count-color;
  568. font-size: 16px;
  569. margin: 125px 0 0 0;
  570. background: @prod-count-span-bg;
  571. font-family: 'geomanistbook';
  572. }
  573. .cat > .title {
  574. height: 36px;
  575. background: @prod-cat-title-bg;
  576. color: @prod-cat-title-color;
  577. text-align: center;
  578. font-size: 14px;
  579. font-weight: 600;
  580. padding: 7px 0 0 0;
  581. overflow: hidden;
  582. }
  583. .cat:hover > .title {
  584. background: @prod-cat-title-bg-hover;
  585. color: @prod-cat-title-color-hover;
  586. }
  587. .cat > .title > i {
  588. padding: 0 5px 0 0;
  589. }
  590. h2 {
  591. display: block;
  592. font-family: 'geomanistbook';
  593. font-size: 28px;
  594. text-transform: uppercase;
  595. color: @heading-color;
  596. border-bottom: 1px solid @heading-border-color;
  597. margin: 0 auto 20px auto;
  598. font-weight: normal;
  599. position: relative;
  600. width: 1180px;
  601. }
  602. h2 > .more {
  603. font-size: 12px;
  604. text-transform: lowercase;
  605. color: @heading-color;
  606. position: absolute;
  607. bottom: 5px;
  608. right: 0;
  609. }
  610. // category-list-1
  611. .category-list-1 {
  612. margin: 0 0 30px 0;
  613. }
  614. .category-list-1 > .left,
  615. .static-1 > .left {
  616. margin: 0 10px;
  617. width: 280px;
  618. }
  619. .left-menu {
  620. }
  621. .left-menu > .title {
  622. height: 36px;
  623. cursor: pointer;
  624. color: @left-menu-title-color;
  625. background: @left-menu-title-bg;
  626. position: relative;
  627. font-size: 14px;
  628. padding: 9px 0 0 15px;
  629. font-family: 'geomanistmedium';
  630. text-transform: uppercase;
  631. margin: 0 0 1px 0;
  632. }
  633. .left-menu > .title > i {
  634. font-size: 16px;
  635. position: absolute;
  636. right: 15px;
  637. top: 9px;
  638. color: @left-menu-title-i;
  639. }
  640. .left-menu > .title:hover > i {
  641. color: @left-menu-title-i-hover;
  642. }
  643. .title > .fa-minus,
  644. .dd-left-menu > .title > .fa-plus {
  645. display: none;
  646. }
  647. .title > .fa-plus,
  648. .dd-left-menu > .title > .fa-minus {
  649. display: block;
  650. }
  651. .left-menu > .content {
  652. display: none;
  653. }
  654. .dd-left-menu > .content {
  655. display: block;
  656. background: @left-menu-content-bg;
  657. padding: 15px;
  658. }
  659. .left-menu > .content > ul {
  660. list-style: none;
  661. }
  662. .left-menu > .content > ul li {
  663. padding: 3px 0;
  664. }
  665. .left-menu > .content > ul li a {
  666. font-size: 13px;
  667. display: block;
  668. color: @left-menu-content-color;
  669. }
  670. .left-menu > .content > ul li a.active {
  671. font-weight: 700;
  672. }
  673. .left-menu > .content > ul li a:hover {
  674. color: @left-menu-content-color-hover;
  675. text-decoration: none;
  676. }
  677. .left-menu > .content > ul li a > span {
  678. color: @left-menu-content-span-color;
  679. font-style: italic;
  680. font-size: 12px;
  681. padding-left: 6px;
  682. }
  683. .left-menu > .content > ul li a.active > span {
  684. color: @left-menu-content-color;
  685. }
  686. .left-menu > .content > ul li > ul {
  687. list-style: none;
  688. margin: 5px 0 2px 0;
  689. }
  690. .left-menu > .content > ul li > ul li {
  691. padding: 0 0 0 15px;
  692. font-size: 12px;
  693. position: relative;
  694. }
  695. .left-menu > .content > ul li > ul li:before {
  696. position: absolute;
  697. content: "\f068";
  698. left: 2px;
  699. top: 5px;
  700. font-family: 'FontAwesome';
  701. font-size: 10px;
  702. .opacity(.7);
  703. }
  704. .category-list-1 > .right {
  705. margin: 0;
  706. width: 900px;
  707. }
  708. .cat-banner {
  709. margin: 0 0 20px 0;
  710. width: 100%;
  711. padding: 0 10px;
  712. }
  713. .cat-banner > img {
  714. display: block;
  715. width: 100%;
  716. height: auto;
  717. }
  718. .category-list-1 > .right > h1 {
  719. display: block;
  720. font-size: 28px;
  721. text-transform: uppercase;
  722. padding: 0 10px;
  723. margin: 0 0 5px 0;
  724. }
  725. .category-list-1 > .right > .category-desc {
  726. font-size: 12px;
  727. font-style: italic;
  728. padding: 0 10px;
  729. color: @category-desc-color;
  730. .opacity(.7);
  731. margin: 0 0 15px 0;
  732. }
  733. .sort {
  734. border-top: 1px solid @sort-border;
  735. border-bottom: 1px solid @sort-border;
  736. margin: 0 10px;
  737. height: 36px;
  738. color: @sort-color;
  739. position: relative;
  740. }
  741. .filtering {
  742. border-bottom: 1px solid @sort-border;
  743. margin: 0 10px;
  744. margin-top: 10px;
  745. min-height: 50px;
  746. height: auto;
  747. color: @sort-color;
  748. position: relative;
  749. }
  750. .sort > .left {
  751. text-transform: uppercase;
  752. padding: 8px 0 0 15px;
  753. font-size: 13px;
  754. }
  755. .select-style {
  756. padding: 3px 20px 0 0;
  757. margin: 0;
  758. overflow: hidden;
  759. height: 36px;
  760. box-sizing: border-box;
  761. display: inline-block;
  762. width: 220px;
  763. cursor: pointer;
  764. position: relative;
  765. }
  766. .select-style:after {
  767. position: absolute;
  768. content: "\f107";
  769. right: 2px;
  770. top: 9px;
  771. font-family: 'FontAwesome';
  772. font-size: 14px;
  773. }
  774. .select-style > select {
  775. padding: 5px 30% 0 0;
  776. padding-left: 5px;
  777. width: 110%;
  778. border: none;
  779. box-shadow: none;
  780. background-color: transparent;
  781. background-image: none;
  782. -webkit-appearance: none;
  783. -moz-appearance: none;
  784. appearance: none;
  785. color: @sort-color;
  786. font-size: 12px;
  787. cursor: pointer;
  788. text-transform: uppercase;
  789. }
  790. .select-style > select > option {
  791. text-align: right;
  792. }
  793. .sort > .view {
  794. position: absolute;
  795. left: 0;
  796. right: 0;
  797. margin: 0 auto;
  798. text-align: center;
  799. }
  800. .view > a {
  801. display: inline-block;
  802. text-decoration: none;
  803. color: @sort-color;
  804. font-size: 14px;
  805. margin: 7px 3px 0 3px;
  806. .opacity(.5);
  807. }
  808. .view > a.active,
  809. .view > a:hover {
  810. .opacity(1);
  811. }
  812. //pagination
  813. .pagination {
  814. border-top: 1px solid @sort-border;
  815. border-bottom: 1px solid @sort-border;
  816. margin: 0 10px;
  817. height: 36px;
  818. color: @sort-color;
  819. text-align: center;
  820. }
  821. .pagination > ul {
  822. list-style: none;
  823. font-size: 0;
  824. }
  825. .pagination > ul li {
  826. display: inline-block;
  827. height: 34px;
  828. font-size: 0;
  829. box-sizing: border-box;
  830. }
  831. .pagination > ul li > a {
  832. display: inline-block;
  833. height: 34px;
  834. padding: 7px 15px;
  835. color: @sort-color;
  836. font-size: 14px;
  837. }
  838. .pagination > ul li > a.active {
  839. text-decoration: none;
  840. background: @pagintaion-active;
  841. }
  842. .pagination > ul li > a:hover {
  843. text-decoration: none;
  844. color: @pagintaion-color-hover;
  845. }
  846. //prod-list-1
  847. .product-list-1 {
  848. padding: 10px 0;
  849. }
  850. .product {
  851. position: relative;
  852. display: block;
  853. padding: 10px;
  854. width: 33.333333%;
  855. text-align: center;
  856. float: left;
  857. box-sizing: border-box;
  858. }
  859. .product:hover {
  860. text-decoration: none;
  861. }
  862. .product > .img-container {
  863. position: relative;
  864. border: 1px solid @prod-img-border;
  865. overflow: hidden;
  866. }
  867. .product > .big-container {
  868. min-height: 442px;
  869. height: 442px;
  870. }
  871. .product > .small-container {
  872. min-height: 211px;
  873. height: 211px;
  874. }
  875. .product > .img-container > img {
  876. width: 100%;
  877. height: auto;
  878. display: block;
  879. }
  880. .quick-view {
  881. display: none;
  882. }
  883. .product > .img-container:hover > .quick-view {
  884. display: block;
  885. position: absolute;
  886. width: 100%;
  887. height: 100%;
  888. top: 0;
  889. left: 0;
  890. background: @prod-count-bg;
  891. z-index: 88;
  892. text-align: center;
  893. }
  894. .quick-view > span {
  895. display: inline-block;
  896. box-sizing: border-box;
  897. padding: 9px 10px 0 10px;
  898. border: none;
  899. text-decoration: none;
  900. text-transform: uppercase;
  901. cursor: pointer;
  902. color: @button-color;
  903. font-family: 'geomanistbook';
  904. text-align: center;
  905. font-weight: normal;
  906. height: 36px;
  907. position: relative;
  908. top: 82px;
  909. }
  910. .quick-view > span > i {
  911. padding: 0 5px 0 0;
  912. }
  913. .product-list-2 .large .quick-view > span {
  914. top: 262px;
  915. }
  916. .product-list-2 .quick-view > span {
  917. top: 122px;
  918. }
  919. .badge {
  920. display: none;
  921. width: 76px;
  922. height: 76px;
  923. position: absolute;
  924. top: 0;
  925. left: 0;
  926. z-index: 89;
  927. }
  928. .sale .badge {
  929. display: block;
  930. background: url('../img/sale-badge-76x76.png');
  931. }
  932. .new .badge {
  933. display: block;
  934. background: url('../img/new-badge-76x76.png');
  935. }
  936. .product > .prod-desc > .name {
  937. height: 45px;
  938. overflow: hidden;
  939. font-size: 14px;
  940. color: @prod-color;
  941. line-height: 16px;
  942. padding: 5px 0;
  943. }
  944. .product > .prod-desc > .name > strong {
  945. font-size: 16px;
  946. }
  947. .product:hover > .prod-desc > .name {
  948. text-decoration: underline;
  949. }
  950. .product > .prod-desc > .price {
  951. font-size: 15px;
  952. font-weight: 600;
  953. color: @prod-price;
  954. }
  955. .product > .prod-desc > .price > .old {
  956. display: inline-block;
  957. padding: 0 10px 0 0;
  958. text-decoration: line-through;
  959. color: @prod-price-old;
  960. font-weight: 400;
  961. }
  962. .product > i {
  963. display: none;
  964. }
  965. // category-list-1
  966. .category-list-2 {
  967. margin: 0 0 30px 0;
  968. }
  969. .category-list-2 > h1 {
  970. display: block;
  971. font-size: 28px;
  972. text-transform: uppercase;
  973. padding: 0 10px;
  974. margin: 0 0 5px 0;
  975. }
  976. .category-list-2 > .category-desc {
  977. font-size: 12px;
  978. font-style: italic;
  979. padding: 0 10px;
  980. color: @category-desc-color;
  981. .opacity(.7);
  982. margin: 0 0 15px 0;
  983. }
  984. //prod-list-2
  985. .product-list-2 {
  986. padding: 30px 0;
  987. }
  988. .product {
  989. position: relative;
  990. display: block;
  991. padding: 10px;
  992. width: 25%;
  993. text-align: center;
  994. float: left;
  995. box-sizing: border-box;
  996. }
  997. .large {
  998. width: 50%;
  999. }
  1000. .large > .desc {
  1001. height: 65px;
  1002. overflow: hidden;
  1003. padding: 10px 15px;
  1004. padding-top: 15px;
  1005. /* background: @prod-count-bg;*/
  1006. font-size: 12px;
  1007. line-height: 15px;
  1008. text-align: center;
  1009. color: @prod-color;
  1010. border: solid 1px #e5e8ed;
  1011. border-top: none;
  1012. }
  1013. // static 1
  1014. .static-1 {
  1015. margin: 0 0 30px 0;
  1016. }
  1017. .static-1 > .right {
  1018. width: 580px;
  1019. float: left;
  1020. padding: 0 10px;
  1021. }
  1022. .static-1 > .right > h1,
  1023. .login-reg-split > .left > h1,
  1024. .static-2 > h1 {
  1025. display: block;
  1026. font-size: 28px;
  1027. text-transform: uppercase;
  1028. margin: 10px 0 15px 0;
  1029. color: @heading-color;
  1030. border-bottom: 1px solid @heading-border-color;
  1031. }
  1032. .static-1 > .right > h2 {
  1033. display: block;
  1034. width: 100%;
  1035. font-size: 24px;
  1036. border: none;
  1037. background: none;
  1038. padding: 0;
  1039. margin: 20px 0 15px 0;
  1040. }
  1041. .static-1 > .right > h3,
  1042. .static-1 > .right > div > h3 {
  1043. display: block;
  1044. width: 100%;
  1045. font-size: 20px;
  1046. border: none;
  1047. background: none;
  1048. padding: 0;
  1049. margin: 20px 0 15px 0;
  1050. font-family: 'geomanistbook';
  1051. text-transform: uppercase;
  1052. }
  1053. .static-1 > .right > p,
  1054. .login-reg-split > .left > p {
  1055. font-size: 14px;
  1056. line-height: 21px;
  1057. display: block;
  1058. margin: 0 0 15px 0;
  1059. }
  1060. .static-1 > .right > .fw {
  1061. width: 100%;
  1062. height: auto;
  1063. display: block;
  1064. margin: 0 0 15px 0;
  1065. }
  1066. .static-1 > .right > img {
  1067. width: 100%;
  1068. height: auto;
  1069. display: block;
  1070. margin: 0 0 15px 0;
  1071. }
  1072. .static-1 > .right a {
  1073. font-weight: 600;
  1074. text-decoration: underline;
  1075. color: @static-link-color;
  1076. }
  1077. .static-1 > .right a:hover,
  1078. .static-1 > .right p a:hover{
  1079. font-weight: 600;
  1080. text-decoration: underline;
  1081. color: @static-link-color-hover;
  1082. }
  1083. .static-1 > .right > ul {
  1084. list-style: none;
  1085. margin: 0 0 15px 0;
  1086. }
  1087. .static-1 > .right > ul li {
  1088. padding: 3px 0 3px 15px;
  1089. position: relative;
  1090. }
  1091. .static-1 > .right > ul li:before {
  1092. position: absolute;
  1093. content: "\f111";
  1094. left: 2px;
  1095. top: 10px;
  1096. font-family: 'FontAwesome';
  1097. font-size: 6px;
  1098. .opacity(.7);
  1099. }
  1100. .static-1 .input-row {
  1101. height: 75px;
  1102. width: 50%;
  1103. }
  1104. .static-1 .input-row > label {
  1105. display: block;
  1106. font-size: 12px;
  1107. font-weight: 600;
  1108. height: 19px;
  1109. }
  1110. .static-1 .input-row > label > span {
  1111. display: inline;
  1112. color: #000;
  1113. }
  1114. .static-1 .input-row > .error-msg {
  1115. display: none;
  1116. }
  1117. .static-1 .input-row > .form-check > .error-msg {
  1118. display: none;
  1119. }
  1120. .static-1 .error > .error-msg {
  1121. height: 12px;
  1122. color: #E05E73;
  1123. font-size: 11px;
  1124. display: block;
  1125. }
  1126. .static-1 .error > .form-check > .error-msg {
  1127. height: 12px;
  1128. color: @error;
  1129. font-size: 11px;
  1130. display: block;
  1131. }
  1132. .static-1 .input-row > label > .fg-passw {
  1133. float: right;
  1134. display: inline-block;
  1135. }
  1136. // reg-login
  1137. .reg-form {
  1138. }
  1139. .reg-form > .left {
  1140. width: 50%;
  1141. padding: 0 10px 0 0;
  1142. }
  1143. .reg-form > .right {
  1144. width: 50%;
  1145. padding: 0 0 0 10px;
  1146. }
  1147. .reg-form .input-row {
  1148. width: 100%;
  1149. }
  1150. .zip {
  1151. width: 22%;
  1152. float: left;
  1153. }
  1154. .city {
  1155. width: 73%;
  1156. float: right;
  1157. }
  1158. .reg-form .txt-area {
  1159. height: 150px;
  1160. }
  1161. textarea {
  1162. height: 112px;
  1163. padding-top: 5px;
  1164. font-size: 16px;
  1165. }
  1166. .form-bottom-info {
  1167. margin: 25px 0 0 0;
  1168. padding: 15px 0 0 0;
  1169. border-top: 1px solid @heading-border-color;
  1170. }
  1171. .form-check {
  1172. border-top: 1px solid @heading-border-color;
  1173. border-bottom: 1px solid @heading-border-color;
  1174. min-height: 36px;
  1175. margin: 0 0 20px 0;
  1176. padding: 4px 0 0 0;
  1177. }
  1178. .static-1 .reg-btn {
  1179. margin: 20px 0 20px 0;
  1180. width: 100%;
  1181. box-sizing: border-box;
  1182. }
  1183. // login-reg-split
  1184. .login-reg-split {
  1185. }
  1186. .login-reg-split > .left {
  1187. width: 280px;
  1188. margin: 0 0 0 110px;
  1189. }
  1190. .login-reg-split > .right {
  1191. width: 580px;
  1192. margin: 0 110px 0 0;
  1193. float: right;
  1194. }
  1195. .static-1 .or > span > span {
  1196. display: inline-block;
  1197. background: #ffffff;
  1198. font-family: 'geomanistbook';
  1199. font-size: 10px;
  1200. text-transform: uppercase;
  1201. padding: 0 5px;
  1202. color: @or-line;
  1203. }
  1204. .static-1 .reg-form .btn-fb,
  1205. .static-1 .reg-form .btn-fb:hover,
  1206. .static-1 .reg-form .btn-google,
  1207. .static-1 .reg-form .btn-google:hover {
  1208. display: block;
  1209. margin: 10px 0 10px 0;
  1210. font-size: 14px;
  1211. color: #ffffff;
  1212. padding-top: 13px;
  1213. text-decoration: none;
  1214. font-weight: normal;
  1215. font-size: 16px;
  1216. }
  1217. .fg-passw {
  1218. color: @static-link-color;
  1219. }
  1220. .fg-passw:hover {
  1221. color: @static-link-color-hover;
  1222. }
  1223. //mian page prod sugg list
  1224. .prod-suggest {
  1225. width: 1200px;
  1226. margin: 0 auto 20px auto;
  1227. position: relative;
  1228. }
  1229. .prod-suggest > .product-list {
  1230. width: 1200px;
  1231. overflow: hidden;
  1232. height: 260px;
  1233. }
  1234. .prod-suggest > .product-list > .product {
  1235. width: 16.666666%;
  1236. }
  1237. .prod-suggest > a {
  1238. display: block;
  1239. position: absolute;
  1240. width: 45px;
  1241. height: 45px;
  1242. text-align: center;
  1243. color: #293437;
  1244. }
  1245. .prod-suggest > .left-arrow {
  1246. left: -35px;
  1247. top: 137px;
  1248. }
  1249. .prod-suggest > .right-arrow {
  1250. right: -35px;
  1251. top: 137px;
  1252. }
  1253. .prod-suggest > a > i {
  1254. font-size: 24px;
  1255. .opacity(.5);
  1256. position: relative;
  1257. top: 10px;
  1258. }
  1259. .prod-suggest:hover > a > i {
  1260. .opacity(1);
  1261. }
  1262. .prod-suggest > a:hover {
  1263. background: #293437;
  1264. color: #ffffff;
  1265. }
  1266. .prod-suggest .quick-view > span {
  1267. top: 72px;
  1268. }
  1269. // cat suggest
  1270. .cat-suggest {
  1271. width: 1200px;
  1272. margin: 0 auto 30px auto;
  1273. }
  1274. .cat-item {
  1275. width: 33.3333%;
  1276. padding: 0 10px;
  1277. float: left;
  1278. margin: 0 0 20px 0;
  1279. }
  1280. .cat-item > table,
  1281. .cat-item > table tr td {
  1282. border-collapse: collapse;
  1283. border: 1px solid @prod-img-border;
  1284. }
  1285. .td-large {
  1286. width: 280px;
  1287. height:280px;
  1288. }
  1289. .td-small {
  1290. width: 99px;
  1291. height: 99px;
  1292. }
  1293. .td-large > a,
  1294. .td-large > a > img,
  1295. .td-small > a,
  1296. .td-small > a > img {
  1297. width: 100%;
  1298. /* height: 100%;*/
  1299. display: block;
  1300. }
  1301. .td-large > a:hover > img,
  1302. .td-small > a:hover > img {
  1303. .opacity(.8);
  1304. }
  1305. .cat-item > .description {
  1306. padding: 15px;
  1307. background: @prod-categories-bg;
  1308. }
  1309. .cat-item > .description > .title {
  1310. font-family: 'geomanist_regularregular';
  1311. font-size: 18px;
  1312. text-transform: uppercase;
  1313. margin: 0 0 5px 0;
  1314. }
  1315. .cat-item > .description > .desc {
  1316. line-height: 17px;
  1317. font-size: 13px;
  1318. overflow: hidden;
  1319. height: 50px;
  1320. }
  1321. .cat-item > .bottom {
  1322. height: 36px;
  1323. background: @prod-img-border
  1324. }
  1325. .cat-item > .bottom > .quant,
  1326. .cat-item > .bottom > .price,
  1327. .cat-item > .bottom > .shop-all {
  1328. float: left;
  1329. width: 33.33333%;
  1330. border-right: 1px solid #fff;
  1331. height: 36px;
  1332. box-sizing: border-box;
  1333. text-align: center;
  1334. padding: 8px 0 0 0;
  1335. }
  1336. .cat-item > .bottom > .shop-all {
  1337. border-right: none;
  1338. background: @button-dafault-color;
  1339. color: @button-color;
  1340. text-transform: uppercase;
  1341. }
  1342. .cat-item > .bottom > .shop-all:hover {
  1343. background: @button-2-color;
  1344. text-decoration: none;
  1345. }
  1346. .cat-item > .bottom > .shop-all > i {
  1347. font-size: 14px;
  1348. padding: 0 3px 0 0;
  1349. }
  1350. // static-2
  1351. .static-2 {
  1352. width: 780px;
  1353. margin: 0 auto 30px auto;
  1354. }
  1355. .static-2 > .cover-pic {
  1356. width: 100%;
  1357. height: auto;
  1358. position: relative;
  1359. margin: 0 0 20px 0;
  1360. }
  1361. .static-2 > .cover-pic > img {
  1362. width: 100%;
  1363. height: auto;
  1364. display: block;
  1365. }
  1366. .static-2 > .cover-pic > .date {
  1367. position: absolute;
  1368. bottom: 0;
  1369. width: 100%;
  1370. background: rgba(0,0,0,0.3);
  1371. color: #fff;
  1372. height: 36px;
  1373. padding: 8px 10px 0 10px;
  1374. text-transform: uppercase;
  1375. }
  1376. .static-2 > .content {
  1377. padding: 0 0px;
  1378. }
  1379. .static-2 > .content > .lead,
  1380. .static-2 > .content > p {
  1381. font-size: 14px;
  1382. line-height: 21px;
  1383. display: block;
  1384. margin: 0 0 15px 0;
  1385. text-align: justify;
  1386. }
  1387. .static-2 > .content > .lead {
  1388. font-weight: 600;
  1389. }
  1390. .facebook-like {
  1391. border-top: 1px solid @heading-border-color;
  1392. border-bottom: 1px solid @heading-border-color;
  1393. height: 36px;
  1394. width: 100%;
  1395. margin: 0 0 10px 0;
  1396. padding: 7px 0 0 0;
  1397. }
  1398. .static-2 > .content > h2 {
  1399. background: none;
  1400. border: none;
  1401. width: 100%;
  1402. font-size: 24px;
  1403. margin: 15px 0 10px 0;
  1404. padding: 0;
  1405. }
  1406. .static-2 > .content > h3 {
  1407. background: none;
  1408. border: none;
  1409. width: 100%;
  1410. font-size: 20px;
  1411. margin: 15px 0 10px 0;
  1412. text-transform: uppercase;
  1413. padding: 0;
  1414. }
  1415. .static-2 > .content a {
  1416. font-weight: 600;
  1417. text-decoration: underline;
  1418. color: @static-link-color;
  1419. }
  1420. .static-2 > .content > a:hover,
  1421. .static-2 > .content > p a:hover{
  1422. font-weight: 600;
  1423. text-decoration: underline;
  1424. color: @static-link-color-hover;
  1425. }
  1426. // static-3
  1427. .static-3 {
  1428. width: 100%;
  1429. margin: 0 auto 30px auto;
  1430. }
  1431. .static-3 > .cover-pic {
  1432. width: 100%;
  1433. height: auto;
  1434. position: relative;
  1435. margin: 0 0 20px 0;
  1436. }
  1437. .static-3 > .cover-pic > img {
  1438. width: 100%;
  1439. height: auto;
  1440. display: block;
  1441. }
  1442. .static-3 > .cover-pic > .date {
  1443. position: absolute;
  1444. bottom: 0;
  1445. width: 100%;
  1446. background: rgba(0,0,0,0.3);
  1447. color: #fff;
  1448. height: 36px;
  1449. padding: 8px 10px 0 10px;
  1450. text-transform: uppercase;
  1451. }
  1452. .static-3 > .content {
  1453. padding: 0 0px;
  1454. }
  1455. .static-3 > .content > .lead,
  1456. .static-3 > .content > p {
  1457. font-size: 14px;
  1458. line-height: 21px;
  1459. display: block;
  1460. margin: 0 0 15px 0;
  1461. text-align: justify;
  1462. }
  1463. .static-3 > .content > .lead {
  1464. font-weight: 600;
  1465. }
  1466. .facebook-like {
  1467. border-top: 1px solid @heading-border-color;
  1468. border-bottom: 1px solid @heading-border-color;
  1469. height: 36px;
  1470. width: 100%;
  1471. margin: 0 0 10px 0;
  1472. padding: 7px 0 0 0;
  1473. }
  1474. .static-3 > .content > h2 {
  1475. background: none;
  1476. border: none;
  1477. width: 100%;
  1478. font-size: 24px;
  1479. margin: 15px 0 10px 0;
  1480. padding: 0;
  1481. }
  1482. .static-3 > .content > h3 {
  1483. background: none;
  1484. border: none;
  1485. width: 100%;
  1486. font-size: 20px;
  1487. margin: 15px 0 10px 0;
  1488. text-transform: uppercase;
  1489. padding: 0;
  1490. }
  1491. .static-3 > .content a {
  1492. font-weight: 600;
  1493. text-decoration: underline;
  1494. color: @static-link-color;
  1495. }
  1496. .static-3 > .content > a:hover,
  1497. .static-3 > .content > p a:hover{
  1498. font-weight: 600;
  1499. text-decoration: underline;
  1500. color: @static-link-color-hover;
  1501. }
  1502. // cart-checkout
  1503. .cart-checkout {
  1504. }
  1505. .outer-overflow {
  1506. max-height: 400px;
  1507. overflow-y: auto;
  1508. overflow-x: hidden;
  1509. padding-right: 5px;
  1510. }
  1511. // cart table
  1512. .cart-table {
  1513. width: 100%;
  1514. border-collapse: collapse;
  1515. margin: 0;
  1516. font-size: 14px;
  1517. }
  1518. .cart-table2 {
  1519. margin: 0 0 20px 0;
  1520. }
  1521. .cart-table tr {
  1522. border-bottom: 1px solid @prod-img-border;
  1523. }
  1524. .cart-table tr td {
  1525. padding: 10px 0;
  1526. vertical-align: middle;
  1527. }
  1528. .cart-table td.price {
  1529. color: black;
  1530. font-weight: 600;
  1531. text-align: right;
  1532. text-transform: uppercase;
  1533. width: 100px;
  1534. }
  1535. .cart-table td.sum {
  1536. color: @prod-price;
  1537. font-weight: 700;
  1538. border-top: 1px solid @heading-border-color;
  1539. border-bottom: 1px solid @heading-border-color;
  1540. text-transform: uppercase;
  1541. }
  1542. .cart-table tr td > .title,
  1543. {
  1544. display: block;
  1545. text-transform: uppercase;
  1546. font-weight: 700;
  1547. margin: 0 0 10px 0;
  1548. }
  1549. .cart-table tr td > label {
  1550. padding: 0 0 0 5px;
  1551. display: inline-block;
  1552. vertical-align: middle;
  1553. margin: 0 0 5px 0;
  1554. }
  1555. .cart-table tr td > input {
  1556. display: inline-block;
  1557. vertical-align: middle;
  1558. margin: 0 0 5px 0;
  1559. }
  1560. .cart-table tr td span.no-marg {
  1561. margin: 0 0 0 0;
  1562. }
  1563. .cart-table tr td span.no-marg .lk,
  1564. .cart-table tr td.sum .lk{
  1565. text-transform: lowercase;
  1566. font-weight: 400;
  1567. }
  1568. .cart-table tr td.prod-img {
  1569. width: 80px;
  1570. text-align: left;
  1571. }
  1572. .cart-table tr td.prod-img > a,
  1573. .cart-table tr td.prod-img > a > img {
  1574. width: 60px;
  1575. height: 60px;
  1576. display: block;
  1577. border: none;
  1578. }
  1579. .cart-table tr > td.prod-desc > a {
  1580. font-weight: 400;
  1581. color: @prod-color;
  1582. }
  1583. .cart-table tr > td.prod-desc > a > span {
  1584. display: block;
  1585. margin: 5px 0 0 0;
  1586. color: @prod-color;
  1587. font-size: 12px;
  1588. }
  1589. .cart-table tr > td.prod-desc > a:hover {
  1590. text-decoration: none;
  1591. }
  1592. .cart-table tr > td.quantity {
  1593. width: 120px;
  1594. text-align: right;
  1595. }
  1596. .cart-table tr > td.quantity > div {
  1597. border: 1px solid @prod-img-border;
  1598. display: inline-block;
  1599. padding: 3px 10px;
  1600. }
  1601. .cart-table tr > td.quantity > div > a {
  1602. text-decoration: none;
  1603. color: @prod-color;
  1604. }
  1605. .cart-table tr > td.quantity > div > a:hover {
  1606. text-decoration: none;
  1607. color: @static-link-color-hover;
  1608. }
  1609. .cart-table tr > td.quantity > div > a > i {
  1610. }
  1611. .cart-table tr > td.quantity > div > span {
  1612. width: 30px;
  1613. text-align: center;
  1614. }
  1615. .cart-checkout > h3 {
  1616. text-transform: uppercase;
  1617. margin: 0 0 5px 0;
  1618. }
  1619. // product
  1620. .prod {
  1621. width: 1200px;
  1622. margin: 0 auto 30px auto;
  1623. }
  1624. .prod > .left{
  1625. width: 50%;
  1626. padding: 0 10px;
  1627. }
  1628. .prod > .right{
  1629. width: 50%;
  1630. padding: 0 10px;
  1631. }
  1632. .prod > .left > .prod-main-pic {
  1633. border: 1px solid @prod-img-border;
  1634. position: relative;
  1635. }
  1636. .prod > .left > .prod-main-pic {
  1637. max-height: 575px;
  1638. min-height: 575px;
  1639. }
  1640. #showmebigone {
  1641. height: 575px;
  1642. min-height: 575px;
  1643. max-height: 570px;
  1644. }
  1645. .prod > .left > .prod-main-pic > a,
  1646. .prod > .left > .prod-main-pic > a > img {
  1647. width: auto;
  1648. max-width: 100%;
  1649. max-height: 570px;
  1650. height: auto;
  1651. display: block;
  1652. }
  1653. .related-containter {
  1654. min-height: 170px;
  1655. height: 170px;
  1656. }
  1657. .add-images {
  1658. background: @prod-categories-bg;
  1659. position: relative;
  1660. height: 110px;
  1661. padding: 15px 0;
  1662. }
  1663. .add-images > .inner {
  1664. width: 90%;
  1665. margin: 0 auto;
  1666. height: 80px;
  1667. overflow: hidden;
  1668. white-space: nowrap;
  1669. }
  1670. .add-images > .left-arrow,
  1671. .add-images > .right-arrow {
  1672. position: absolute;
  1673. font-size: 14px;
  1674. top: 40px;
  1675. color: #c5cbd2;
  1676. font-size: 22px;
  1677. }
  1678. .add-images > .left-arrow {
  1679. left: 15px;
  1680. }
  1681. .add-images > .right-arrow {
  1682. right: 15px;
  1683. }
  1684. .add-images > a:hover{
  1685. color: #293437;
  1686. }
  1687. .add-images > .inner > a,
  1688. .add-images > .inner > a > img {
  1689. width: 80px;
  1690. height: auto;
  1691. display: block;
  1692. float: left;
  1693. margin: 0 10px;
  1694. }
  1695. .prod > .right {
  1696. width: 50%;
  1697. padding: 0 10px;
  1698. height: 605px;
  1699. position: relative;
  1700. }
  1701. .tab-container {
  1702. position: absolute;
  1703. bottom: 0;
  1704. height: 300px;
  1705. width: 100%;
  1706. background: @prod-categories-bg;
  1707. padding: 0 0 20px 0;
  1708. margin: 0 10px;
  1709. }
  1710. .tabs {
  1711. height: 36px;
  1712. width: 100%;
  1713. }
  1714. .tabs > a {
  1715. width: 33.3333%;
  1716. display: block;
  1717. float: left;
  1718. border-right: 1px solid #ffffff;
  1719. text-align: center;
  1720. height: 36px;
  1721. background: #e5e8ed;
  1722. font-family: 'geomanistmedium';
  1723. color: #232a31;
  1724. text-transform: uppercase;
  1725. font-size: 16px;
  1726. text-decoration: none;
  1727. padding: 7px 0 0 0;
  1728. }
  1729. .tabs > a:hover {
  1730. text-decoration: none;
  1731. }
  1732. .tabs > .active {
  1733. background: @prod-categories-bg;
  1734. }
  1735. .last-tab {
  1736. border-right: none;
  1737. }
  1738. .tab-container > .content {
  1739. margin: 20px 0 0 0;
  1740. height: 220px;
  1741. padding: 0 20px 0 20px;
  1742. overflow-y: scroll;
  1743. }
  1744. .tab-container > .content > p {
  1745. display: block;
  1746. margin: 0 0 15px 0;
  1747. }
  1748. .prod > .right > h1 {
  1749. display: block;
  1750. font-size: 28px;
  1751. text-transform: uppercase;
  1752. margin: 0 0 5px 0;
  1753. color: @heading-color;
  1754. border-bottom: 1px solid @heading-border-color;
  1755. }
  1756. .prod > .right > .subtitle {
  1757. font-size: 18px;
  1758. font-family: 'geomanistbook';
  1759. text-transform: uppercase;
  1760. margin: 0 0 5px 0;
  1761. }
  1762. .prod > .right > .price {
  1763. font-size: 18px;
  1764. font-family: 'geomanistbook';
  1765. text-transform: uppercase;
  1766. margin: 0 0 5px 0;
  1767. color: @prod-price;
  1768. }
  1769. .prod > .right > .price > .old-price {
  1770. padding: 0 15px 0 0;
  1771. color: @prod-price-old;
  1772. text-decoration: line-through;
  1773. }
  1774. .prod > .right > .option-title {
  1775. font-size: 14px;
  1776. font-weight: 700;
  1777. margin: 0 0 5px 0;
  1778. }
  1779. .prod > .right > .select-style {
  1780. border: 2px solid #b7c0c7;
  1781. float: none;
  1782. padding: 2px 15px 0 15px;
  1783. width: 50%;
  1784. margin: 0 0 25px 0;
  1785. }
  1786. .prod > .right > .select-style > select {
  1787. font-size: 16px;
  1788. font-family: 'geomanistbook';
  1789. color: #909ba4;
  1790. }
  1791. .prod > .right > .select-style:after {
  1792. position: absolute;
  1793. content: "\f0d7";
  1794. right: 10px;
  1795. top: 10px;
  1796. font-family: 'FontAwesome';
  1797. font-size: 14px;
  1798. color: #909ba4;
  1799. }
  1800. .add-to-cart {
  1801. display: block;
  1802. width: 50%;
  1803. padding: 11px 0 0 0;
  1804. }
  1805. .add-to-cart > i {
  1806. padding: 0 10px 0 0;
  1807. }
  1808. .add-to-cart:hover {
  1809. text-decoration: none;
  1810. }
  1811. // overlay
  1812. .overlay {
  1813. position: fixed;
  1814. top:0;
  1815. left:0;
  1816. background: rgba(0,0,0,0.8);
  1817. z-index: 99999;
  1818. width: 100%;
  1819. height: 100%;
  1820. }
  1821. .popup {
  1822. position: relative;
  1823. width: 500px;
  1824. min-height: 200px;
  1825. margin: 0 auto;
  1826. top: 100px;
  1827. background: #fff;
  1828. z-index: 9998;
  1829. padding: 40px 100px;
  1830. text-align: center;
  1831. }
  1832. .popup .close {
  1833. width: 45px;
  1834. height: 45px;
  1835. position: absolute;
  1836. z-index: 9999;
  1837. display: block;
  1838. background: #333;
  1839. top: 0;
  1840. right: 0;
  1841. text-align: center;
  1842. color: #333;
  1843. font-size: 30px;
  1844. padding: 8px 0 0 0;
  1845. }
  1846. .popup > h1 {
  1847. display: block;
  1848. font-size: 24px;
  1849. font-weight: 700;
  1850. width: 100%;
  1851. margin: 0 0 35px 0;
  1852. }
  1853. .minimalize {
  1854. width: 50px;
  1855. padding: 5px;
  1856. border: 1px solid #e5e8ed;
  1857. }
  1858. .maximized {
  1859. width: 400px;
  1860. padding: 5px;
  1861. border: 1px solid #e5e8ed;
  1862. }
  1863. .buttonized {
  1864. background-color: #6fb121;
  1865. font-size: 13px;
  1866. color: #fff !important;
  1867. font-family: 'geomanistbook';
  1868. text-align: center;
  1869. font-weight: normal;
  1870. cursor: pointer;
  1871. text-decoration: none;
  1872. padding: 5px;
  1873. }
  1874. .buttonized:hover {
  1875. .drop-shadow(0, 1px, 2px, 0.4);
  1876. }
  1877. .color-boxes {
  1878. display: block;
  1879. width: 100%;
  1880. list-style: none;
  1881. margin-bottom: 25px !important;
  1882. }
  1883. .color-box {
  1884. display: inline-block;
  1885. list-style: none;
  1886. margin: 0 auto;
  1887. margin-right: 5px;
  1888. width: 20px;
  1889. height: 20px;
  1890. border: solid 1px #ccc;
  1891. cursor: pointer;
  1892. text-align: center;
  1893. padding: 5px;
  1894. color: #6fb121;
  1895. }
  1896. .color-box:hover {
  1897. .drop-shadow(2px, 2px, 2px, 0.4);
  1898. }
  1899. #detailed_search {
  1900. display: none;
  1901. position: absolute;
  1902. width: inherit;
  1903. min-height: 200px;
  1904. background: white;
  1905. border: solid 1px #38424a;
  1906. .drop-shadow(2px, 2px, 2px, 0.4);
  1907. z-index: 9999999;
  1908. padding: 20px;
  1909. overflow: auto;
  1910. }
  1911. #category_settings li {
  1912. list-style: none;
  1913. }
  1914. #category_settings li div.form-check {
  1915. border-bottom: none;
  1916. border-top: none;
  1917. height: auto;
  1918. margin: 0px;
  1919. }
  1920. #category_settings input[type="checkbox"] + label {
  1921. font-size: 12px;
  1922. }
  1923. .mutliSelect {
  1924. display: block;
  1925. width: 100%;
  1926. height: auto;
  1927. font-size: 16px;
  1928. font-weight: bold;
  1929. color: black;
  1930. text-align: left;
  1931. padding: 5px;
  1932. cursor: pointer;
  1933. }
  1934. .mutliSelect ul {
  1935. display: block;
  1936. width: 100%;
  1937. height: auto;
  1938. margin: 0px;
  1939. padding: 0px;
  1940. margin-left: -10px;
  1941. margin-top: 0px;
  1942. }
  1943. .mutliSelect ul li {
  1944. display: inline-block;
  1945. list-style: none;
  1946. text-align: left;
  1947. font-size: 12px;
  1948. font-weight: bold;
  1949. color: black;
  1950. padding-left: 5px;
  1951. padding-right: 5px;
  1952. margin: 5px;
  1953. }
  1954. .mutliSelect div.form-check {
  1955. border-bottom: none;
  1956. border-top: none;
  1957. height: auto;
  1958. margin: 0px;
  1959. }
  1960. .mutliSelect input[type="checkbox"] + label {
  1961. font-size: 12px;
  1962. }
  1963. .ccheck {
  1964. display: block;
  1965. widht: 100%;
  1966. height: auto;
  1967. margin-bottom: 5px;
  1968. cursor: pointer;
  1969. }
  1970. .ccheck span {
  1971. display: inline-block;
  1972. background-color: white;
  1973. border: solid 1px #38424a;
  1974. width: 20px;
  1975. height: 20px;
  1976. text-align: center;
  1977. margin-right: 5px;
  1978. }
  1979. .ccheck span i {visibility: hidden;}
  1980. .ccheck span i.checkedin {visibility: visible;}
  1981. .topbottom {
  1982. padding-top: 5px;
  1983. padding-bottom: 5px;
  1984. }
  1985. .check-select {
  1986. width: 100px;
  1987. height: 30px;
  1988. float: left;
  1989. border: solid 1px #eee;
  1990. padding: 5px;
  1991. font-size: 12px;
  1992. cursor: pointer;
  1993. margin-right: 20px;
  1994. }
  1995. .check-select::after {
  1996. top: 5px;
  1997. }
  1998. .check-select-list {
  1999. display: none;
  2000. position: absolute;
  2001. width: 300px;
  2002. height: auto;
  2003. background-color: white;
  2004. border: solid 1px #eee;
  2005. margin-top: 29px;
  2006. z-index: 9999;
  2007. text-align: center;
  2008. }
  2009. .check-select-list ul {
  2010. margin: 0px;
  2011. padding: 0px;
  2012. padding-top: 5px;
  2013. text-align: justify;
  2014. }
  2015. .check-select-list ul li {
  2016. float: left;
  2017. color: #000;
  2018. list-style: none;
  2019. padding: 5px;
  2020. margin: 5px;
  2021. font-size: 10px;
  2022. font-weight: bold;
  2023. /* text-shadow: 1px 1px #fff;*/
  2024. background-color: #eee;
  2025. text-align: justify;
  2026. text-transform: uppercase;
  2027. }
  2028. .check-select-list ul li:hover {
  2029. }
  2030. .check-select-list ul li .ccheck {
  2031. margin-bottom: 0px;
  2032. }
  2033. .check-select-list ul li.filtered {
  2034. border-color: #666565;
  2035. }
  2036. #price-slider {
  2037. margin-left: 15px;
  2038. margin-top: 5px;
  2039. float: left;
  2040. width: 200px;
  2041. font-size: 11px;
  2042. }
  2043. #price-slider span {
  2044. font-size: 11px;
  2045. font-weight: bold;
  2046. }
  2047. #price-slider small {
  2048. display: block;
  2049. padding-top: 5px;
  2050. }
  2051. #keyword-filter {
  2052. float: left;
  2053. margin-left: 30px;
  2054. }
  2055. #keyword-filter input {
  2056. width: 250px;
  2057. height: 20px;
  2058. padding: 5px;
  2059. font-size: 12px;
  2060. border: solid 1px #eee;
  2061. }
  2062. #szukites {
  2063. width: 100px;
  2064. height: 30px;
  2065. float: left;
  2066. margin-left: 20px;
  2067. border: solid 1px #eee;
  2068. text-transform: none;
  2069. }
  2070. #reszletes {
  2071. width: 150px;
  2072. height: 30px;
  2073. float: left;
  2074. margin-left: 20px;
  2075. border: solid 1px #eee;
  2076. text-transform: none;
  2077. background-color: #0a548b;
  2078. }
  2079. .info-panel {
  2080. background-color: #ecf0f1;
  2081. width: 97%;
  2082. border: solid 1px #e5e8ed;
  2083. font-size: 11px;
  2084. color: black;
  2085. padding: 10px;
  2086. margin-top: 10px;
  2087. margin-bottom: 10px;
  2088. }
  2089. .greened {
  2090. background-color: #8EBF54;
  2091. }
  2092. .greened:hover {
  2093. opacity: 0.7;
  2094. background-color: #6fb121;
  2095. }
  2096. .product_description {
  2097. height: auto;
  2098. max-height: 50px;
  2099. min-height: 50px;
  2100. }
  2101. .options-wrap {
  2102. /* min-height: 75px;*/
  2103. height: 77px;
  2104. }
  2105. @keyframes blinker {
  2106. 50% { opacity: 0.0; }
  2107. }
  2108. .color-error {
  2109. display: none;
  2110. color: #ff6961;
  2111. font-weight: bold;
  2112. font-size: 12px;
  2113. animation: blinker 1s linear infinite;
  2114. }
  2115. .detailed-search-btn {
  2116. /* color: #6fb121;*/
  2117. color: #999;
  2118. text-decoration: none;
  2119. display: inline-block;
  2120. padding: 5px;
  2121. padding-top: 8px;
  2122. font-size: 11px;
  2123. }
  2124. /*.detailed-search-btn:hover {
  2125. color: #fff;
  2126. text-decoration: none;
  2127. background-color: #6fb121;
  2128. padding: 5px;
  2129. }*/
  2130. #cart_wrapper .fa {
  2131. color: #000;
  2132. }
  2133. .cart-dropdown .fa {
  2134. color: #000;
  2135. }
  2136. #cart_wrapper #add_direct_to_cart .fa {
  2137. color: white;
  2138. }
  2139. .cart-table tr td.cart-trash {
  2140. padding-bottom: 30px;
  2141. }
  2142. #banner_overlay img {
  2143. display: block; position: absolute; left: 45%;
  2144. }
  2145. .sy-box.sy-loading { margin-top: 350px; }
  2146. #detailer {
  2147. }
  2148. // mediaquery import
  2149. @import "1180w.less";
  2150. @import "960w.less";
  2151. #mobile-search {
  2152. display: none;
  2153. position: absolute;
  2154. width: 100%;
  2155. height: 50px;
  2156. background-color: #38424a;
  2157. top: 40px;
  2158. left: 0;
  2159. z-index: 9999999;
  2160. padding: 5px;
  2161. padding-bottom: 10px;
  2162. }
  2163. #mobile-menu {
  2164. display: none;
  2165. position: absolute;
  2166. width: 100%;
  2167. height: auto;
  2168. background-color: #38424a;
  2169. top: 40px;
  2170. left: 0;
  2171. z-index: 9999999;
  2172. }
  2173. #mobile-menu ul {
  2174. list-style: none;
  2175. }
  2176. #mobile-menu ul li {
  2177. border-bottom: 1px solid #232a31;
  2178. color: #c5cbd2;
  2179. height: 25px;
  2180. text-align: center;
  2181. padding-top: 7px;
  2182. }
  2183. #mobile-menu ul li a {
  2184. color: #c5cbd2;
  2185. line-height: 12px;
  2186. font-size: 12px;
  2187. font-family: 'geomanistbook';
  2188. text-transform: uppercase;
  2189. }
  2190. #mobile-menu ul li a:hover {
  2191. text-decoration: none;
  2192. }
  2193. #mobile-login {
  2194. z-index: 9999999;
  2195. }
  2196. #mobile-login ul {
  2197. list-style: none;
  2198. }
  2199. #mobile-login ul li {
  2200. border-bottom: 1px solid #232a31;
  2201. color: #c5cbd2;
  2202. height: 25px;
  2203. text-align: left;
  2204. padding-top: 7px;
  2205. }
  2206. #mobile-login ul li a {
  2207. color: #c5cbd2;
  2208. line-height: 12px;
  2209. font-size: 12px;
  2210. font-family: 'geomanistbook';
  2211. text-transform: uppercase;
  2212. }
  2213. #mobile-login ul li a:hover {
  2214. text-decoration: none;
  2215. }
  2216. #category_selector {
  2217. margin-left: 50px;
  2218. }
  2219. td.price a {
  2220. color: #000;
  2221. }
  2222. .hide {
  2223. display: none;
  2224. }
  2225. .modal-line {
  2226. display: none;
  2227. position: absolute;
  2228. width: 100%;
  2229. height: 35px;
  2230. padding: 5px;
  2231. z-index: 999999;
  2232. margin-top: -2px;
  2233. }
  2234. .modal-line h6 {
  2235. width: 97%;
  2236. display: block;
  2237. font-size: 12px;
  2238. color: white;
  2239. float: left;
  2240. text-align: center;
  2241. margin-top: 3px;
  2242. }
  2243. .modal-line a {
  2244. width: 3%;
  2245. display: block;
  2246. float: right;
  2247. font-size: 16px;
  2248. color: white;
  2249. text-decoration: none;
  2250. text-align: right;
  2251. }
  2252. .modal-mobile {
  2253. top: 43px;
  2254. }
  2255. .error-modal {
  2256. background-color: #E05E73;
  2257. color: white;
  2258. }
  2259. .success-modal {
  2260. background-color: #8EBF54;
  2261. color: white;
  2262. }
  2263. .info-modal {
  2264. background-color: #0099c8;
  2265. color: white;
  2266. }
  2267. .disabledbtn {
  2268. opacity: 0.3;
  2269. }
  2270. #akcios-katalogus {
  2271. color: white;
  2272. padding: 2px;
  2273. background-color: #6fb121;
  2274. }
  2275. #search::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  2276. color: #999;
  2277. }
  2278. #search:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  2279. color: #999;
  2280. opacity: 1;
  2281. }
  2282. #search::-moz-placeholder { /* Mozilla Firefox 19+ */
  2283. color: #999;
  2284. opacity: 1;
  2285. }
  2286. #search:-ms-input-placeholder { /* Internet Explorer 10-11 */
  2287. color: #999;
  2288. }
  2289. #search:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  2290. color: #999;
  2291. }
  2292. .txt::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  2293. color: #ccc;
  2294. }
  2295. .txt:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  2296. color: #ccc;
  2297. opacity: 1;
  2298. }
  2299. .txt::-moz-placeholder { /* Mozilla Firefox 19+ */
  2300. color: #ccc;
  2301. opacity: 1;
  2302. }
  2303. .txt:-ms-input-placeholder { /* Internet Explorer 10-11 */
  2304. color: #ccc;
  2305. }
  2306. .txt:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  2307. color: #ccc;
  2308. }
  2309. textarea::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  2310. color: #ccc;
  2311. }
  2312. textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  2313. color: #ccc;
  2314. opacity: 1;
  2315. }
  2316. textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
  2317. color: #ccc;
  2318. opacity: 1;
  2319. }
  2320. textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
  2321. color: #ccc;
  2322. }
  2323. textarea:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  2324. color: #ccc;
  2325. }