122. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2022-11-18 03:12:10 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

122.1 Files compared

#LocationFileLast Modified
1Porto Theme/app/design/frontend/Smartwave/porto_rtl/Smartwave_Porto/web/css/source_module.less2022-04-30 08:52:11 +0000
2Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Smartwave_Porto/web/css/source_module.less2022-11-02 08:57:23 +0000

122.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged23116
Changed00
Inserted14
Removed00

122.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

122.4 Active regular expressions

No regular expressions were active.

122.5 Comparison detail

1 // /** 1 // /**
2 //  * Copyright © 2015 Magento. All rights reserved. 2 //  * Copyright © 2015 Magento. All rights reserved.
3 //  * See COPYING.txt for license details. 3 //  * See COPYING.txt for license details.
4 //  */ 4 //  */
5 & when (@media-common = true) { 5 & when (@media-common = true) {
6     .theme-color { 6     .theme-color {
7         color: @theme-color !important; 7         color: @theme-color !important;
8     } 8     }
9     .block { 9     .block {
10         .block-title { 10         .block-title {
11             margin: 5px 0 10px; 11             margin: 5px 0 10px;
12             line-height: 1.2; 12             line-height: 1.2;
13             font-size: 16px; 13             font-size: 16px;
14         } 14         }
15     } 15     }
16     .porto-separator { 16     .porto-separator {
17       margin: 0 0 22px; 17       margin: 0 0 22px;
18       &.short { 18       &.short {
19           margin: -11px 0 11px; 19           margin: -11px 0 11px;
20       } 20       }
21       &.tall { 21       &.tall {
22           margin: 22px 0 44px; 22           margin: 22px 0 44px;
23       } 23       }
24       &.taller { 24       &.taller {
25         margin: 44px 0 66px; 25         margin: 44px 0 66px;
26       } 26       }
27       .separator-line { 27       .separator-line {
28         margin: 0 auto; 28         margin: 0 auto;
29         &.align_left { 29         &.align_left {
30             margin: 0 0 0 auto; 30             margin: 0 0 0 auto;
31         } 31         }
32         &.align_center { 32         &.align_center {
33             margin: 0 auto; 33             margin: 0 auto;
34         } 34         }
35         &.align_right { 35         &.align_right {
36             margin: 0 auto 0 0; 36             margin: 0 auto 0 0;
37         } 37         }
38       } 38       }
39     } 39     }
40     .porto-ibanner { 40     .porto-ibanner {
41         z-index: 1; 41         z-index: 1;
42         overflow: hidden; 42         overflow: hidden;
43         margin: 0 0 35px; 43         margin: 0 0 35px;
44         text-align: center; 44         text-align: center;
45         &,>img { 45         &,>img {
46             display: block; 46             display: block;
47             position: relative; 47             position: relative;
48         } 48         }
49         >img { 49         >img {
50             width: 100%; 50             width: 100%;
51             transition: opacity 0.35s; 51             transition: opacity 0.35s;
52             border: none; 52             border: none;
53             padding: 0; 53             padding: 0;
54             margin: 0; 54             margin: 0;
55             min-height: inherit; 55             min-height: inherit;
56             object-fit: cover; 56             object-fit: cover;
57             transition: transform 0.5s,opacity 0.5s; 57             transition: transform 0.5s,opacity 0.5s;
58             -webkit-backface-visibility: hidden; 58             -webkit-backface-visibility: hidden;
59             &.porto-lazyload:not(.lazy-load-loaded) { 59             &.porto-lazyload:not(.lazy-load-loaded) {
60                 visibility: hidden; 60                 visibility: hidden;
61             } 61             }
62         } 62         }
63         &-layer { 63         &-layer {
64             text-align: right; 64             text-align: right;
65             font-size: 1rem; 65             font-size: 1rem;
66         } 66         }
67         .porto-ibanner-desc { 67         .porto-ibanner-desc {
68             padding: 15px; 68             padding: 15px;
69             color: #fff; 69             color: #fff;
70             font-size: 1em; 70             font-size: 1em;
71             -webkit-backface-visibility: hidden; 71             -webkit-backface-visibility: hidden;
72             backface-visibility: hidden; 72             backface-visibility: hidden;
73             transition: opacity 0.3s; 73             transition: opacity 0.3s;
74             &.no-padding { 74             &.no-padding {
75                 padding: 0; 75                 padding: 0;
76             } 76             }
77             .porto-ibanner-container { 77             .porto-ibanner-container {
78                 position: relative; 78                 position: relative;
79                 height: 100%; 79                 height: 100%;
80             } 80             }
81             &:before,&:after { 81             &:before,&:after {
82                 pointer-events: none; 82                 pointer-events: none;
83             } 83             }
84         } 84         }
85         .porto-ibanner-desc,.porto-ibanner-link { 85         .porto-ibanner-desc,.porto-ibanner-link {
86             position: absolute; 86             position: absolute;
87             top: 0; 87             top: 0;
88             right: 0; 88             right: 0;
89             width: 100%; 89             width: 100%;
90             height: 100% 90             height: 100%
91         } 91         }
92         .porto-ibanner-content { 92         .porto-ibanner-content {
93             font-size: .8125em; 93             font-size: .8125em;
94             line-height: 1.6; 94             line-height: 1.6;
95         } 95         }
96         .porto-ibanner-title,p { 96         .porto-ibanner-title,p {
97             letter-spacing: normal; 97             letter-spacing: normal;
98             padding: 0; 98             padding: 0;
99             margin: 0; 99             margin: 0;
100             font-size: inherit; 100             font-size: inherit;
101             line-height: inherit; 101             line-height: inherit;
102             font-weight: inherit; 102             font-weight: inherit;
103             text-decoration: inherit; 103             text-decoration: inherit;
104             font-style: inherit; 104             font-style: inherit;
105             color: inherit; 105             color: inherit;
106         } 106         }
107         a.porto-ibanner-link { 107         a.porto-ibanner-link {
108             display: block; 108             display: block;
109             z-index: 7; 109             z-index: 7;
110             opacity: 0; 110             opacity: 0;
111             background: 0 0; 111             background: 0 0;
112         } 112         }
113     } 113     }
114     ul.products { 114     ul.products {
115       .product-col { 115       .product-col {
116         padding-left: 10px; 116         padding-left: 10px;
117         padding-right: 10px; 117         padding-right: 10px;
118       } 118       }
119       li.product-category { 119       li.product-category {
120           text-align: center; 120           text-align: center;
121           a { 121           a {
122               text-decoration: none; 122               text-decoration: none;
123           } 123           }
124           .thumb-info { 124           .thumb-info {
125               min-height: 90px; 125               min-height: 90px;
126               margin-bottom: 0; 126               margin-bottom: 0;
127               text-align: left; 127               text-align: left;
128  128 
129               h3 { 129               h3 {
130                   font-weight: 700; 130                   font-weight: 700;
131                   margin: 0 0 10px; 131                   margin: 0 0 10px;
132                   color: inherit; 132                   color: inherit;
133                   letter-spacing: -.005em; 133                   letter-spacing: -.005em;
134               } 134               }
135           } 135           }
136           .thumb-info-title { 136           .thumb-info-title {
137               background: none; 137               background: none;
138               max-width: none; 138               max-width: none;
139               width: 100%; 139               width: 100%;
140               bottom: 0; 140               bottom: 0;
141               padding: 1.2em 1.5em; 141               padding: 1.2em 1.5em;
142               margin: 0; 142               margin: 0;
143           } 143           }
144           .thumb-info-type { 144           .thumb-info-type {
145               display: block; 145               display: block;
146               margin: -10px 0 0; 146               margin: -10px 0 0;
147               padding: 0; 147               padding: 0;
148               font-weight: 400; 148               font-weight: 400;
149               background: none; 149               background: none;
150               float: none; 150               float: none;
151               opacity: .7; 151               opacity: .7;
152               line-height: 1.8; 152               line-height: 1.8;
153           } 153           }
154  154 
155           mark { 155           mark {
156               padding: 0; 156               padding: 0;
157               background: none; 157               background: none;
158               color: inherit; 158               color: inherit;
159           } 159           }
160           .thumb-info-wrapper:after { 160           .thumb-info-wrapper:after {
161               background: rgba(27, 27, 23, .15); 161               background: rgba(27, 27, 23, .15);
162               z-index: 1; 162               z-index: 1;
163               opacity: 1; 163               opacity: 1;
164           } 164           }
165           &:hover .thumb-info-wrapper:after { 165           &:hover .thumb-info-wrapper:after {
166               background: rgba(27, 27, 23, .3); 166               background: rgba(27, 27, 23, .3);
167           } 167           }
168       } 168       }
169       li.cat-has-icon { 169       li.cat-has-icon {
170           .thumb-info { 170           .thumb-info {
171               padding: 40px 0 25px; 171               padding: 40px 0 25px;
172               transition: box-shadow .2s; 172               transition: box-shadow .2s;
173               text-align: center; 173               text-align: center;
174               > i { 174               > i {
175                   font-size: 3em; 175                   font-size: 3em;
176                   display: inline-block; 176                   display: inline-block;
177                   margin-bottom: 15px; 177                   margin-bottom: 15px;
178               } 178               }
179           } 179           }
180           .thumb-info-wrap { 180           .thumb-info-wrap {
181               display: block; 181               display: block;
182           } 182           }
183           .thumb-info-title { 183           .thumb-info-title {
184               display: block; 184               display: block;
185               position: static; 185               position: static;
186               padding: 0 0 10px; 186               padding: 0 0 10px;
187           } 187           }
188       } 188       }
189       &.category-pos-middle li.product-category .thumb-info-title { 189       &.category-pos-middle li.product-category .thumb-info-title {
190           position: absolute; 190           position: absolute;
191           bottom: auto; 191           bottom: auto;
192           top: 50%; 192           top: 50%;
193           transform: translateY(-50%); 193           transform: translateY(-50%);
194       } 194       }
195       &.category-pos-outside li.product-category .thumb-info-title { 195       &.category-pos-outside li.product-category .thumb-info-title {
196           position: static; 196           position: static;
197           transform: none; 197           transform: none;
198           display: block; 198           display: block;
199           padding-left: 0; 199           padding-left: 0;
200           padding-right: 0; 200           padding-right: 0;
201       } 201       }
202       &.category-text-center .thumb-info-title { 202       &.category-text-center .thumb-info-title {
203           text-align: center; 203           text-align: center;
204       } 204       }
205       &.category-text-right .thumb-info-title { 205       &.category-text-right .thumb-info-title {
206             text-align: left; 206             text-align: left;
207         } 207         }
208     } 208     }
209     li.product-category { 209     li.product-category {
210       .thumb-info-title a { 210       .thumb-info-title a {
211         color: inherit 211         color: inherit
212       } 212       }
213       .thumb-info-title a:hover { 213       .thumb-info-title a:hover {
214         color: inherit; 214         color: inherit;
215         text-decoration: underline; 215         text-decoration: underline;
216       } 216       }
217       .sub-categories { 217       .sub-categories {
218         font-size: .875rem; 218         font-size: .875rem;
219         font-weight: 400; 219         font-weight: 400;
220         opacity: .7 220         opacity: .7
221       } 221       }
222     } 222     }
223     ul.category-color-dark li.product-category .thumb-info-title { 223     ul.category-color-dark li.product-category .thumb-info-title {
224       color: #1d2127; 224       color: #1d2127;
225     } 225     }
226     .grid-creative { 226     .grid-creative {
227         &.category-pos-outside { 227         &.category-pos-outside {
228             li.product-category .thumb-info { 228             li.product-category .thumb-info {
229                 height: calc(~"100% - (60px)"); 229                 height: calc(~"100% - (60px)");
230             } 230             }
231         } 231         }
232     } 232     }
233     .porto-products.show-count-on-hover li.product-category .thumb-info-type { 233     .porto-products.show-count-on-hover li.product-category .thumb-info-type {
234         max-height: 10px; 234         max-height: 10px;
235         transition: .5s; 235         transition: .5s;
236         transform: translateY(20%); 236         transform: translateY(20%);
237         opacity: 0; 237         opacity: 0;
238     } 238     }
239     .porto-products.show-count-on-hover li.product-category:hover .thumb-info-type { 239     .porto-products.show-count-on-hover li.product-category:hover .thumb-info-type {
240         max-height: 30px; 240         max-height: 30px;
241         transform: translateY(0); 241         transform: translateY(0);
242         opacity: .7; 242         opacity: .7;
243     } 243     }
244     .porto-products.hide-count { 244     .porto-products.hide-count {
245         li.product-category { 245         li.product-category {
246             .thumb-info-type { 246             .thumb-info-type {
247                 display: none; 247                 display: none;
248             } 248             }
249             .thumb-info h3 { 249             .thumb-info h3 {
250                 margin-bottom: 0; 250                 margin-bottom: 0;
251             } 251             }
252         } 252         }
253     } 253     }
254     .thumb-info { 254     .thumb-info {
255       display: block; 255       display: block;
256       position: relative; 256       position: relative;
257       text-decoration: none; 257       text-decoration: none;
258       max-width: 100%; 258       max-width: 100%;
259       -webkit-backface-visibility: hidden; 259       -webkit-backface-visibility: hidden;
260       backface-visibility: hidden; 260       backface-visibility: hidden;
261       -webkit-transform: translate3d(0,0,0); 261       -webkit-transform: translate3d(0,0,0);
262       transform: translate3d(0,0,0); 262       transform: translate3d(0,0,0);
263       .thumb-info-wrapper { 263       .thumb-info-wrapper {
264         -webkit-backface-visibility: hidden; 264         -webkit-backface-visibility: hidden;
265         backface-visibility: hidden; 265         backface-visibility: hidden;
266         -webkit-transform: translate3d(0,0,0); 266         -webkit-transform: translate3d(0,0,0);
267         transform: translate3d(0,0,0); 267         transform: translate3d(0,0,0);
268         margin: 0; 268         margin: 0;
269         overflow: hidden; 269         overflow: hidden;
270         display: block; 270         display: block;
271         position: relative; 271         position: relative;
272         &:after { 272         &:after {
273           content: ""; 273           content: "";
274           transition: all 0.3s; 274           transition: all 0.3s;
275           bottom: 0; 275           bottom: 0;
276           color: #FFF; 276           color: #FFF;
277           left: 0; 277           left: 0;
278           position: absolute; 278           position: absolute;
279           right: 0; 279           right: 0;
280           top: 0; 280           top: 0;
281           display: block; 281           display: block;
282           opacity: 0; 282           opacity: 0;
283           z-index: 1 283           z-index: 1
284         } 284         }
285       } 285       }
286       .thumb-info-title { 286       .thumb-info-title {
287         transition: all 0.3s; 287         transition: all 0.3s;
288         background: rgba(33,37,41,.8); 288         background: rgba(33,37,41,.8);
289         bottom: 13%; 289         bottom: 13%;
290         color: #fff; 290         color: #fff;
291         font-size: 17px; 291         font-size: 17px;
292         font-weight: 600; 292         font-weight: 600;
293         right: 0; 293         right: 0;
294         letter-spacing: -.05em; 294         letter-spacing: -.05em;
295         padding: 13px 21px 2px; 295         padding: 13px 21px 2px;
296         position: absolute; 296         position: absolute;
297         z-index: 2; 297         z-index: 2;
298         max-width: 90%; 298         max-width: 90%;
299       } 299       }
300       .thumb-info-inner { 300       .thumb-info-inner {
301         transition: all 0.3s; 301         transition: all 0.3s;
302         display: block; 302         display: block;
303         font: inherit; 303         font: inherit;
304         color: inherit; 304         color: inherit;
305         margin-bottom: 0; 305         margin-bottom: 0;
306       } 306       }
307       .thumb-info-type { 307       .thumb-info-type {
308         display: inline-block; 308         display: inline-block;
309         float: right; 309         float: right;
310         font-size: .6em; 310         font-size: .6em;
311         font-weight: 600; 311         font-weight: 600;
312         letter-spacing: 0; 312         letter-spacing: 0;
313         margin: 8px 0 -15px -2px; 313         margin: 8px 0 -15px -2px;
314         padding: 2px 12px; 314         padding: 2px 12px;
315         text-transform: uppercase; 315         text-transform: uppercase;
316         z-index: 2; 316         z-index: 2;
317         line-height: 2.3; 317         line-height: 2.3;
318       } 318       }
319       img { 319       img {
320         transition: all 0.3s ease; 320         transition: all 0.3s ease;
321         position: relative; 321         position: relative;
322         width: 100%; 322         width: 100%;
323       } 323       }
324     } 324     }
325     .single-subscribe { 325     .single-subscribe {
326       .newsletter { 326       .newsletter {
327         .control { 327         .control {
328           display: flex; 328           display: flex;
329           align-items: center; 329           align-items: center;
330         } 330         }
331         .input-text {display: block;flex:1;} 331         .input-text {display: block;flex:1;}
332         input { 332         input {
333           height: 3rem; 333           height: 3rem;
334           padding-right: 20px; 334           padding-right: 20px;
335           padding-left: 25px; 335           padding-left: 25px;
336           border-radius: 0 30px 30px 0; 336           border-radius: 0 30px 30px 0;
337           font-size: .75rem; 337           font-size: .75rem;
338           color: #777; 338           color: #777;
339           border: none; 339           border: none;
340           margin: 0; 340           margin: 0;
341           width: 100%; 341           width: 100%;
342           display: block; 342           display: block;
343         } 343         }
344         .action { 344         .action {
345           height: 3rem; 345           height: 3rem;
346           padding-left: 20px; 346           padding-left: 20px;
347           padding-right: 20px; 347           padding-right: 20px;
348           text-transform: uppercase; 348           text-transform: uppercase;
349           font-weight: 700; 349           font-weight: 700;
350           border-radius: 30px 0 0 30px; 350           border-radius: 30px 0 0 30px;
351         } 351         }
352       } 352       }
353     } 353     }
354     .porto-links-block { 354     .porto-links-block {
355       border: 1px solid; 355       border: 1px solid;
356       .links-title { 356       .links-title {
357         border-bottom: 1px solid;font-size: 1em;font-weight: 700;line-height: 14px;padding: 15px 20px;margin: 0;text-transform: uppercase;position: relative;letter-spacing: .12px;transition: 0.25s; 357         border-bottom: 1px solid;font-size: 1em;font-weight: 700;line-height: 14px;padding: 15px 20px;margin: 0;text-transform: uppercase;position: relative;letter-spacing: .12px;transition: 0.25s;
358         i {margin-left: 5px;} 358         i {margin-left: 5px;}
359       } 359       }
360       .links-content ul {list-style: none;padding: 5px 0;margin: 0;} 360       .links-content ul {list-style: none;padding: 5px 0;margin: 0;}
361       li.porto-links-item { 361       li.porto-links-item {
362         display: block;margin: 0; 362         display: block;margin: 0;
363         &:first-child>a,&:first-child>span {border-top-width: 0;} 363         &:first-child>a,&:first-child>span {border-top-width: 0;}
364         a,span {display: block;font-size: 1em;line-height: 20px;color: #465157;letter-spacing: .1px;padding: 11px 6px 10px;margin: 0 10px -1px;text-decoration: none;border-top: 1px solid #ddd;} 364         a,span {display: block;font-size: 1em;line-height: 20px;color: #465157;letter-spacing: .1px;padding: 11px 6px 10px;margin: 0 10px -1px;text-decoration: none;border-top: 1px solid #ddd;}
365         a:hover {text-decoration: underline;} 365         a:hover {text-decoration: underline;}
366         i {margin-left: 12px;font-size: 20px;float: right;} 366         i {margin-left: 12px;font-size: 20px;float: right;}
367         i.icon-image {display: inline-block;vertical-align: middle;float: none;max-width: 20px;} 367         i.icon-image {display: inline-block;vertical-align: middle;float: none;max-width: 20px;}
368       } 368       }
369     } 369     }
370     .divider { 370     .divider {
371       height: 1px; 371       height: 1px;
372       &.divider-small { 372       &.divider-small {
373         margin: 22px auto;background: transparent; 373         margin: 22px auto;background: transparent;
374         &.divider-small-center { 374         &.divider-small-center {
375           text-align: center; 375           text-align: center;
376           hr {margin-left: auto;margin-right: auto;} 376           hr {margin-left: auto;margin-right: auto;}
377         } 377         }
378         hr {width: 50px;height: 1px;} 378         hr {width: 50px;height: 1px;}
379       } 379       }
380     } 380     }
381     .category-sidebar{ 381     .category-sidebar{
382       padding: .7143em 0; 382       padding: .7143em 0;
383       list-style:none; 383       list-style:none;
384       margin:0; 384       margin:0;
385       font-size: .9286em; 385       font-size: .9286em;
386       li { 386       li {
387         position:relative; 387         position:relative;
388         margin:0; 388         margin:0;
389         color: #777; 389         color: #777;
390         > a:not(.expand-icon){ 390         > a:not(.expand-icon){
391           display: block; 391           display: block;
392           font-size: .875rem; 392           font-size: .875rem;
393           font-weight: 600; 393           font-weight: 600;
394           padding-top: .625rem; 394           padding-top: .625rem;
395           padding-bottom: .625rem; 395           padding-bottom: .625rem;
396           border-bottom: 1px solid #e7e7e7; 396           border-bottom: 1px solid #e7e7e7;
397           color: inherit; 397           color: inherit;
398         } 398         }
399         >.expand-icon{ 399         >.expand-icon{
400             position: absolute; 400             position: absolute;
401             left: -6px; 401             left: -6px;
402             top: 9px; 402             top: 9px;
403             font-size: 18px; 403             font-size: 18px;
404             line-height: 24px; 404             line-height: 24px;
405             color: inherit; 405             color: inherit;
406             width: 24px; 406             width: 24px;
407             height: 24px; 407             height: 24px;
408           em.porto-icon-plus-squared::before {content:"\f807";} 408           em.porto-icon-plus-squared::before {content:"\f807";}
409           em.porto-icon-minus-squared::before {content:"\f804";} 409           em.porto-icon-minus-squared::before {content:"\f804";}
410         } 410         }
411       } 411       }
412       > li { 412       > li {
413         &:last-child { 413         &:last-child {
414           > a:not(.expand-icon){ 414           > a:not(.expand-icon){
415             border-bottom: 0; 415             border-bottom: 0;
416           } 416           }
417         } 417         }
418       } 418       }
419       ul{display:none;list-style:none;padding-right: 1.0714em;margin:0} 419       ul{display:none;list-style:none;padding-right: 1.0714em;margin:0}
420     } 420     }
421     .onepage-category{ 421     .onepage-category{
422       >.category-list{ 422       >.category-list{
423         position:fixed; 423         position:fixed;
424         right:0; 424         right:0;
425         top:0; 425         top:0;
426         bottom: 0; 426         bottom: 0;
427         min-height:100%; 427         min-height:100%;
428         width:80px; 428         width:80px;
429         text-align:left; 429         text-align:left;
430         background:#222529; 430         background:#222529;
431         padding:32px 0 0; 431         padding:32px 0 0;
432         z-index:20; 432         z-index:20;
433         >ul{ 433         >ul{
434           position:relative; 434           position:relative;
435           z-index:2; 435           z-index:2;
436           list-style:none; 436           list-style:none;
437           padding:0; 437           padding:0;
438           transition:all .3s; 438           transition:all .3s;
439           padding-top:0; 439           padding-top:0;
440           margin-bottom:0; 440           margin-bottom:0;
441           >li{ 441           >li{
442             margin: 0;margin-bottom: 1rem; 442             margin: 0;margin-bottom: 1rem;
443             >a{ 443             >a{
444               color:#fff; 444               color:#fff;
445               width:auto; 445               width:auto;
446               line-height:79px; 446               line-height:79px;
447               display:inline-block; 447               display:inline-block;
448               white-space:nowrap; 448               white-space:nowrap;
449               position:relative; 449               position:relative;
450               transition:all .3s; 450               transition:all .3s;
451               >em{ 451               >em{
452                 font-size:1.6875rem; 452                 font-size:1.6875rem;
453                 width:80px; 453                 width:80px;
454                 display:inline-block; 454                 display:inline-block;
455                 text-align:center; 455                 text-align:center;
456                 vertical-align:middle; 456                 vertical-align:middle;
457                 >img{ 457                 >img{
458                   vertical-align:middle; 458                   vertical-align:middle;
459                 } 459                 }
460               } 460               }
461               >span{ 461               >span{
462                 display:inline-block; 462                 display:inline-block;
463                 vertical-align:middle; 463                 vertical-align:middle;
464                 opacity:0; 464                 opacity:0;
465                 visibility:hidden; 465                 visibility:hidden;
466                 width:0; 466                 width:0;
467                 transition:all .3s; 467                 transition:all .3s;
468                 font-size:16px; 468                 font-size:16px;
469                 font-weight:600; 469                 font-weight:600;
470                 position:relative; 470                 position:relative;
471                 overflow:hidden; 471                 overflow:hidden;
472               } 472               }
473               &:after{ 473               &:after{
474                 content:""; 474                 content:"";
475                 width:16px; 475                 width:16px;
476                 height:16px; 476                 height:16px;
477                 position:absolute; 477                 position:absolute;
478                 display:block; 478                 display:block;
479                 left:-15px; 479                 left:-15px;
480                 top:50%; 480                 top:50%;
481                 margin-top:-8px; 481                 margin-top:-8px;
482                 border:8px solid transparent; 482                 border:8px solid transparent;
483                 transition:all .3s; 483                 transition:all .3s;
484               } 484               }
485               &.active,&:hover{ 485               &.active,&:hover{
486                 background-color:#00d59d; 486                 background-color:#00d59d;
487                 &:after{ 487                 &:after{
488                   border-right-color:#00d59d; 488                   border-right-color:#00d59d;
489                 } 489                 }
490               } 490               }
491               &:hover { 491               &:hover {
492                 >span{ 492                 >span{
493                   opacity:1; 493                   opacity:1;
494                   visibility:visible; 494                   visibility:visible;
495                   width:auto; 495                   width:auto;
496                   padding-left:50px; 496                   padding-left:50px;
497                 } 497                 }
498               } 498               }
499             } 499             }
500             &:last-child{margin-bottom:0;} 500             &:last-child{margin-bottom:0;}
501           } 501           }
502         } 502         }
503       } 503       }
504       >.category-details{ 504       >.category-details{
505         position:relative; 505         position:relative;
506         float:left; 506         float:left;
507         width:100%; 507         width:100%;
508         min-height:80vh; 508         min-height:80vh;
509       } 509       }
510       .category-details{ 510       .category-details{
511         padding: 70px 0; 511         padding: 70px 0;
512         .title-menu{ 512         .title-menu{
513           position:relative; 513           position:relative;
514           margin-bottom: 25px; 514           margin-bottom: 25px;
515           >a{ 515           >a{
516             font-family: 'Poppins'; 516             font-family: 'Poppins';
517             color: #222529; 517             color: #222529;
518             display: inline-block; 518             display: inline-block;
519             margin-top: 0; 519             margin-top: 0;
520             font-size: 1.375rem; 520             font-size: 1.375rem;
521             font-weight: 600; 521             font-weight: 600;
522             letter-spacing: .025em; 522             letter-spacing: .025em;
523             line-height: 46px; 523             line-height: 46px;
524             text-transform: uppercase; 524             text-transform: uppercase;
525             >span{ 525             >span{
526               display:inline-block; 526               display:inline-block;
527               vertical-align:middle; 527               vertical-align:middle;
528             } 528             }
529             &.parent{ 529             &.parent{
530               &:after{ 530               &:after{
531                 display:inline-block; 531                 display:inline-block;
532                 content:"\f813"; 532                 content:"\f813";
533                 font-family:porto-icons; 533                 font-family:porto-icons;
534                 margin-right:18px; 534                 margin-right:18px;
535                 font-size:18px; 535                 font-size:18px;
536                 vertical-align:middle; 536                 vertical-align:middle;
537                 line-height:36px; 537                 line-height:36px;
538               } 538               }
539               &.opened:after{content:"\f810";} 539               &.opened:after{content:"\f810";}
540             } 540             }
541           } 541           }
542           >.menu-popup{ 542           >.menu-popup{
543             position:absolute; 543             position:absolute;
544             right: 0; 544             right: 0;
545             top:100%; 545             top:100%;
546             display:none; 546             display:none;
547             width:100%; 547             width:100%;
548             z-index:3; 548             z-index:3;
549             background-color:#fff; 549             background-color:#fff;
550             border:1px solid #bebebe; 550             border:1px solid #bebebe;
551             border-radius:5px; 551             border-radius:5px;
552             padding:50px 0; 552             padding:50px 0;
553             &:before{ 553             &:before{
554               content:""; 554               content:"";
555               border:8px solid transparent; 555               border:8px solid transparent;
556               width:16px; 556               width:16px;
557               height:16px; 557               height:16px;
558               display:block; 558               display:block;
559               border-bottom-color:#bebebe; 559               border-bottom-color:#bebebe;
560               position:absolute; 560               position:absolute;
561               top:-16px; 561               top:-16px;
562               right:90px; 562               right:90px;
563             } 563             }
564             &:after{ 564             &:after{
565               content:""; 565               content:"";
566               border:7px solid transparent; 566               border:7px solid transparent;
567               width:14px; 567               width:14px;
568               height:14px; 568               height:14px;
569               display:block; 569               display:block;
570               border-bottom-color:#fff; 570               border-bottom-color:#fff;
571               position:absolute; 571               position:absolute;
572               top:-13px; 572               top:-13px;
573               right:91px; 573               right:91px;
574             } 574             }
575           } 575           }
576         } 576         }
577         .menu-popup { 577         .menu-popup {
578           ul{ 578           ul{
579             list-style:none; 579             list-style:none;
580             padding:0; 580             padding:0;
581             margin:0; 581             margin:0;
582             >li> a{ 582             >li> a{
583               color:#000; 583               color:#000;
584               font-size:16px; 584               font-size:16px;
585               line-height:2.5; 585               line-height:2.5;
586             } 586             }
587           } 587           }
588           >ul{ 588           >ul{
589             display:flex; 589             display:flex;
590             flex-wrap:wrap; 590             flex-wrap:wrap;
591             >li{ 591             >li{
592               float:right; 592               float:right;
593               border-right:1px solid #bebebe; 593               border-right:1px solid #bebebe;
594               margin:10px 0; 594               margin:10px 0;
595               padding:30px 0; 595               padding:30px 0;
596               > a{ 596               > a{
597                 font-weight:700; 597                 font-weight:700;
598                 text-transform:uppercase; 598                 text-transform:uppercase;
599               } 599               }
600             } 600             }
601             &.columns5>li{ 601             &.columns5>li{
602               width:20%; 602               width:20%;
603               padding-right:4%; 603               padding-right:4%;
604               padding-left:4%; 604               padding-left:4%;
605               &:nth-child(5n+1){ 605               &:nth-child(5n+1){
606                 border-right:0; 606                 border-right:0;
607                 clear:right; 607                 clear:right;
608               } 608               }
609             } 609             }
610           } 610           }
611           li.menu-item{margin-bottom:0;} 611           li.menu-item{margin-bottom:0;}
612         } 612         }
613         .products-area{ 613         .products-area{
614           .category-link{ 614           .category-link{
615             float:left; 615             float:left;
616             margin-top:-60px; 616             margin-top:-60px;
617             margin-right:0; 617             margin-right:0;
618             position:relative; 618             position:relative;
619             z-index:2; 619             z-index:2;
620             font-size: .8125rem; 620             font-size: .8125rem;
621             padding: 1em 3em; 621             padding: 1em 3em;
622             letter-spacing: .01em; 622             letter-spacing: .01em;
623             font-weight: 700; 623             font-weight: 700;
624             line-height: 1.42857; 624             line-height: 1.42857;
625             background: #222529; 625             background: #222529;
626             border: 1px solid transparent; 626             border: 1px solid transparent;
627             color: #fff; 627             color: #fff;
628             text-transform: uppercase; 628             text-transform: uppercase;
629           } 629           }
630         } 630         }
631       } 631       }
632       .additional-content { 632       .additional-content {
633         margin-bottom: 1.5vw; 633         margin-bottom: 1.5vw;
634         img{ 634         img{
635           max-width:100%; 635           max-width:100%;
636         } 636         }
637       } 637       }
638       .menu-popup a>span{ 638       .menu-popup a>span{
639         position:relative; 639         position:relative;
640         >span.cat-label{ 640         >span.cat-label{
641           top:3px; 641           top:3px;
642           left:-35px; 642           left:-35px;
643           font:inherit; 643           font:inherit;
644           font-size:9px; 644           font-size:9px;
645           padding:2px; 645           padding:2px;
646           z-index:1; 646           z-index:1;
647           border-radius:2px; 647           border-radius:2px;
648           line-height:1; 648           line-height:1;
649           border:1px solid #777; 649           border:1px solid #777;
650           position:absolute; 650           position:absolute;
651         } 651         }
652       } 652       }
653       .onepage-category & { 653       .onepage-category & {
654         display:flex; 654         display:flex;
655         flex-wrap:wrap; 655         flex-wrap:wrap;
656       } 656       }
657     } 657     }
658     .onepage-cat.category-list {position: fixed;width: 80px;right: 0;height: 100%;top: 0;bottom: 0;} 658     .onepage-cat.category-list {position: fixed;width: 80px;right: 0;height: 100%;top: 0;bottom: 0;}
659     body>.onepage-cat.category-list { 659     body>.onepage-cat.category-list {
660         display: none; 660         display: none;
661     } 661     }
662     // vc columns 662     // vc columns
663     .pt_row { 663     .pt_row {
664       &.pt_row-no-padding { 664       &.pt_row-no-padding {
665         .pt_column-inner { 665         .pt_column-inner {
666           padding-left: 0; 666           padding-left: 0;
667           padding-right: 0; 667           padding-right: 0;
668         } 668         }
669       } 669       }
670     } 670     }
671  671 
672     .pt_row-no-padding { 672     .pt_row-no-padding {
673       .pt_inner { 673       .pt_inner {
674         margin-left: 0; 674         margin-left: 0;
675         margin-right: 0; 675         margin-right: 0;
676       } 676       }
677     } 677     }
678  678 
679     .pt_row { 679     .pt_row {
680       &.pt_row-o-full-height { 680       &.pt_row-o-full-height {
681         min-height: 100vh; 681         min-height: 100vh;
682       } 682       }
683  683 
684       // enable flex 684       // enable flex
685       &.pt_row-flex { 685       &.pt_row-flex {
686         box-sizing: border-box; 686         box-sizing: border-box;
687         display: -webkit-box; 687         display: -webkit-box;
688         display: -webkit-flex; 688         display: -webkit-flex;
689         display: -ms-flexbox; 689         display: -ms-flexbox;
690         display: flex; 690         display: flex;
691         -webkit-flex-wrap: wrap; 691         -webkit-flex-wrap: wrap;
692         -ms-flex-wrap: wrap; 692         -ms-flex-wrap: wrap;
693         flex-wrap: wrap; 693         flex-wrap: wrap;
694  694 
695         > .pt_column_container { 695         > .pt_column_container {
696           display: -webkit-box; 696           display: -webkit-box;
697           display: -webkit-flex; 697           display: -webkit-flex;
698           display: -ms-flexbox; 698           display: -ms-flexbox;
699           display: flex; 699           display: flex;
700           > .pt_column-inner { 700           > .pt_column-inner {
701             -webkit-box-flex: 1; 701             -webkit-box-flex: 1;
702             -webkit-flex-grow: 1; 702             -webkit-flex-grow: 1;
703             -ms-flex-positive: 1; 703             -ms-flex-positive: 1;
704             flex-grow: 1; 704             flex-grow: 1;
705             display: -webkit-box; 705             display: -webkit-box;
706             display: -webkit-flex; 706             display: -webkit-flex;
707             display: -ms-flexbox; 707             display: -ms-flexbox;
708             display: flex; 708             display: flex;
709             -webkit-box-orient: vertical; 709             -webkit-box-orient: vertical;
710             -webkit-box-direction: normal; 710             -webkit-box-direction: normal;
711             -webkit-flex-direction: column; 711             -webkit-flex-direction: column;
712             -ms-flex-direction: column; 712             -ms-flex-direction: column;
713             flex-direction: column; 713             flex-direction: column;
714             z-index: 1; 714             z-index: 1;
715             max-width: 100%; 715             max-width: 100%;
716             @media (-ms-high-contrast: active), (-ms-high-contrast: none) { 716             @media (-ms-high-contrast: active), (-ms-high-contrast: none) {
717               /* IE10+ specific styles */ 717               /* IE10+ specific styles */
718               & > * { 718               & > * {
719                 min-height: 1em; 719                 min-height: 1em;
720               } 720               }
721             } 721             }
722           } 722           }
723         } 723         }
724  724 
725         &::before, 725         &::before,
726         &::after { 726         &::after {
727           display: none; 727           display: none;
728         } 728         }
729       } 729       }
730  730 
731       // columns alignment 731       // columns alignment
732       &.pt_row-o-columns-stretch { 732       &.pt_row-o-columns-stretch {
733         -webkit-align-content: stretch; 733         -webkit-align-content: stretch;
734         -ms-flex-line-pack: stretch; 734         -ms-flex-line-pack: stretch;
735         align-content: stretch; 735         align-content: stretch;
736       } 736       }
737       &.pt_row-o-columns-top { 737       &.pt_row-o-columns-top {
738         -webkit-align-content: flex-start; 738         -webkit-align-content: flex-start;
739         -ms-flex-line-pack: start; 739         -ms-flex-line-pack: start;
740         align-content: flex-start; 740         align-content: flex-start;
741       } 741       }
742       &.pt_row-o-columns-bottom { 742       &.pt_row-o-columns-bottom {
743         -webkit-align-content: flex-end; 743         -webkit-align-content: flex-end;
744         -ms-flex-line-pack: end; 744         -ms-flex-line-pack: end;
745         align-content: flex-end; 745         align-content: flex-end;
746       } 746       }
747       &.pt_row-o-columns-middle { 747       &.pt_row-o-columns-middle {
748         -webkit-align-content: center; 748         -webkit-align-content: center;
749         -ms-flex-line-pack: center; 749         -ms-flex-line-pack: center;
750         align-content: center; 750         align-content: center;
751       } 751       }
752       &.pt_row-o-columns-top, 752       &.pt_row-o-columns-top,
753       &.pt_row-o-columns-bottom, 753       &.pt_row-o-columns-bottom,
754       &.pt_row-o-columns-middle { 754       &.pt_row-o-columns-middle {
755         &::after { 755         &::after {
756           content: ''; 756           content: '';
757           width: 100%; 757           width: 100%;
758           height: 0; 758           height: 0;
759           overflow: hidden; 759           overflow: hidden;
760           visibility: hidden; 760           visibility: hidden;
761           display: block; 761           display: block;
762         } 762         }
763       } 763       }
764  764 
765       // equal height 765       // equal height
766       &.pt_row-o-equal-height { 766       &.pt_row-o-equal-height {
767         > .pt_column_container { 767         > .pt_column_container {
768           -webkit-box-align: stretch; 768           -webkit-box-align: stretch;
769           -webkit-align-items: stretch; 769           -webkit-align-items: stretch;
770           -ms-flex-align: stretch; 770           -ms-flex-align: stretch;
771           align-items: stretch; 771           align-items: stretch;
772         } 772         }
773       } 773       }
774  774 
775       // content alignment 775       // content alignment
776       &.pt_row-o-content-top { 776       &.pt_row-o-content-top {
777         > .pt_column_container { 777         > .pt_column_container {
778           > .pt_column-inner { 778           > .pt_column-inner {
779             -webkit-box-pack: start; 779             -webkit-box-pack: start;
780             -webkit-justify-content: flex-start; 780             -webkit-justify-content: flex-start;
781             -ms-flex-pack: start; 781             -ms-flex-pack: start;
782             justify-content: flex-start; 782             justify-content: flex-start;
783           } 783           }
784         } 784         }
785         &:not(.pt_row-o-equal-height) { 785         &:not(.pt_row-o-equal-height) {
786           > .pt_column_container { 786           > .pt_column_container {
787             -webkit-box-align: start; 787             -webkit-box-align: start;
788             -webkit-align-items: flex-start; 788             -webkit-align-items: flex-start;
789             -ms-flex-align: start; 789             -ms-flex-align: start;
790             align-items: flex-start; 790             align-items: flex-start;
791           } 791           }
792         } 792         }
793       } 793       }
794       &.pt_row-o-content-bottom { 794       &.pt_row-o-content-bottom {
795         > .pt_column_container { 795         > .pt_column_container {
796           > .pt_column-inner { 796           > .pt_column-inner {
797             -webkit-box-pack: end; 797             -webkit-box-pack: end;
798             -webkit-justify-content: flex-end; 798             -webkit-justify-content: flex-end;
799             -ms-flex-pack: end; 799             -ms-flex-pack: end;
800             justify-content: flex-end; 800             justify-content: flex-end;
801           } 801           }
802         } 802         }
803         &:not(.pt_row-o-equal-height) { 803         &:not(.pt_row-o-equal-height) {
804           > .pt_column_container { 804           > .pt_column_container {
805             -webkit-box-align: end; 805             -webkit-box-align: end;
806             -webkit-align-items: flex-end; 806             -webkit-align-items: flex-end;
807             -ms-flex-align: end; 807             -ms-flex-align: end;
808             align-items: flex-end; 808             align-items: flex-end;
809           } 809           }
810         } 810         }
811       } 811       }
812       &.pt_row-o-content-middle { 812       &.pt_row-o-content-middle {
813         > .pt_column_container { 813         > .pt_column_container {
814           > .pt_column-inner { 814           > .pt_column-inner {
815             -webkit-box-pack: center; 815             -webkit-box-pack: center;
816             -webkit-justify-content: center; 816             -webkit-justify-content: center;
817             -ms-flex-pack: center; 817             -ms-flex-pack: center;
818             justify-content: center; 818             justify-content: center;
819           } 819           }
820         } 820         }
821         &:not(.pt_row-o-equal-height) { 821         &:not(.pt_row-o-equal-height) {
822           > .pt_column_container { 822           > .pt_column_container {
823             -webkit-box-align: center; 823             -webkit-box-align: center;
824             -webkit-align-items: center; 824             -webkit-align-items: center;
825             -ms-flex-align: center; 825             -ms-flex-align: center;
826             align-items: center; 826             align-items: center;
827           } 827           }
828         } 828         }
829       } 829       }
830     } 830     }
831  831 
832     // Clearfix for column 832     // Clearfix for column
833     .pt_column-inner { 833     .pt_column-inner {
834       &::before, 834       &::before,
835       &::after { 835       &::after {
836         content: " "; 836         content: " ";
837         display: table; 837         display: table;
838       } 838       }
839       &::after { 839       &::after {
840         clear: both; 840         clear: both;
841       } 841       }
842     } 842     }
843     // 843     //
844     //  Footer 844     //  Footer
845     //  --------------------------------------------- 845     //  ---------------------------------------------
846     .widget { 846     .widget {
847       &:first-child {margin-top: 0;} 847       &:first-child {margin-top: 0;}
848       .tagcloud { 848       .tagcloud {
849         margin-top: -.3846em; 849         margin-top: -.3846em;
850         margin-bottom: -.3846em; 850         margin-bottom: -.3846em;
851         a { 851         a {
852           margin: .3846em 0 .3846em .3846em; 852           margin: .3846em 0 .3846em .3846em;
853           padding: .25rem .5rem; 853           padding: .25rem .5rem;
854           line-height: 1; 854           line-height: 1;
855           display: inline-block; 855           display: inline-block;
856           text-decoration: none; 856           text-decoration: none;
857           font-size: .75em!important; 857           font-size: .75em!important;
858           text-transform: uppercase; 858           text-transform: uppercase;
859           font-weight: 700; 859           font-weight: 700;
860           border-radius: 10px; 860           border-radius: 10px;
861         } 861         }
862       } 862       }
863       &.contact-info { 863       &.contact-info {
864         ul,li { 864         ul,li {
865           border-width: 0; 865           border-width: 0;
866           margin: 0; 866           margin: 0;
867           padding: 0; 867           padding: 0;
868         } 868         }
869         li { 869         li {
870           a{ 870           a{
871             &:hover {text-decoration: underline;} 871             &:hover {text-decoration: underline;}
872           } 872           }
873           &:not(:last-child) {margin-bottom: 10px;} 873           &:not(:last-child) {margin-bottom: 10px;}
874         } 874         }
875         p {margin-bottom: 10px;} 875         p {margin-bottom: 10px;}
876         i {clear: both;float: right;text-align: center;width: 16px;top: -2px;margin: 4px 0 10px 9px;font-size: 1.3em;position: static!important;} 876         i {clear: both;float: right;text-align: center;width: 16px;top: -2px;margin: 4px 0 10px 9px;font-size: 1.3em;position: static!important;}
877         .contact-details { 877         .contact-details {
878           strong,span {display: block;padding-right: 25px;} 878           strong,span {display: block;padding-right: 25px;}
879         } 879         }
880       } 880       }
881       &.follow-us { 881       &.follow-us {
882         .share-links { 882         .share-links {
883           a { 883           a {
884             width: 30px; 884             width: 30px;
885             height: 30px; 885             height: 30px;
886             border-radius: 30px; 886             border-radius: 30px;
887             margin: 2px; 887             margin: 2px;
888             overflow: hidden; 888             overflow: hidden;
889             box-shadow: 0 2px 2px 0 rgba(0,0,0,.3); 889             box-shadow: 0 2px 2px 0 rgba(0,0,0,.3);
890             transition: all 0.2s; 890             transition: all 0.2s;
891             font-size: 14px; 891             font-size: 14px;
892             &:hover {color: #fff;} 892             &:hover {color: #fff;}
893           } 893           }
894         } 894         }
895       } 895       }
896     } 896     }
897     .footer { 897     .footer {
898       &, p { 898       &, p {
899         font-size: 13px; 899         font-size: 13px;
900         line-height: 24px; 900         line-height: 24px;
901         letter-spacing: .065px; 901         letter-spacing: .065px;
902       } 902       }
903       ul { 903       ul {
904           list-style: none; 904           list-style: none;
905           margin: 0; 905           margin: 0;
906           padding: 0; 906           padding: 0;
907       } 907       }
908       li { 908       li {
909           margin: 0; 909           margin: 0;
910       } 910       }
911       .widget { 911       .widget {
912         margin-bottom: 20px; 912         margin-bottom: 20px;
913         p {margin-top: -3px;margin-bottom: 13px;font-size: 1em;} 913         p {margin-top: -3px;margin-bottom: 13px;font-size: 1em;}
914         & + .widget { 914         & + .widget {
915           margin-top: 20px; 915           margin-top: 20px;
916         } 916         }
917         .tagcloud a { 917         .tagcloud a {
918           background: none; 918           background: none;
919           color: inherit; 919           color: inherit;
920           border-radius: 0; 920           border-radius: 0;
921           font-size: 11px!important; 921           font-size: 11px!important;
922           font-weight: 400; 922           font-weight: 400;
923           text-transform: none; 923           text-transform: none;
924           padding: .6em; 924           padding: .6em;
925           border: 1px solid #313438; 925           border: 1px solid #313438;
926         } 926         }
927         &.contact-info { 927         &.contact-info {
928           .contact-details strong { 928           .contact-details strong {
929             font-weight: 400; 929             font-weight: 400;
930           } 930           }
931           i {display: none;} 931           i {display: none;}
932         } 932         }
933       } 933       }
934       .follow-us { 934       .follow-us {
935         .share-links a { 935         .share-links a {
936           width: 40px; 936           width: 40px;
937           height: 40px; 937           height: 40px;
938           border-radius: 20px; 938           border-radius: 20px;
939           border: 1px solid #313438; 939           border: 1px solid #313438;
940           box-shadow: none; 940           box-shadow: none;
941           &:not(:hover) { 941           &:not(:hover) {
942             background: none;color: #fff; 942             background: none;color: #fff;
943           } 943           }
944           &:hover { 944           &:hover {
945             border-color: #fff; 945             border-color: #fff;
946             color: #fff; 946             color: #fff;
947           } 947           }
948         } 948         }
949       } 949       }
950       .contact-info { 950       .contact-info {
951         .contact-info-block { 951         .contact-info-block {
952           .contact-details { 952           .contact-details {
953             strong, span { 953             strong, span {
954               padding-right: 0; 954               padding-right: 0;
955             } 955             }
956             strong {line-height: 1em;color: #fff;} 956             strong {line-height: 1em;color: #fff;}
957           } 957           }
958         } 958         }
959       } 959       }
960       .newsletter { 960       .newsletter {
961         margin-bottom: 0; 961         margin-bottom: 0;
962         label { 962         label {
963           display: none; 963           display: none;
964         } 964         }
965         .field .control:before { 965         .field .control:before {
966           display: none; 966           display: none;
967         } 967         }
968         input { 968         input {
969           height: 48px; 969           height: 48px;
970           padding-left: 25px; 970           padding-left: 25px;
971           padding-right: 25px; 971           padding-right: 25px;
972           border-radius: 0 30px 30px 0; 972           border-radius: 0 30px 30px 0;
973           font-size: .75rem; 973           font-size: .75rem;
974           color: #777; 974           color: #777;
975           border: none; 975           border: none;
976         } 976         }
977         .action.subscribe { 977         .action.subscribe {
978           height: 48px; 978           height: 48px;
979           padding-left: 25px; 979           padding-left: 25px;
980           padding-right: 25px; 980           padding-right: 25px;
981           text-transform: uppercase; 981           text-transform: uppercase;
982           font-weight: 700; 982           font-weight: 700;
983           font-size: .75rem; 983           font-size: .75rem;
984           border-radius: 30px 0 0 30px; 984           border-radius: 30px 0 0 30px;
985           border: none; 985           border: none;
986         } 986         }
987       } 987       }
988     } 988     }
989     .footer-top { 989     .footer-top {
990       .custom-block { 990       .custom-block {
991         display: flex; 991         display: flex;
992         -ms-flex-align: center; 992         -ms-flex-align: center;
993         align-items: center; 993         align-items: center;
994         -ms-flex-pack: justify; 994         -ms-flex-pack: justify;
995         justify-content: space-between; 995         justify-content: space-between;
996         -ms-flex-wrap: wrap; 996         -ms-flex-wrap: wrap;
997         flex-wrap: wrap; 997         flex-wrap: wrap;
998         &:before, &::after { 998         &:before, &::after {
999             content: ''; 999             content: '';
1000             display: block; 1000             display: block;
1001             border-top: 1px solid #e7e7e7; 1001             border-top: 1px solid #e7e7e7;
1002             -ms-flex: 0 0 100%; 1002             -ms-flex: 0 0 100%;
1003             flex: 0 0 100%; 1003             flex: 0 0 100%;
1004         } 1004         }
1005         &:before { 1005         &:before {
1006             margin-bottom: 40px; 1006             margin-bottom: 40px;
1007         } 1007         }
1008         &:after { 1008         &:after {
1009             margin-top: 40px; 1009             margin-top: 40px;
1010         } 1010         }
1011       } 1011       }
1012       .widget:last-child { 1012       .widget:last-child {
1013         margin-bottom: 0; 1013         margin-bottom: 0;
1014       } 1014       }
1015     } 1015     }
1016     .footer-middle { 1016     .footer-middle {
1017         background-color: @footer-middle_background-color; 1017         background-color: @footer-middle_background-color;
1018         color: @footer-middle_font-color; 1018         color: @footer-middle_font-color;
1019         > .container { 1019         > .container {
1020             position: relative; 1020             position: relative;
1021             padding-top: 4rem;padding-bottom: 1.5rem; 1021             padding-top: 4rem;padding-bottom: 1.5rem;
1022             &::after { 1022             &::after {
1023               content: ''; 1023               content: '';
1024               display: block; 1024               display: block;
1025               position: absolute; 1025               position: absolute;
1026               left: 10px; 1026               left: 10px;
1027               bottom: 0; 1027               bottom: 0;
1028               right: 10px; 1028               right: 10px;
1029               border-bottom: 1px solid #313438; 1029               border-bottom: 1px solid #313438;
1030             } 1030             }
1031         } 1031         }
1032         [class^="porto-icon-"], [class*=" porto-icon-"] { 1032         [class^="porto-icon-"], [class*=" porto-icon-"] {
1033             color: @footer-middle-icon_font-color; 1033             color: @footer-middle-icon_font-color;
1034         } 1034         }
1035         .widget_media_image img { 1035         .widget_media_image img {
1036           max-width: 111px; 1036           max-width: 111px;
1037           height: auto; 1037           height: auto;
1038           display: block; 1038           display: block;
1039         } 1039         }
1040         .block { 1040         .block {
1041           text-align: right; 1041           text-align: right;
1042           line-height: 1.5; 1042           line-height: 1.5;
1043           margin: 0; 1043           margin: 0;
1044           width: auto; 1044           width: auto;
1045           .block-title { 1045           .block-title {
1046             margin-bottom: 20px; 1046             margin-bottom: 20px;
1047             strong { 1047             strong {
1048               font-weight: 400; 1048               font-weight: 400;
1049               padding: 0; 1049               padding: 0;
1050               font-size: 16px; 1050               font-size: 16px;
1051               color: @footer-middle-block-title_font-color; 1051               color: @footer-middle-block-title_font-color;
1052               text-transform: none; 1052               text-transform: none;
1053             } 1053             }
1054           } 1054           }
1055         } 1055         }
1056         a { 1056         a {
1057             &, &:hover, &:focus { 1057             &, &:hover, &:focus {
1058                 color: @footer-middle-link_font-color; 1058                 color: @footer-middle-link_font-color;
1059             } 1059             }
1060         } 1060         }
1061     } 1061     }
1062     .footer-bottom { 1062     .footer-bottom {
1063         background-color: @footer-bottom_background-color; 1063         background-color: @footer-bottom_background-color;
1064         padding: 15px 0; 1064         padding: 15px 0;
1065         font-size: .9em; 1065         font-size: .9em;
1066         >.container { 1066         >.container {
1067           display: -webkit-flex; 1067           display: -webkit-flex;
1068           display: flex; 1068           display: flex;
1069           -webkit-align-items: center; 1069           -webkit-align-items: center;
1070           align-items: center; 1070           align-items: center;
1071           justify-content: space-between; 1071           justify-content: space-between;
1072           flex-wrap: wrap; 1072           flex-wrap: wrap;
1073         } 1073         }
1074         .widget { 1074         .widget {
1075           display: inline-block; 1075           display: inline-block;
1076           margin: 0; 1076           margin: 0;
1077         } 1077         }
1078         .logo { 1078         .logo {
1079             margin: 0; 1079             margin: 0;
1080             margin-left: 45px; 1080             margin-left: 45px;
1081             float: right; 1081             float: right;
1082         } 1082         }
1083         .custom-block { 1083         .custom-block {
1084             float: right; 1084             float: right;
1085             line-height: 1; 1085             line-height: 1;
1086             margin: 3px 0; 1086             margin: 3px 0;
1087             img { 1087             img {
1088                 display: inline-block; 1088                 display: inline-block;
1089                 vertical-align: middle; 1089                 vertical-align: middle;
1090             } 1090             }
1091         } 1091         }
1092         address { 1092         address {
1093           order: 1; 1093           order: 1;
1094           padding: 10px 8px 10px 0; 1094           padding: 10px 8px 10px 0;
1095           text-align: right; 1095           text-align: right;
1096           margin-right: auto; 1096           margin-right: auto;
1097           flex: auto; 1097           flex: auto;
1098         } 1098         }
1099         .custom-block { 1099         .custom-block {
1100             &.f-right { 1100             &.f-right {
1101               margin: 0;order: 2; 1101               margin: 0;order: 2;
1102               padding: 10px 8px 10px 0; 1102               padding: 10px 8px 10px 0;
1103               text-align: left; 1103               text-align: left;
1104               flex: auto; 1104               flex: auto;
1105             } 1105             }
1106         } 1106         }
1107         .switcher { 1107         .switcher {
1108             line-height: 1 !important; 1108             line-height: 1 !important;
1109             display: block; 1109             display: block;
1110             height: auto; 1110             height: auto;
1111             margin-top: 15px; 1111             margin-top: 15px;
1112             float: right; 1112             float: right;
1113  1113 
1114             label { 1114             label {
1115                 display: none; 1115                 display: none;
1116             } 1116             }
1117             select { 1117             select {
1118                 display: inline-block; 1118                 display: inline-block;
1119                 width: auto; 1119                 width: auto;
1120                 line-height: 1; 1120                 line-height: 1;
1121             } 1121             }
1122         } 1122         }
1123     } 1123     }
1124     .footer-ribbon { 1124     .footer-ribbon {
1125         background-color: @footer-ribbon_background-color; 1125         background-color: @footer-ribbon_background-color;
1126         position: absolute; 1126         position: absolute;
1127         top: 0; 1127         top: 0;
1128         margin: -16px 0 0; 1128         margin: -16px 0 0;
1129         padding: 10px 20px 6px; 1129         padding: 10px 20px 6px;
1130         color: #fff; 1130         color: #fff;
1131         font-size: 1.6em; 1131         font-size: 1.6em;
1132         z-index: 4; 1132         z-index: 4;
1133         span { 1133         span {
1134             color: @footer-ribbon_font-color; 1134             color: @footer-ribbon_font-color;
1135             font-family: "Shadows Into Light",cursive; 1135             font-family: "Shadows Into Light",cursive;
1136             line-height: 1; 1136             line-height: 1;
1137         } 1137         }
1138         &:before { 1138         &:before {
1139           content: ""; 1139           content: "";
1140           display: block; 1140           display: block;
1141           height: 0; 1141           height: 0;
1142           position: absolute; 1142           position: absolute;
1143           top: 0; 1143           top: 0;
1144           width: 7px; 1144           width: 7px;
1145           left: 100%; 1145           left: 100%;
1146           border-left: 10px solid #646464; 1146           border-left: 10px solid #646464;
1147           border-top: 16px solid transparent; 1147           border-top: 16px solid transparent;
1148         } 1148         }
1149     } 1149     }
1150  1150 
1151     /*** About US ***/ 1151     /*** About US ***/
1152     h2.word-rotator-title { 1152     h2.word-rotator-title {
1153         line-height: 30px; 1153         line-height: 30px;
1154         font-size: 20px; 1154         font-size: 20px;
1155         font-weight: 300; 1155         font-weight: 300;
1156         margin: 0 0 20px 0; 1156         margin: 0 0 20px 0;
1157         color: #121214; 1157         color: #121214;
1158     } 1158     }
1159     .word-rotate { 1159     .word-rotate {
1160         visibility: hidden; 1160         visibility: hidden;
1161         width: 100px; 1161         width: 100px;
1162         height: 0; 1162         height: 0;
1163         margin-bottom: -7px; 1163         margin-bottom: -7px;
1164         display: inline-block; 1164         display: inline-block;
1165         overflow: hidden; 1165         overflow: hidden;
1166         text-align: center; 1166         text-align: center;
1167         position: relative; 1167         position: relative;
1168  1168 
1169         h2 & { 1169         h2 & {
1170             margin-bottom: -7px 1170             margin-bottom: -7px
1171         } 1171         }
1172         &.active { 1172         &.active {
1173             visibility: visible; 1173             visibility: visible;
1174             width: auto; 1174             width: auto;
1175         } 1175         }
1176         .word-rotate-items { 1176         .word-rotate-items {
1177             position: relative; 1177             position: relative;
1178             top: 0; 1178             top: 0;
1179             width: 100%; 1179             width: 100%;
1180  1180 
1181             span { 1181             span {
1182                 display: block; 1182                 display: block;
1183                 white-space: nowrap; 1183                 white-space: nowrap;
1184             } 1184             }
1185         } 1185         }
1186     } 1186     }
1187     p .alternative-font { 1187     p .alternative-font {
1188         display: inline-block; 1188         display: inline-block;
1189         margin-top: -15px; 1189         margin-top: -15px;
1190         position: relative; 1190         position: relative;
1191         top: 3px; 1191         top: 3px;
1192         margin-bottom: -6px; 1192         margin-bottom: -6px;
1193         color: @theme-color; 1193         color: @theme-color;
1194         font-family: "Shadows Into Light",cursive; 1194         font-family: "Shadows Into Light",cursive;
1195         font-size: 1.6em; 1195         font-size: 1.6em;
1196     } 1196     }
1197     .btn-primary { 1197     .btn-primary {
1198         color: #fff; 1198         color: #fff;
1199         text-shadow: 0 -1px 0 rgba(0,0,0,.25); 1199         text-shadow: 0 -1px 0 rgba(0,0,0,.25);
1200         background-color: @button-primary__background; 1200         background-color: @button-primary__background;
1201         border-color: @button-primary__background; 1201         border-color: @button-primary__background;
1202  1202 
1203         &:hover { 1203         &:hover {
1204             color: #fff; 1204             color: #fff;
1205             opacity: 0.85; 1205             opacity: 0.85;
1206         } 1206         }
1207     } 1207     }
1208     .btn { 1208     .btn {
1209         display: inline-block; 1209         display: inline-block;
1210         margin-bottom: 0; 1210         margin-bottom: 0;
1211         font-weight: normal; 1211         font-weight: normal;
1212         text-align: center; 1212         text-align: center;
1213         vertical-align: middle; 1213         vertical-align: middle;
1214         cursor: pointer; 1214         cursor: pointer;
1215         background-image: none; 1215         background-image: none;
1216         border: 1px solid transparent; 1216         border: 1px solid transparent;
1217         white-space: nowrap; 1217         white-space: nowrap;
1218         padding: 6px 12px; 1218         padding: 6px 12px;
1219         font-size: 14px; 1219         font-size: 14px;
1220         line-height: 1.42857143; 1220         line-height: 1.42857143;
1221         border-radius: 4px; 1221         border-radius: 4px;
1222  1222 
1223         &:hover { 1223         &:hover {
1224             text-decoration: none; 1224             text-decoration: none;
1225         } 1225         }
1226  1226 
1227         &-lg { 1227         &-lg {
1228             padding: 10px 16px; 1228             padding: 10px 16px;
1229             font-size: 18px; 1229             font-size: 18px;
1230             line-height: 1.33; 1230             line-height: 1.33;
1231             border-radius: 6px; 1231             border-radius: 6px;
1232         } 1232         }
1233     } 1233     }
1234     .push-top { 1234     .push-top {
1235         margin-top: 20px; 1235         margin-top: 20px;
1236     } 1236     }
1237     hr.tall { 1237     hr.tall {
1238         margin: 30px 0; 1238         margin: 30px 0;
1239         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1239         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
1240         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1240         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
1241         border: 0; 1241         border: 0;
1242         height: 1px; 1242         height: 1px;
1243     } 1243     }
1244     .entry-content { 1244     .entry-content {
1245         h3 { 1245         h3 {
1246             font-size: 1.7em; 1246             font-size: 1.7em;
1247             font-weight: normal; 1247             font-weight: normal;
1248             color: @theme-color; 1248             color: @theme-color;
1249             letter-spacing: normal; 1249             letter-spacing: normal;
1250             line-height: 24px; 1250             line-height: 24px;
1251             margin-bottom: 33px; 1251             margin-bottom: 33px;
1252             text-transform: uppercase; 1252             text-transform: uppercase;
1253         } 1253         }
1254         p { 1254         p {
1255             font-size: 14px; 1255             font-size: 14px;
1256             line-height: 24px; 1256             line-height: 24px;
1257             margin-bottom: 20px; 1257             margin-bottom: 20px;
1258         } 1258         }
1259         .lead { 1259         .lead {
1260             font-size: 21px; 1260             font-size: 21px;
1261             line-height: 1.4; 1261             line-height: 1.4;
1262         } 1262         }
1263     } 1263     }
1264     .history { 1264     .history {
1265         margin: 25px 0; 1265         margin: 25px 0;
1266         padding: 0; 1266         padding: 0;
1267         clear: both; 1267         clear: both;
1268  1268 
1269         .thumb { 1269         .thumb {
1270             background: transparent url(../images/history-thumb.png) no-repeat 0 0; 1270             background: transparent url(../images/history-thumb.png) no-repeat 0 0;
1271             width: 227px; 1271             width: 227px;
1272             height: 160px; 1272             height: 160px;
1273             margin: 0 0 30px; 1273             margin: 0 0 30px;
1274             padding: 0; 1274             padding: 0;
1275             float: right; 1275             float: right;
1276  1276 
1277             img { 1277             img {
1278                 border-radius: 50%; 1278                 border-radius: 50%;
1279                 margin: 7px 8px; 1279                 margin: 7px 8px;
1280                 width: 145px; 1280                 width: 145px;
1281                 height: 145px; 1281                 height: 145px;
1282             } 1282             }
1283         } 1283         }
1284         h4 { 1284         h4 {
1285             float: right; 1285             float: right;
1286             margin: 15px 0; 1286             margin: 15px 0;
1287             padding: 0; 1287             padding: 0;
1288             color: @theme-color; 1288             color: @theme-color;
1289             line-height: 27px; 1289             line-height: 27px;
1290         } 1290         }
1291         p { 1291         p {
1292             margin: 0; 1292             margin: 0;
1293             margin-right: 55px; 1293             margin-right: 55px;
1294             line-height: 24px; 1294             line-height: 24px;
1295         } 1295         }
1296     } 1296     }
1297     .featured-box { 1297     .featured-box {
1298         background: #f5f5f5; 1298         background: #f5f5f5;
1299         background-color: transparent; 1299         background-color: transparent;
1300         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent; 1300         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent;
1301         box-sizing: border-box; 1301         box-sizing: border-box;
1302         border-bottom: 1px solid #DFDFDF; 1302         border-bottom: 1px solid #DFDFDF;
1303         border-left: 1px solid #ECECEC; 1303         border-left: 1px solid #ECECEC;
1304         border-radius: 8px; 1304         border-radius: 8px;
1305         border-right: 1px solid #ECECEC; 1305         border-right: 1px solid #ECECEC;
1306         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04); 1306         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04);
1307         margin-bottom: 20px; 1307         margin-bottom: 20px;
1308         margin-left: auto; 1308         margin-left: auto;
1309         margin-right: auto; 1309         margin-right: auto;
1310         margin-top: 20px; 1310         margin-top: 20px;
1311         min-height: 100px; 1311         min-height: 100px;
1312         position: relative; 1312         position: relative;
1313         text-align: center; 1313         text-align: center;
1314         z-index: 1; 1314         z-index: 1;
1315  1315 
1316         .box-content { 1316         .box-content {
1317             border-radius: 8px; 1317             border-radius: 8px;
1318             border-top: 4px solid @theme-color; 1318             border-top: 4px solid @theme-color;
1319             padding: 30px 20px; 1319             padding: 30px 20px;
1320         } 1320         }
1321         h4 { 1321         h4 {
1322             font-size: 1.3em; 1322             font-size: 1.3em;
1323             font-weight: 400; 1323             font-weight: 400;
1324             letter-spacing: -0.7px; 1324             letter-spacing: -0.7px;
1325             text-transform: uppercase; 1325             text-transform: uppercase;
1326         } 1326         }
1327         .block-flickr-photos { 1327         .block-flickr-photos {
1328             border: 0; 1328             border: 0;
1329  1329 
1330             .block-title { 1330             .block-title {
1331                 display: none; 1331                 display: none;
1332             } 1332             }
1333             a.flickr-image { 1333             a.flickr-image {
1334                 margin: 5px; 1334                 margin: 5px;
1335                 display: inline-block; 1335                 display: inline-block;
1336                 border: 1px solid #dcdcdc; 1336                 border: 1px solid #dcdcdc;
1337                 padding: 5px; 1337                 padding: 5px;
1338                 border-radius: 5px; 1338                 border-radius: 5px;
1339  1339 
1340                 img { 1340                 img {
1341                     max-width: 100%; 1341                     max-width: 100%;
1342                     width: 75px; 1342                     width: 75px;
1343                 } 1343                 }
1344             } 1344             }
1345         } 1345         }
1346     } 1346     }
1347     .history .featured-box { 1347     .history .featured-box {
1348         text-align: right; 1348         text-align: right;
1349         margin-right: 225px; 1349         margin-right: 225px;
1350         margin-bottom: 35px; 1350         margin-bottom: 35px;
1351         min-height: 115px; 1351         min-height: 115px;
1352  1352 
1353         .box-content { 1353         .box-content {
1354             border-top-color: @theme-color; 1354             border-top-color: @theme-color;
1355         } 1355         }
1356     } 1356     }
1357     #newsletter_popup { 1357     #newsletter_popup {
1358         background: #ffffff url(../images/shop_newsletter_popup.jpg) no-repeat; 1358         background: #ffffff url(../images/shop_newsletter_popup.jpg) no-repeat;
1359         box-shadow: 0 0 50px rgba(0, 0, 0, .12); 1359         box-shadow: 0 0 50px rgba(0, 0, 0, .12);
1360         background-position: center; 1360         background-position: center;
1361         background-size: cover; 1361         background-size: cover;
1362         padding: 4rem 2.5rem; 1362         padding: 4rem 2.5rem;
1363         margin: 0; 1363         margin: 0;
1364         width: 740px; 1364         width: 740px;
1365         min-height: 300px; 1365         min-height: 300px;
1366         text-align: right; 1366         text-align: right;
1367         position: relative; 1367         position: relative;
1368         .text_left { 1368         .text_left {
1369           img { 1369           img {
1370             max-width: 111px; 1370             max-width: 111px;
1371             display: block; 1371             display: block;
1372           } 1372           }
1373         } 1373         }
1374         form.subscribe {display: flex;align-items: center;} 1374         form.subscribe {display: flex;align-items: center;}
1375         .field {flex: 1;} 1375         .field {flex: 1;}
1376         .field,.actions {margin-bottom: 20px;} 1376         .field,.actions {margin-bottom: 20px;}
1377         input[type="email"] { 1377         input[type="email"] {
1378           height: 3rem; 1378           height: 3rem;
1379           border: none; 1379           border: none;
1380           border-radius: 0 1.5rem 1.5rem 0; 1380           border-radius: 0 1.5rem 1.5rem 0;
1381           background: #f4f4f4; 1381           background: #f4f4f4;
1382           box-shadow: none !important; 1382           box-shadow: none !important;
1383           padding-right: 1.375rem; 1383           padding-right: 1.375rem;
1384         } 1384         }
1385         .action.primary { 1385         .action.primary {
1386             height: 3rem; 1386             height: 3rem;
1387             padding-left: 2rem; 1387             padding-left: 2rem;
1388             padding-right: 1.5rem; 1388             padding-right: 1.5rem;
1389             border-radius: 1.5rem 0 0 1.5rem; 1389             border-radius: 1.5rem 0 0 1.5rem;
1390             box-shadow: none !important; 1390             box-shadow: none !important;
1391             margin-left: .5rem; 1391             margin-left: .5rem;
1392             font-weight: 700; 1392             font-weight: 700;
1393         } 1393         }
1394         label.checkbox { 1394         label.checkbox {
1395             display: inline-block; 1395             display: inline-block;
1396             margin-top: 0; 1396             margin-top: 0;
1397             margin-bottom: 0; 1397             margin-bottom: 0;
1398             margin-left: 5px; 1398             margin-left: 5px;
1399         } 1399         }
1400         .checkbox { 1400         .checkbox {
1401             font-size: .75rem; 1401             font-size: .75rem;
1402             input[type="checkbox"] { 1402             input[type="checkbox"] {
1403                 -webkit-appearance: none; 1403                 -webkit-appearance: none;
1404                 -moz-appearance: none; 1404                 -moz-appearance: none;
1405                 border: 1px solid #ccc; 1405                 border: 1px solid #ccc;
1406                 width: 1.25rem; 1406                 width: 1.25rem;
1407                 height: 1.25rem; 1407                 height: 1.25rem;
1408                 margin-top: -.1rem; 1408                 margin-top: -.1rem;
1409                 margin-left: 1px; 1409                 margin-left: 1px;
1410                 margin-right: 5px; 1410                 margin-right: 5px;
1411                 vertical-align: middle; 1411                 vertical-align: middle;
1412                 outline: none; 1412                 outline: none;
1413                 border-radius: 3px; 1413                 border-radius: 3px;
1414                 color: #555; 1414                 color: #555;
1415                 top: 0; 1415                 top: 0;
1416                 &:checked:before { 1416                 &:checked:before {
1417                   content: "\e8c5"; 1417                   content: "\e8c5";
1418                   font-family: 'porto-icons'; 1418                   font-family: 'porto-icons';
1419                   font-weight: 900; 1419                   font-weight: 900;
1420                   margin: 0; 1420                   margin: 0;
1421                   width: 1.15rem; 1421                   width: 1.15rem;
1422                   height: 1.2rem; 1422                   height: 1.2rem;
1423                   line-height: 1.2rem; 1423                   line-height: 1.2rem;
1424                   float: left; 1424                   float: left;
1425                   font-size: 11px; 1425                   font-size: 11px;
1426                   text-align: center; 1426                   text-align: center;
1427                 } 1427                 }
1428             } 1428             }
1429         } 1429         }
1430         div.mage-error[generated] { 1430         div.mage-error[generated] {
1431           position: absolute; 1431           position: absolute;
1432           margin-top: 40px; 1432           margin-top: 40px;
1433           font-size: .87em; 1433           font-size: .87em;
1434         } 1434         }
1435     } 1435     }
1436 } 1436 }
1437  1437 
1438 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) { 1438 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
1439     .footer-bottom { 1439     .footer-bottom {
1440         & > .container > * { 1440         & > .container > * {
1441             float: none !important; 1441             float: none !important;
1442             line-height: 35px !important; 1442             line-height: 35px !important;
1443         } 1443         }
1444     } 1444     }
1445     .history { 1445     .history {
1446         .featured-box { 1446         .featured-box {
1447             margin-right: 0; 1447             margin-right: 0;
1448         } 1448         }
1449         .thumb { 1449         .thumb {
1450             display: none; 1450             display: none;
1451         } 1451         }
1452     } 1452     }
1453 } 1453 }
1454 @media (min-width: 768px) { 1454 @media (min-width: 768px) {
1455   .onepage-category{ 1455   .onepage-category{
1456     >.category-list{ 1456     >.category-list{
1457       >ul{ 1457       >ul{
1458         >li{ 1458         >li{
1459           margin-bottom: 1rem; 1459           margin-bottom: 1rem;
1460         } 1460         }
1461       } 1461       }
1462     } 1462     }
1463   } 1463   }
1464   .pt_row-o-full-height>.container>.row, .pt_row-o-equal-height>.container>.row>.pt_column_container>.pt_column-inner { 1464   .pt_row-o-full-height>.container>.row, .pt_row-o-equal-height>.container>.row>.pt_column_container>.pt_column-inner {
1465     height: 100%; 1465     height: 100%;
1466   } 1466   }
1467   .footer .footer-top .widget { 1467   .footer .footer-top .widget {
1468       margin: 0; 1468       margin: 0;
1469   } 1469   }
1470 } 1470 }
1471 @media(max-width:1199px){ 1471 @media(max-width:1199px){
1472   .onepage-cat.category-list+.main.container{padding:0 50px;} 1472   .onepage-cat.category-list+.main.container{padding:0 50px;}
1473   .onepage-category { 1473   .onepage-category {
1474     .category-detail { 1474     .category-detail {
1475       .menu-popup ul>li> a{font-size:11px;} 1475       .menu-popup ul>li> a{font-size:11px;}
1476       .title-menu>.menu-popup{padding:10px 0;} 1476       .title-menu>.menu-popup{padding:10px 0;}
1477       .title-menu>a{margin-top:46px;} 1477       .title-menu>a{margin-top:46px;}
1478     } 1478     }
1479   } 1479   }
1480 } 1480 }
1481 @media (max-width:991px) { 1481 @media (max-width:991px) {
1482   .footer .footer-bottom >.container {justify-content: flex-end;} 1482   .footer .footer-bottom >.container {justify-content: flex-end;}
1483   .footer .footer-bottom .custom-block.f-right {padding-right: 0;text-align: right;} 1483   .footer .footer-bottom .custom-block.f-right {padding-right: 0;text-align: right;}
1484   .porto-ibanner-layer { 1484   .porto-ibanner-layer {
1485       font-size:.875rem 1485       font-size:.875rem
1486   } 1486   }
1487 } 1487 }
1488 @media (min-width: 768px) and (max-width:991px) { 1488 @media (min-width: 768px) and (max-width:991px) {
1489   .onepage-category{ 1489   .onepage-category{
1490     >.category-list{ 1490     >.category-list{
1491       .nav-open &{position:absolute;} 1491       .nav-open &{position:absolute;}
1492     } 1492     }
1493   } 1493   }
1494 } 1494 }
1495 @media (max-width: 767px) { 1495 @media (max-width: 767px) {
1496   #newsletter_popup { 1496   #newsletter_popup {
1497     width: 100% !important; 1497     width: 100% !important;
    1498     .col-10 {
    1499       flex: 0 0 100%;
    1500       max-width: 100%;
    1501     }
1498   } 1502   }
1499   .porto-ibanner-layer { 1503   .porto-ibanner-layer {
1500       font-size:.8125rem 1504       font-size:.8125rem
1501   } 1505   }
1502   .cms-index-index .onepage-category,.onepage-category{display:block} 1506   .cms-index-index .onepage-category,.onepage-category{display:block}
1503   .onepage-category{ 1507   .onepage-category{
1504     >.category-list{ 1508     >.category-list{
1505       width:auto; 1509       width:auto;
1506       float:none; 1510       float:none;
1507       padding:0; 1511       padding:0;
1508       min-height:0; 1512       min-height:0;
1509       position:static; 1513       position:static;
1510       margin-bottom:20px; 1514       margin-bottom:20px;
1511       >ul{ 1515       >ul{
1512         padding:0; 1516         padding:0;
1513         >li{ 1517         >li{
1514           margin:0; 1518           margin:0;
1515           display:inline-block; 1519           display:inline-block;
1516           >a:after,>a:hover>span{display:none;} 1520           >a:after,>a:hover>span{display:none;}
1517         } 1521         }
1518       } 1522       }
1519     } 1523     }
1520     >.category-details{ 1524     >.category-details{
1521       float:none; 1525       float:none;
1522       width:auto; 1526       width:auto;
1523     } 1527     }
1524     >.category-list>ul{position:static!important;} 1528     >.category-list>ul{position:static!important;}
1525     .category-detail { 1529     .category-detail {
1526       .menu-popup { 1530       .menu-popup {
1527         >ul{ 1531         >ul{
1528           display:block; 1532           display:block;
1529           &.columns5>li{ 1533           &.columns5>li{
1530             width:50%; 1534             width:50%;
1531             padding:10px 15px; 1535             padding:10px 15px;
1532             &:nth-child(5n+1){ 1536             &:nth-child(5n+1){
1533               border-right:1px solid #bebebe; 1537               border-right:1px solid #bebebe;
1534               clear:none; 1538               clear:none;
1535             } 1539             }
1536             &:nth-child(2n+1){ 1540             &:nth-child(2n+1){
1537               border-right:0; 1541               border-right:0;
1538               clear:right; 1542               clear:right;
1539             } 1543             }
1540           } 1544           }
1541         } 1545         }
1542         ul>li> a{font-size:14px;} 1546         ul>li> a{font-size:14px;}
1543       } 1547       }
1544     } 1548     }
1545   } 1549   }
1546 } 1550 }
1547  1551 
1548 @media (max-width: 575px) { 1552 @media (max-width: 575px) {
1549     .porto-ibanner-layer { 1553     .porto-ibanner-layer {
1550         font-size:.75rem 1554         font-size:.75rem
1551     } 1555     }
1552     .onepage-category .category-detail .products-area .category-link{ 1556     .onepage-category .category-detail .products-area .category-link{
1553       margin-right:0; 1557       margin-right:0;
1554       margin-bottom: 25px; 1558       margin-bottom: 25px;
1555       float:none; 1559       float:none;
1556       display:inline-block; 1560       display:inline-block;
1557     } 1561     }
1558 } 1562 }