Make WordPress Themes

source: waste-management/0.2.1/style.css

Last change on this file was 299268, checked in by themedropbox, 5 days ago

New version of Waste Management - 0.2.1

File size: 50.0 KB
Line 
1/*
2Theme Name: Waste Management
3Theme URI: https://www.theclassictemplates.com/products/free-recycle-wordpress-theme
4Author: classictemplate
5Author URI: https://www.theclassictemplates.com/
6Description: The Waste Management Theme is a modern, professional solution designed for businesses, municipalities, and environmental organizations offering waste disposal, recycling, and sustainable waste management services, making it ideal for solid waste management companies, hazardous waste disposal services, e-waste recycling firms, landfill management operations, and eco-friendly initiatives. With a fully responsive and retina-ready layout, it provides seamless browsing across all devices, helping users explore waste collection services, waste reduction strategies, plastic recycling, composting, organic waste disposal, green waste removal, scrap metal recycling, industrial cleanup, medical waste disposal, sustainable packaging solutions, and zero-waste initiatives. Built with SEO-optimized coding, schema markup, and fast page loading speeds, the theme boosts visibility in search results while offering clean navigation, customizable layouts, and integration with the Gutenberg editor for effortless page creation. Pre-designed templates, interactive elements, and high-quality visuals make it easy to highlight services, promote environmental campaigns, and encourage eco-conscious practices. Advanced booking and scheduling features allow users to arrange municipal pickups, commercial recycling, junk removal, dumpster rentals, and industrial cleanup services directly from the website. Social media integration enhances engagement by sharing landfill alternatives, garbage collection tips, and environmental updates, while compatibility with Contact Form 7 streamlines communication and lead generation. Perfect for recycling firms, waste contractors, and sustainability-driven organizations, this theme provides a responsive, user-friendly, and impactful platform to inspire responsible waste management practices.Demo:https://live.theclassictemplates.com/waste-management-pro/
7Version: 0.2.1
8Tested up to: 6.8
9Requires PHP: 5.6
10Requires at least: 5.0
11License: GNU General Public License v2 or later
12License URI: http://www.gnu.org/licenses/gpl-2.0.html
13Text Domain: waste-management
14Tags: blog, portfolio, photography, one-column, two-columns, three-columns, four-columns, grid-layout, left-sidebar, right-sidebar, custom-logo, post-formats, featured-images, full-width-template, custom-colors, editor-style, flexible-header, footer-widgets, wide-blocks, custom-header, translation-ready, custom-background, custom-menu, sticky-post, threaded-comments, rtl-language-support, theme-options
15
16This theme, like WordPress, is licensed under the GPL.
17Use it to make something cool, have fun, and share what you've learned with others.
18
19Waste Management WordPress Theme has been created by classictemplate (theclassictemplates.com), 2025.
20Waste Management WordPress Theme is released under the terms of GNU GPL
21*/
22
23*{
24  margin:0;
25  padding:0;
26  outline:none;
27}
28:root {
29  --first-theme-color: #006940;
30  --second-theme-color: #FDC400;
31} 
32body{
33  margin:0;
34  padding:0;
35  font-size:15px;
36  color: #000000;
37  font-family: "Figtree", sans-serif;
38  -moz-box-sizing:border-box;
39  -webkit-box-sizing:border-box;
40  box-sizing:border-box;
41  overflow-x: hidden !important;
42  overflow-y: scroll !important;
43  background-color: #ffffff;
44}
45img{
46  border:none;
47  margin:0;
48  padding:0;
49  height:auto;
50  max-width:100%;
51}
52a{
53  color: #000000;
54  text-decoration:none;
55  word-wrap: break-word;
56  cursor: pointer;
57}
58a:hover{
59  color:#000000;
60  text-decoration:none;
61}
62ol,ul{
63  margin:0;
64  padding:0;
65}
66.wp-caption,
67.wp-caption-text,
68.sticky,
69.gallery-caption,
70.aligncenter{
71  margin:0;
72  padding:0;
73  max-width:100% !important;
74}
75.sticky{
76  background: #ededed;
77}
78.entry-content ol li,
79.entry-content ul li{
80  margin-left:15px;
81}
82.entry-content a, .contentsecwrap a{
83  text-decoration: underline;
84}
85ul li ul,
86ul li ul li ul,
87ol li ol, ol li ol li ol{
88  margin-left:10px;
89}
90h1,h2,h3,h4,h5,h6{
91  color: #000000;
92  word-wrap: break-word;
93  line-height: 1.1;
94}
95h1{
96  font-size:32px;
97}
98h2{
99  font-size:30px;
100}
101h3{
102  font-size:24px;
103}
104h4{
105  font-size:20px;
106}
107h5{
108  font-size:18px;
109}
110h6{
111  font-size:14px;
112}
113:hover{
114  transition-duration: 0.5s;
115}
116.clear{
117  clear:both;
118}
119.alignnone{
120  width:100% !important;
121}
122img.alignleft, .alignleft{
123  float:left;
124  margin:0 15px 0 0;
125  padding:5px;
126  border:1px solid #cccccc;
127}
128img.alignright, .alignright{
129  float:right;
130  margin:0 0 0 15px;
131  padding:5px;
132  border:1px solid #cccccc;
133}
134.left{
135  float:left;
136}
137.right{
138  float:right;
139}
140#comment-nav-above .nav-previous,
141#comment-nav-below .nav-previous{
142  float:none !important;
143  margin:10px 0;
144}
145h2#reply-title {
146  padding-top: 20px;
147}
148ol.comment-list li{
149  list-style:none;
150  margin-bottom:5px;
151}
152.comment-content p {
153  color: #000000;
154}
155p{
156  color: #000000;
157}
158.woocommerce nav.woocommerce-pagination ul, .single-product.woocommerce div.product div.images .woocommerce-product-gallery__image--placeholder{
159  border: none;
160}
161.woocommerce nav.woocommerce-pagination ul li a{
162  background: var(--second-theme-color);
163  color: #000000;
164  padding: 10px 12px;
165}
166.woocommerce nav.woocommerce-pagination ul li span.current, .woocommerce nav.woocommerce-pagination ul li a:hover{
167  background: var(--first-theme-color);
168  color: #ffffff;
169  padding: 10px 12px;
170}
171.woocommerce nav.woocommerce-pagination ul li .page-numbers{
172  font-weight: 700;
173}
174.woocommerce-page p{
175  color: #000000;
176}
177.wp-block-woocommerce-empty-cart-block .wc-block-grid__product-price del{
178  margin-right: 6px;
179  display: inline-flex;
180}
181.single-product .product_meta{
182  margin-top: 20px;
183}
184.single-product .woocommerce-product-gallery__wrapper img{
185  height: 500px !important;
186  width: 500px !important;
187}
188.boxlayout{
189  width: 1140px;
190  margin: 0 auto;
191  background-color: #fff;
192  position: relative;
193  box-shadow: 0 -8px 8px #8e8e8e;
194}
195.single-post .comment-respond .comment-form-cookies-consent,
196.woocommerce.single-product #reviews .comment-form-cookies-consent{
197  display: flex;
198  gap: 10px;
199  align-items: flex-start;
200}
201.single-post .comment-respond .comment-form-cookies-consent input{
202  margin-top: 5px;
203}
204.single-post .comment-respond .comment-form-cookies-consent label{
205  margin-left: 10px;
206}
207
208/* Wishlist */
209.wishlist_table.mobile{
210  padding-left: 0;
211}
212.wishlist_table.mobile table{
213  width: auto;
214}
215.wishlist_table.mobile li{
216  padding: 15px;
217  border: 1px solid #000000;
218}
219.cart.wishlist_table .additional-info-wrapper{
220  display: flex;
221  align-items: center;
222  justify-content: flex-start;
223  gap: 10px;
224}
225ul.shop_table.cart.wishlist_table.wishlist_view.responsive.mobile{
226  display: grid;
227  grid-template-columns: 2fr 50%;
228  gap: 10px;
229}
230.wishlist_table.images_grid li .item-details table.item-details-table td.label, .wishlist_table.mobile li .item-details table.item-details-table td.label, .wishlist_table.mobile li table.additional-info td.label, 
231.wishlist_table.modern_grid li .item-details table.item-details-table td.label{
232  font-size: 16px !important;
233  font-weight: 500;
234}
235.wishlist_table.mobile li .item-details table.item-details-table td,.wishlist_table.mobile li .additional-info .value{
236  font-size: 14px !important;
237  padding: 0 0 0 10px !important;
238  font-family: "Figtree", sans-serif;
239  vertical-align: middle !important;
240}
241.wishlist_table .product-name a,
242.wishlist_table .product-price,
243.wishlist_table .product-stock-status .wishlist-in-stock{
244  font-size: 18px;
245  font-weight: 700;
246}
247.wishlist_table.mobile li .item-wrapper .product-thumbnail,
248.wishlist_table.mobile li .item-wrapper .item-details{
249  display: block;
250  width: 100%;
251}
252.wishlist_table.mobile li .item-wrapper .item-details .item-details-table .label{
253  padding: 0 !important;
254  width: auto !important;
255}
256.wishlist_table .product-add-to-cart a,
257.wishlist_table.mobile li .additional-info-wrapper .product-add-to-cart{
258  margin-bottom: 0 !important;
259}
260
261/*post formate*/
262.format-gallery .wp-block-gallery, .format-video figure{
263  margin-bottom: 15px;
264}
265/* Text meant only for screen readers. */
266.screen-reader-text {
267  border: 0;
268  clip: rect(1px, 1px, 1px, 1px);
269  clip-path: inset(50%);
270  height: 1px;
271  margin: -1px;
272  overflow: hidden;
273  padding: 0;
274  position: absolute;
275  width: 1px;
276  word-wrap: normal !important;
277}
278.screen-reader-text:focus {
279  background-color: #eee;
280  clip: auto !important;
281  clip-path: none;
282  color: #444;
283  display: block;
284  font-size: 1em;
285  height: auto;
286  left: 5px;
287  line-height: normal;
288  padding: 15px 23px 14px;
289  text-decoration: none;
290  top: 5px;
291  width: auto;
292  z-index: 100000; /* Above WP toolbar. */
293}
294a:focus,input[type='submit']:focus,input[type='search']:focus,textarea:focus,input[type='name']:focus,input[type='email']:focus,.toggle-nav button:focus,a.close-button:focus,#commentform input#email:focus, #commentform input#url:focus,#commentform input#author:focus, #commentform textarea:focus, #commentform input#eazycfc_captcha:focus, .serach_inner button[type="submit"]:focus, .serach_inner input[type="submit"]:focus, .search-outer button.search-close:focus, .serach_inner input[type="submit"]:focus{
295        outline: -webkit-focus-ring-color auto 1px;
296}
297.main-nav ul.sub-menu li a:focus, .main-nav ul ul a:focus, .main-header .header-btn a:focus{
298  border: 2px solid var(--first-theme-color);
299  outline: none;
300}
301.main-nav a:focus, .search-box button:focus{
302  border:2px solid var(--first-theme-color);
303  outline: none;
304}
305input:focus{
306  border:2px solid var(--first-theme-color);
307}
308.textwidget p a,.entry-content p a,.entry-summary a,.widget_block p a,.widget_block h1 a,.widget_block h2 a,.widget_block h3 a,.widget_block h4 a,.widget_block h5 a,.widget_block h6 a{
309  text-decoration: underline !important;
310}
311.comment-content p a, .description p a {
312  text-decoration: underline !important;
313}
314.single-post .entry-content p{
315  color: #000000;
316}
317/* = wide block css
318-------------------------------------- */
319.single-post .alignfull, .single-post .alignwide {
320  margin-left: 0 !important;
321  margin-right: 0 !important;
322}
323/*block css*/
324.site-main .alignfull, .site-main .alignwide{
325  margin-left: 0 !important;
326  margin-right: 0 !important;
327  margin-bottom: 20px;
328}
329.site-main .alignfull img{
330  width: 100% !important
331}
332.site-main .alignnone, .site-main .aligncenter{
333  width: auto !important;
334}
335.site-main .alignleft{
336  margin-right: 10px;
337}
338.postsec-list .wp-block-button a:hover, .site-main .wp-block-button a:hover,
339.site-main .wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):hover,
340.postsec-list .wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):hover{
341  background: var(--first-theme-color) !important;
342  color: #ffffff !important;
343}
344.postsec-list .wp-block-button.is-style-squared a, .site-main .wp-block-button.is-style-squared a{
345  border-radius: 0px !important;
346}
347.postsec-list .wp-block-button__link, .site-main .wp-block-button__link{
348  background: var(--second-theme-color);
349  color:#111 !important;
350  border-radius: 30px;
351  font-weight: 500 !important;
352}
353.postsec-list .wp-block-button.is-style-outline a{
354  background:none;
355  border:1px solid var(--first-theme-color);
356  color: #fff !important;
357}
358.site-main .wp-block-button.is-style-outline a{
359  background: #0000;
360  color: #000000 !important;
361  outline: none !important;
362}
363.site-main img.alignleft, .site-main .alignleft, .site-main img.alignright, .site-main .alignright,
364.postsec-list img.alignleft, .postsec-list .alignleft, .postsec-list img.alignright, .postsec-list .alignright{
365  border:none;
366}
367.tags a {
368  text-decoration: none!important;
369  font-weight: 400;
370  color: #ffffff !important;
371  background: var(--second-theme-color);
372  box-shadow: 0 1px 0 rgb(0 0 0 / 8%);
373  text-shadow: none;
374  line-height: 3.5;
375  padding: 8px;
376  margin: 5px;
377  border-radius: 5px;
378  font-size: 15px;
379}
380.tags a:hover{
381  background-color: #000000;
382  color: #fff !important;
383}
384
385/*-----------------Search pop up----------------*/
386.page-template-template-home-page .serach_inner{
387  min-height: 150px;
388}
389.serach_inner{
390  background: var(--first-theme-color);
391  max-height: 150px;
392  display: flex;
393  justify-content: center;
394  position: relative;
395  box-shadow: 0px 0px 12px #c0bebe;
396  transition: 1s height ease-in-out;
397}
398.search-close {
399  position: absolute;
400  top: 0;
401  font-size: 40px;
402  z-index: 9999;
403  right: 50%;
404  color: #fff;
405  background: none;
406  border:none;
407  cursor: pointer;
408  transition: 0.5s height ease-in-out;
409}
410.serach_inner form.search-form, .serach_inner form.woocommerce-product-search {
411  width: calc(100% - 30px);
412  color: #fff;
413  border: none;
414  position: absolute;
415  bottom: 20px;
416  display: flex;
417  padding: 0;
418  border-radius: 0;
419  background: #ffffff;
420  max-width: 1200px;
421  text-align: left;
422  border-radius: 4px;
423}
424.serach_inner form.search-form label {
425  width: 95%;
426}
427.serach_inner input.search-field {
428  padding: 10px;
429  font-size: 20px;
430  font-weight: 500;
431  color: #112b38;
432  max-height: 1200px;
433  border: 0;
434  width: 100%;
435}
436.serach_inner input.search-submit {
437  padding: 8px 35px;
438  margin: 5px 0;
439  font-size: 20px;
440}
441.search-box button{
442  background: transparent;
443  border: 0;
444}
445.search-outer {
446  position: fixed;
447  top: 0;
448  left: 0;
449  width: 100%;
450  padding: 0;
451  visibility: hidden;
452  text-align: center;
453  height: 100%;
454  transition: 1s height ease-in-out;
455  z-index: 999;
456}
457body.search-focus .search-outer{
458  visibility: visible;
459  transition: 1s height ease-in-out;
460}
461body.admin-bar .search-close{
462  top: 34px;
463}
464button.search-submit {
465 border: 0;
466 background: transparent;
467}
468input.search-field {
469 border: 1px solid #000000;
470 padding: 4px 0;
471 background: transparent;
472 width: 95%;
473}
474.search-box button {
475  background: none;
476  border:none;
477}
478.serach_inner button[type="submit"], .serach_inner input[type="submit"]{
479  text-indent: -9999px;
480  z-index: 1;
481  background: url(images/search.png) no-repeat 16px #000000;
482  margin: 0;
483  background-size: 20px;
484  right: 0;
485  width: 60px;
486  height: 100%;
487  border-radius: 4px;
488}
489.modal-content{
490  background: transparent;
491  border: 0;
492}
493.modal-dialog{
494  pointer-events: all;
495}
496.modal-body{
497  padding: 0;
498}
499#myModal, .modal-open {
500  padding: 0 !important;
501}
502.modal-open{
503  overflow-y: scroll;
504}
505body.admin-bar .serach_inner{
506  margin-top: 32px;
507}
508body.admin-bar .closepop{
509  top:30px;
510}
511
512/*scroll to top*/
513#button{
514  background: var(--second-theme-color);
515  color: #000000;
516  cursor: pointer;
517  width: fit-content;
518  padding: 5px;
519  padding-top: 22px;
520  height: 60px;
521  aspect-ratio: 1;
522  text-align: center;
523  position: fixed;
524  border-radius: 50%;
525  bottom: 60px;
526  right: 20px;
527  z-index: 999;
528  -moz-border-radius: 0;
529  font-size: 15px;
530  font-weight: 700;
531  display: none;
532}
533/* = pre loader css
534-------------------------------------- */
535#preloader {
536  position: fixed;
537  top: 0;
538  left: 0;
539  right: 0;
540  bottom: 0;
541  background-color: #fff;
542  z-index: 999999;
543}
544#status {
545  width: 200px;
546  height: 200px;
547  position: absolute;
548  left: 50%;
549  top: 50%;
550  background-image: url(images/status.gif);
551  background-repeat: no-repeat;
552  background-position: center;
553  margin: -100px 0 0 -100px;
554}
555/*logo*/
556h1.site-title, p.site-title{
557  font-size: 30px;
558  margin-bottom: 0;
559  font-weight: 500;
560  color: #000000;
561}
562p.site-title a, h1.site-title a {
563  color: #000000;
564  font-size: 30px;
565  text-transform: capitalize;
566}
567.page-template-template-home-page p.site-title a, .page-template-template-home-page h1.site-title a{
568  color: #000000;
569}
570p.site-title{
571  line-height: 1.3;
572}
573.page-template-template-home-page h1.site-title a:hover, .page-template-template-home-page .logo span.site-description{
574  color: #000000;
575}
576.logo span.site-description{
577  font-size: 13px;
578  font-weight: 500;
579  color:#000000;
580}
581.page-template-template-home-page .logo span.site-description{
582  color: #000000;
583}
584#mySidenav {
585  display: inline;
586}
587.main-nav ul {
588  margin: 0;
589  padding: 0;
590}
591.main-nav li {
592  display: inline-flex;
593  position: relative;
594  align-items: center;
595  padding: 10px 15px;
596}
597.main-nav a {
598  font-size: 14px;
599  display: block;
600  text-transform: capitalize;
601  color: #000000;
602  font-weight: 600;
603  padding: 4px;
604}
605.main-nav .main-menu{
606  text-align: center;
607}
608.main-nav .sub-menu a{
609  color:#111 !important;
610}
611.main-nav li ul li.current_page_item li a{
612  color: #111 !important;
613}
614.main-nav li ul li.current_page_item a{
615  color:#fff !important;
616}
617.main-nav ul ul li.current_page_item a{
618  color: #000000 !important;
619}
620.page-template-template-home-page li.main-nav .current_page_item{
621  color:#111;
622  background-color:var(--first-theme-color);
623}
624.page-template-template-home-page .main-nav .sub-menu .current_page_item a{
625  background:none;
626}
627.main-nav ul.sub-menu .current_page_item a::before,
628.main-nav ul.sub-menu .current-menu-item a::before,
629.main-nav ul ul .menu-item a:before{
630  content: none;
631}
632.main-nav ul ul .menu-item-has-children > a::after{
633  margin-top: 2px;
634}
635.main-nav .menu-item-has-children > a::after {
636  content: '\f107';
637  font-family: 'Font Awesome 7 Free';
638  font-weight: 900; 
639  display: inline-block;
640  width: 0;
641  height: 0;
642  position: absolute;
643  top: auto;
644  bottom: auto;
645  right: auto;
646  margin-left: 3px;
647  margin-top: 3px;
648  transform: translateY(-50%);
649  pointer-events: none;
650  font-size: 12px;
651}
652.main-nav .menu-item-has-children.current-menu-parent > a::after,
653.main-nav .menu-item-has-children.current-menu-ancestor > a::after,
654.main-nav .menu-item-has-children.current_page_parent > a::after {
655  transform: translateY(-50%) rotate(0deg);
656}
657.main-nav ul.sub-menu li a:hover {
658  background-color: var(--second-theme-color) !important;
659}
660.main-nav ul ul {
661  position: absolute;
662  background: #fff;
663  min-width: 250px;
664  z-index: 9999;
665  top: 98%;
666  line-height: 30px;
667  opacity: 0;
668}
669.main-nav ul ul ul {
670  left: 100%;
671  top: 0%;
672}
673.main-nav ul ul a {
674  color: #1f1f1f;
675  border: none;
676  padding: 10px;
677  margin-bottom: 0;
678}
679.main-nav ul ul li {
680  float: none;
681  display: block;
682  text-align: left;
683  border-left: none;
684  border-right: none !important;
685  padding: 0;
686  border-bottom: solid 1px #f1f1f1;
687}
688.main-nav li ul {
689  border-top: 3px solid var(--first-theme-color);
690  box-shadow: 0px 0px 12px -3px rgba(0, 0, 0, 0.4);
691}
692.main-nav .menu > ul > li.highlight {
693  background-color: #006ccc;
694}
695.main-nav .menu > ul > li.highlight:hover {
696  background: transparent;
697}
698.main-nav .menu-item-has-children:not(.off-canvas):hover > .sub-menu,
699.main-nav .menu-item-has-children:not(.off-canvas):focus > .sub-menu,
700.main-nav .menu-item-has-children.is-focused:not(.off-canvas) > .sub-menu,
701.main-nav .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menum,
702.main-nav .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu {
703  opacity: 1;
704}
705.main-nav ul li:hover > ul {
706  opacity: 1;
707}
708.main-nav li.menu-item-has-children:hover > ul,
709.main-nav li.menu-item-has-children:focus > ul,
710.main-nav li.menu-item-has-children.focus > ul {
711  opacity: 1;
712}
713.main-nav .sub-menu {
714  opacity: 0;
715  left: -9999px;
716  z-index: 99999;
717  width: 200px !important;
718}
719.main-nav ul.sub-menu li a {
720  background: #ffffff !important;
721  color: #000 !important;
722}
723ul.sub-menu ul.sub-menu {
724  left: 200px !important;
725}
726.main-nav .menu-item-has-children:not(.off-canvas):hover > .sub-menu,
727.main-nav .menu-item-has-children:not(.off-canvas):focus > .sub-menu,
728.main-nav .menu-item-has-children.is-focused:not(.off-canvas) > .sub-menu,
729.main-nav .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menum,
730.main-nav .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu {
731  display: block;
732  left: 0;
733  margin-top: 0;
734  opacity: 1;
735  width: auto;
736  min-width: 100%;
737}
738ul.sub-menu ul.sub-menu {
739  left: -9999px;
740}
741.toggle-nav,
742a.close-button {
743  display: none;
744}
745/*page css*/
746.page-header {
747  margin-bottom: 20px;
748}
749.page-header h1{
750  color: #000000;
751  margin-bottom: 10px;
752  font-size: 35px;
753  word-wrap: break-word;
754}
755.page-header span, .page-header span a {
756  font-size: 18px;
757  word-wrap: break-word;
758  display: inline;
759  margin-bottom: 10px;
760}
761
762/* Header */
763.main-header{
764  box-shadow: 0px 0px 6px 2px #000000;
765}
766.page-template-template-home-page .main-header{
767  position: absolute;
768  z-index: 2;
769  width: 100%;
770  box-shadow: none;
771}
772.page-template-template-home-page .main-header .header-box{
773  background-color: #ffffff;
774  box-shadow: 0px 3px 6px #00000029;
775  margin-top: 20px;
776}
777.page-template-template-home-page .main-header .header-box:before{
778  content: '';
779  position: absolute;
780  background-color: var(--second-theme-color);
781  height: calc(100% + 40px);
782  width: 100px;
783  top: 50%;
784  transform: translateY(-50%);
785  left: 0;
786  clip-path: polygon(0 0, 0% 100%, 100% 50%);
787}
788.page-template-template-home-page .main-header .header-box:after{
789  content: '';
790  position: absolute;
791  background-color: var(--first-theme-color);
792  height: 100%;
793  width: 100px;
794  top: 0;
795  right: -1px;
796  clip-path: polygon(0 0, 100% 100%, 100% 0);
797  z-index: 0;
798}
799.page-template-template-home-page .main-header .logo,
800.page-template-template-home-page .main-header .header-btn a,
801.main-header{
802  position: relative;
803  z-index: 1;
804}
805.main-header .header-box .top-search{
806  position: relative;
807  z-index: 2;
808}
809
810/* sticky header */
811.page-template-template-home-page .sticky-head .main-header .header-box{
812  box-shadow: none;
813  margin-top: 0;
814}
815.page-template-template-home-page .sticky-head .main-header .header-box:before,
816.page-template-template-home-page .sticky-head .main-header .header-box:after{
817  content: none;
818}
819.sticky-head .main-header{
820  box-shadow: 0px 0px 6px 2px #000000;
821}
822.page-template-template-home-page .main-header .toggle-btn i{
823  color: #757575;
824}
825.page-template-template-home-page .mainhead.sticky-head,.sticky-head {
826  position: fixed;
827  top: 0;
828  left: 0;
829  right: 0;
830  width: 100%; 
831  z-index: 9999;
832}
833.mainhead.sticky-head .main-header{
834  background-color: #ffffff;
835}
836.page-template-template-home-page .mainhead.sticky-head .main-header .toggle-btn i {
837  color: #ffffff;
838}
839.admin-bar .sticky-head{
840  top: 32px !important;
841}
842.page-template-template-home-page .mainhead.sticky-head{
843  top: 0px;
844}
845
846/* Header Image */
847.box-image .single-page-img{
848  position: relative;
849}
850.box-image .single-page-img:after{
851  content: '';
852  position: absolute;
853  height: 400px;
854  width: 100%;
855  background-color: #000000;
856  top: 0;
857  opacity: 0.5;
858}
859.box-image {
860  position: relative;
861}
862.box-image .page-header{
863  position: absolute;
864  bottom: auto;
865  top: 50%;
866  left: 50%;
867  transform: translate(-50%, -50%);
868  text-align: center;
869  margin-bottom: 0;
870  width: 100%;
871}
872.box-image .page-header .woocommerce-breadcrumb , .box-image .page-header .woocommerce-breadcrumb a{
873  color: #ffffff;
874  font-size: 14px;
875}
876.box-image .page-header h2,
877.box-image .page-header h1{
878  color: #fff;
879  text-transform:uppercase;
880}
881.box-image .page-header .breadcrumb{
882  justify-content: center;
883  color: #ffffff;
884  align-items: center;
885}
886.box-image .page-header .breadcrumb a, 
887.box-image .page-header .breadcrumb span{
888  background-color: transparent;
889  margin: 0;
890}
891.box-image .page-header .entry-title span{
892  font-size: 35px;
893}
894
895/* Slider */
896#slider-cat .owl-stage-outer{
897  clip-path: polygon(0 0, 100% 0, 100% 65%, 0% 100%);
898  z-index: 1;
899}
900#slider-cat, #slider-cat .imagebox img, #slider-cat .slider-main-cont{
901  height: 700px;
902}
903#slider-cat .imagebox img{
904  width: 100%;
905  object-fit: cover;
906}
907#slider-cat .imagebox .image-overlay{
908  background-color: #000000;
909  opacity: 0.45;
910  height: 100%;
911  width: 100%;
912  top: 0;
913}
914#slider-cat .slider-main-cont{
915  display: flex;
916  align-items: center;
917}
918#slider-cat .slider-sub-cont{
919  position: relative;
920  z-index: 1;
921}
922#slider-cat .slider-main-cont:after{
923  content: '';
924  position: absolute;
925  background-color: var(--first-theme-color);
926  opacity: 0.3;
927  height: 100%;
928  width: 100%;
929  top: 0;
930}
931#slider-cat .text-content{
932  top: 50%;
933  left: 0;
934  transform: translateY(-50%);
935  width: 100%;
936}
937#slider-cat .text-content .slider-subtitle{
938  color: var(--second-theme-color);
939  font-size: 15px;
940  font-weight: 700;
941}
942#slider-cat .text-content .slider-title a,
943#slider-cat .text-content .slider-phone .phone-text,
944#slider-cat .text-content .slider-phone .phone-no,
945#slider-cat .text-content .slider-content{
946  color: #ffffff;
947}
948#slider-cat .text-content .slider-title a,
949#project-section .project-content .project-title a{
950  overflow: hidden;
951  display: -webkit-box;
952  -webkit-box-orient: vertical;
953  -webkit-line-clamp: 2;
954}
955#slider-cat .text-content .slider-title a{
956  font-size: 40px;
957  font-weight: 700;
958}
959#slider-cat .text-content .sliderbtn .mainbtn a{
960  background-color: var(--second-theme-color);
961  color: #000000;
962  font-size: 14px;
963  padding: 10px 20px;
964  display: inline-block;
965}
966#slider-cat .text-content .sliderbtn .mainbtn a:hover{
967  background-color: #000000;
968  color: #ffffff;
969}
970#slider-cat .text-content .slider-phone i{
971  background-color: var(--first-theme-color);
972  color: var(--second-theme-color);
973  text-shadow: 0px 3px 6px #00000029;
974  height: 35px;
975  width: 35px;
976  border-radius: 50%;
977  display: flex;
978  justify-content: center;
979  align-items: center;
980}
981#slider-cat .text-content .slider-phone .phone-text{
982  font-size: 13px;
983  font-weight: 500;
984}
985#slider-cat .text-content .slider-phone .phone-no{
986  font-size: 17px;
987  font-weight: 700;
988  display: block;
989}
990#slider-cat .main-owl-nav{
991  position: absolute;
992  bottom: 7%;
993  right: 0;
994  height: 30%;
995  width: 30%;
996  filter: drop-shadow(0px 5px 10px #00000029);
997}
998#slider-cat .owl-nav{
999  height: 100%;
1000  width: 100%;
1001  background-color: var(--first-theme-color);
1002  display: flex;
1003  justify-content: flex-end;
1004  align-items: center;
1005  gap: 15px;
1006  padding-right: 15%;
1007  clip-path: polygon(0 32%, 100% 100%, 100% 0);
1008}
1009#slider-cat .owl-nav button{
1010  border: none;
1011  background-color: #ffffff;
1012}
1013#slider-cat .owl-nav button:hover{
1014  background-color: var(--second-theme-color);
1015}
1016#slider-cat .owl-nav button.owl-prev{
1017  clip-path: polygon(0 50%, 100% 100%, 100% 0);
1018}
1019#slider-cat .owl-nav button.owl-next{
1020  clip-path: polygon(100% 50%, 0 100%, 0 0);
1021}
1022
1023/* Project Section */
1024#project-section .blog-bx .project-sec-text{
1025  color: var(--first-theme-color);
1026  font-weight: 600;
1027}
1028#project-section .blog-bx .project-sec-title{
1029  font-size: 30px;
1030  font-weight: 700;
1031}
1032#project-section .project-btn a, .main-header .header-btn a{
1033  background-color: #000000;
1034  color: #ffffff;
1035  font-size: 14px;
1036  font-weight: 500;
1037  padding: 10px 25px;
1038  display: inline-block;
1039}
1040#project-section .project-btn a:hover, .main-header .header-btn a:hover{
1041  background-color: var(--second-theme-color);
1042  color: #000000;
1043}
1044#project-section .project-content .project-img{
1045  height: 250px;
1046  width: 100%;
1047  object-fit: cover;
1048  clip-path: polygon(85% 0, 100% 20%, 100% 100%, 0 100%, 0 0);
1049}
1050#project-section .project-content .project-cont{
1051  filter: drop-shadow(0px 3px 6px #00000029);
1052}
1053#project-section .project-content .project-sub-box{
1054  background-color: #ffffff;
1055  box-shadow: 0px 3px 6px #00000029;
1056  clip-path: polygon(100% 0, 100% 100%, 15% 100%, 0 35%, 0 0);
1057}
1058#project-section .project-content:hover .project-cont{
1059  box-shadow: 0px 3px 6px #00000029;
1060  filter: none;
1061}
1062#project-section .project-content:after{
1063  content: '';
1064  position: absolute;
1065  right: 0;
1066  top: 0;
1067  background-color: var(--first-theme-color);
1068  height: 65px;
1069  width: 65px;
1070  clip-path: polygon(0 0, 100% 100%, 100% 0);
1071  display: none;
1072}
1073#project-section .project-content:before{
1074  content: '';
1075  position: absolute;
1076  left: 0;
1077  bottom: 0;
1078  background-color: var(--second-theme-color);
1079  height: 65px;
1080  width: 65px;
1081  clip-path: polygon(0 0, 0% 100%, 100% 100%);
1082  display: none;
1083}
1084#project-section .project-content:hover:after,
1085#project-section .project-content:hover:before{
1086  display: block;
1087}
1088#project-section .project-content .project-cat li{
1089  list-style: none;
1090  display: inline-block;
1091  position: relative;
1092  padding: 0 6px;
1093}
1094#project-section .project-content .project-cat li:after{
1095  content: ',';
1096  position: absolute;
1097  right: 0;
1098  color: #000000;
1099  font-size: 15px;
1100}
1101#project-section .project-content .project-cat li:last-child:after{
1102  content: none;
1103}
1104#project-section .project-content .project-cat li a{
1105  text-transform: capitalize;
1106  font-size: 14px;
1107  font-weight: 500;
1108}
1109#project-section .project-content .project-title a{
1110  font-size: 20px;
1111  font-weight: 700;
1112}
1113#project-section .project-content:hover .project-title a{
1114  color: var(--first-theme-color);
1115}
1116.single-product .summary button.woosw-btn, .single-product .related.products button.woosw-btn, .woocommerce-shop button.woosw-btn, .woosw-popup-content .add_to_cart_inline .added_to_cart, .woosw-list .woosw-item--actions .added_to_cart, .woosw-list .woosw-copy #woosw_copy_btn{
1117  padding: 7px 15px;
1118  background: var(--second-theme-color);
1119  color: #ffffff;
1120  display: inline-block;
1121  font-size: 14px;
1122  text-transform: capitalize;
1123  border-radius: 4px;
1124  font-weight: 500;
1125  text-align: center;
1126  border: none;
1127}
1128.single-product .summary button.woosw-btn:hover, .single-product .related.products button.woosw-btn:hover, .woocommerce-shop button.woosw-btn:hover, .woosw-popup-content .add_to_cart_inline .added_to_cart:hover, .woosw-list .woosw-item--actions .added_to_cart:hover, .woosw-list .woosw-copy #woosw_copy_btn:hover{
1129  background: #000000;
1130}
1131.woosw-list .woosw-copy #woosw_copy_btn{
1132  margin-left: 10px;
1133}
1134.woosw-list .woosw-copy #woosw_copy_url{
1135  padding: 5px;
1136}
1137.woosw-popup-content .add_to_cart_inline .added_to_cart{
1138  margin-top: 10px;
1139}
1140.woosw-list .woosw-item .woosw-item--actions{
1141  text-align: center;
1142}
1143.woosw-list .woosw-item--actions .added_to_cart{
1144  margin-left: 10px;
1145}
1146.woosw-list .woosw-item .woosw-item--actions a.add_to_cart_button, .woosw-list .woosw-item--actions .added_to_cart{
1147  text-decoration: none !important;
1148}
1149.woosw-list table.woosw-items .woosw-item .woosw-item--name a{
1150  font-size: 20px;
1151  text-decoration: none;
1152}
1153
1154/* = Page lay out css
1155-------------------------------------- */
1156.postsec-list input.search-field,
1157.postsec-list input.search-submit {
1158  padding: 11px 10px;
1159}
1160.postsec-list .search-form input.search-submit, #sidebar form .wp-block-search__button{
1161  background: var(--second-theme-color);
1162  color: #000000;
1163  border: 2px solid var(--second-theme-color);
1164  font-weight: 700;
1165  border-radius: 4px;
1166}
1167.postsec-list .search-form input.search-submit:hover, #sidebar form .wp-block-search__button:hover{
1168  background: var(--first-theme-color);
1169  border-color: var(--first-theme-color);
1170  color: #ffffff;
1171}
1172.contentsecwrap{
1173  padding:35px 0;
1174  clear: both;
1175}
1176.contentsecwrap p{
1177  margin-bottom:20px;
1178}
1179.type-page .entry-content p {
1180  color: #000000;
1181}
1182#sidebar aside.widget{
1183  padding: 20px;
1184  border-radius: 5px;
1185}
1186.listarticle{
1187  border-radius: 5px;
1188}
1189.listarticle h2 a{
1190  color: #000000;
1191  font-size: 30px;
1192  text-decoration: none;
1193  word-wrap: break-word;
1194}
1195.listarticle h2 a:hover{
1196  color: #000000;
1197}
1198.single_title{
1199  margin-bottom: 15px;
1200  font-size: 20px;
1201}
1202.post-thumb{
1203  margin:15px 0;
1204}
1205.nav-links .page-numbers{
1206  background: var(--second-theme-color);
1207  color: #000000 !important;
1208  padding:10px 15px;
1209  text-decoration: none;
1210  font-weight: 700;
1211}
1212span.page-numbers.current, .nav-links .page-numbers:hover{
1213  background: var(--first-theme-color);
1214  color: #ffffff !important;
1215}
1216
1217/* label css
1218---------------------------------------------- */
1219label{
1220  margin-bottom: 0;
1221}
1222#footer .search-form label, #sidebar .search-form label{
1223  width: 100%;
1224}
1225aside.widget ul, .entry-summary li{
1226  list-style:none;
1227}
1228.listarticle .alignfull, .listarticle .alignwide{
1229  margin-left: 0;
1230  margin-right: 0;
1231}
1232#recentcomments li{
1233  background-image:none !important;
1234}
1235#recentcomments li a{
1236  padding-left:0px !important;
1237}
1238.textwidget select,table{
1239  width:100%;
1240}
1241nav.navigation.pagination {
1242    margin: 30px auto;
1243}
1244/*--------------------------------------------------------------
1245## Sidebar Style
1246--------------------------------------------------------------*/
1247#sidebar input[type="text"],
1248#sidebar input[type="search"],
1249#footer input[type="search"]{
1250  border: solid 2px var(--second-theme-color);
1251  padding: 10px;
1252  width: 100%;
1253}
1254#footer input[type="search"],
1255#footer form.search-form .search-field::placeholder{
1256  color: #ffffff;
1257}
1258#sidebar input.search-submit,
1259#footer input.search-submit,
1260form.woocommerce-product-search button {
1261  padding: 10px;
1262  width: 100%;
1263  border:none;
1264  background: var(--second-theme-color);
1265  font-size: 15px;
1266  text-transform: uppercase;
1267  color: #000000;
1268  font-weight: 600;
1269}
1270input.search-submit{
1271  background: var(--second-theme-color);
1272  color: #ffffff;
1273  border:none;
1274  padding: 10px 20px !important;
1275}
1276.widget-area .widget::after,
1277.widget-area .widget::before {
1278  clear: both;
1279  content: "";
1280  display: table;
1281}
1282#sidebar .widget-title, #sidebar h1,#sidebar h2,#sidebar h3,#sidebar h4,#sidebar h5,#sidebar h6, #sidebar form label.wp-block-search__label {
1283  font-size: 28px;
1284  font-weight: 500;
1285  padding-bottom: 10px;
1286  position: relative;
1287  text-align: left;
1288  text-transform: capitalize;
1289  color: #262626;
1290}
1291 .entry-title h2:before{
1292  content: "\f185";
1293  display: inline-block;
1294  font-family: FontAwesome;
1295  margin-right: 5px;
1296}
1297#sidebar ul {
1298  list-style: outside none none;
1299  padding: 0;
1300  margin: 0;
1301}
1302#sidebar ul ul {
1303  border-bottom:none;
1304  padding-bottom: 0;
1305}
1306#sidebar ul li {
1307  padding: 5px;
1308  padding-left: 30px;
1309  padding-top: 5px;
1310  position: relative;
1311  color: #000000;
1312}
1313#sidebar ul li::before {
1314  color: var(--first-theme-color);
1315  content: "\f192";
1316  display: inline-block;
1317  font-family: 'Font Awesome 7 Free';
1318  font-weight: 900;
1319  font-size: 7px;
1320  left: 0;
1321  position: absolute;
1322  top: 12px;
1323  margin-left: 2px;
1324}
1325#sidebar .widget_nav_menu ul li::before{
1326  top: 18px;
1327}
1328#sidebar .widget a,
1329#sidebar .widget a:visited {
1330  color: #000000;
1331  text-decoration: none;
1332}
1333#sidebar .widget a:hover,
1334#sidebar .widget a:active {
1335  color: var(--first-theme-color);
1336}
1337#sidebar .widget {
1338  padding: 20px;
1339  background: #fff;
1340  border-radius: 12px;
1341  box-shadow: 0 0 4px #cfcfcf;
1342  border-bottom: 3px solid var(--first-theme-color);
1343  margin-bottom: 30px;
1344}
1345#sidebar .widget:hover{
1346    box-shadow: 0 0 20px #cfcfcf;
1347}
1348#sidebar .widget_nav_menu ul li{
1349  padding: 3px 15px 5px 20px;
1350}
1351#sidebar .widget_nav_menu ul li a{ 
1352  line-height: 2.5;
1353}
1354/*Clearing floats css*/
1355.page-links {
1356  float: unset !important;
1357  display: inline-flex;
1358  gap: 5px;
1359  align-items: center;
1360  margin:20px auto;
1361}
1362.page-links a, .page-links span{
1363  padding: 10px 15px;
1364  background: var(--second-theme-color);
1365  color: #ffffff;
1366}
1367.page-links .post-page-numbers.current, .page-links a:hover{
1368  background-color: #000000;
1369  color:#fff;
1370}
1371/*calendar widget*/
1372.widget_calendar {
1373  text-align: center;
1374}
1375.widget_calendar h3{
1376  text-align: left;
1377}
1378.widget_calendar caption {
1379  background: var(--first-theme-color) none repeat scroll 0 0;
1380  color: #ffffff;
1381  padding: 5px;
1382}
1383.widget_calendar .pad {
1384  background: #eeeeee none repeat scroll 0 0;
1385}
1386.widget_calendar #today a{
1387  color: #ffffff;
1388}
1389.widget_calendar #today {
1390  background: var(--first-theme-color) none repeat scroll 0 0;
1391  color: #ffffff;
1392}
1393.widget .tagcloud a {
1394  background: var(--second-theme-color);
1395  display: inline-block;
1396  font-size: 16px !important;
1397  line-height: 1.5;
1398  margin-bottom: 5px;
1399  padding: 5px 15px;
1400}
1401.widget .tagcloud a:hover {
1402  background-color: var(--first-theme-color);
1403  color: #ffffff;
1404}
1405.widget_categories li > a,
1406.widget_archive li > a {
1407    display: inline-block;
1408    min-width: 85%;
1409}
1410.search-form .search-submit:focus {
1411    box-shadow: inherit;
1412    outline: none;
1413}
1414dt {
1415    font-weight: bold;
1416}
1417dd {
1418    margin: 0 1.5em 1.5em;
1419}
1420img {
1421    height: auto;
1422    max-width: 100%;
1423}
1424table {
1425    margin: 0 0 1.5em;
1426    width: 100%;
1427}
1428td, th {
1429  border: 1px solid #ddd;
1430  padding: 5px;
1431  color:#252525;
1432}
1433#footer td, #footer th{
1434  color: #fff;
1435}
1436select {
1437  width: 100%;
1438  padding: 5px;
1439}
1440#footer .tagcloud a {
1441  border: solid 1px #fff;
1442  font-size: 14px !important;
1443  margin: 2px 0;
1444  display: inline-block;
1445  color: #fff !important;
1446  padding: 5px 10px;
1447  font-weight: 500;
1448}
1449#footer .tagcloud a:hover{
1450  color: #000000 !important;
1451}
1452.tagcloud a:hover{
1453  background: var(--second-theme-color);
1454  border-color: var(--first-theme-color);
1455  color: #ffffff !important;
1456}
1457/*footer*/
1458#footer ul {
1459  list-style: none;
1460  margin: 0;
1461  padding-left: 0;
1462}
1463#footer ul li {
1464  font-size: 15px;
1465  padding: 3px 15px 3px 13px;
1466  position: relative;
1467  color: #fff;
1468}
1469#footer ul li::before {
1470  color: #fff;
1471  content: "\f105";
1472  display: inline-block;
1473  font-family: 'Font Awesome 7 Free';
1474  font-weight: 900;
1475  font-size: 14px;
1476  left: 0;
1477  position: absolute;
1478  top: 3px;
1479}
1480#footer a .footer-widget-area {
1481  float: left;
1482  padding: 0 25px;
1483  width: 25%;
1484}
1485#footer a,
1486#footer p {
1487  color:#fff;
1488}
1489#footer a:hover, #footer h6 {
1490  color: var(--second-theme-color);
1491}
1492/*--------------------------------------------------------------
1493## Posts and pages
1494--------------------------------------------------------------*/
1495.postsec-list article.hentry,
1496.search-results .postsec-list article{
1497    background: #ffffff none repeat scroll 0 0;
1498    box-shadow: 0 0 4px #cfcfcf;
1499    padding: 30px;
1500    position: relative;
1501    border-radius: 12px;
1502    margin-bottom: 30px;
1503}
1504.postsec-list article.hentry:hover,
1505.search-results .postsec-list article:hover{
1506    box-shadow: 0 0 20px #cfcfcf;
1507}
1508/* = Footer css
1509------------------------------------------- */
1510#footer input.search-submit{
1511  background: var(--second-theme-color);
1512  color: #000000;
1513}
1514#footer{
1515  background-color: var(--first-theme-color);
1516  color: #ffffff;
1517}
1518#footer h1, #footer h2,#footer h3,#footer h4,#footer h5,#footer h6 {
1519  color: #fff;
1520}
1521.ftr-4-box{
1522  width:100%;
1523  float:left;
1524  margin:0 4% 2% 0;
1525  box-sizing:border-box;
1526  padding:20px;
1527}
1528.widget-column-4 {
1529  margin-right:0px !important;
1530}
1531.ftr-4-box h5{
1532  font-size:28px;
1533  color:var(--first-theme-color);
1534  margin-bottom:0;
1535  border-bottom:1px solid #000000;
1536  padding-bottom:20px;
1537}
1538.ftr-4-box h5 span{
1539  font-weight:300;
1540  color: #3dd4e5;
1541}
1542.ftr-4-box ul{
1543  margin:0;
1544  padding:0;
1545  list-style:inside disc;
1546}
1547.ftr-4-box ul li {
1548  display:block;
1549  padding:6px 0;
1550}
1551.ftr-4-box ul li a,.ftr-4-box a.readmore span {
1552  color:#ffffff;
1553}
1554.ftr-4-box p{
1555  margin-bottom:15px;
1556}
1557.copywrap {
1558  font-size: 18px;
1559  padding: 14px 10px !important;
1560  background: var(--second-theme-color);
1561}
1562.copywrap p, .copywrap p a{
1563  color: #000000 !important;
1564  margin-bottom: 0;
1565  font-weight: 500;
1566  font-size: 16px;
1567}
1568#footer .copywrap a:hover{
1569  color:#000000;
1570}
1571.entry-content .tags a{
1572  color: #000000 !important;
1573}
1574.entry-content .tags a:hover{
1575  background-color: var(--first-theme-color);
1576  color: #ffffff !important;
1577}
1578.copywrap .copywrap-info{
1579  display: flex;
1580  flex-wrap: wrap;
1581  justify-content: space-between;
1582  align-items: center;
1583}
1584.copywrap .copywrap-info.center-content {
1585  justify-content: center;
1586  text-align: center;
1587}
1588.footer-social a{
1589  color: #000 !important;
1590}
1591/* Mobile Portrait View */
1592@media screen and (max-width: 1000px){
1593  .main-header{
1594    padding: 10px 0;
1595  }
1596  body.admin-bar.page-template-template-home-page .serach_inner {
1597    margin-top: 32px;
1598  }
1599  body.admin-bar.page-template-template-home-page .search-close{
1600    top: 36px;
1601  }
1602  .main-nav li ul li.current_page_item li a {
1603    color: #ffffff !important;
1604  }
1605  p.site-title a, h1.site-title a{
1606    font-size: 23px;
1607  }
1608  .main-nav ul ul, .main-nav .sub-menu{
1609    opacity: 1;
1610    width: auto;
1611  }
1612  .page-template-template-home-page .main-nav .current_page_item a{
1613    color: var(--first-theme-color);
1614  }
1615  .main-nav .current_page_item a::before{
1616    content: none;
1617  }
1618  .logo span.site-description{
1619    font-size: 12px;
1620  }
1621  .main-nav ul ul li{
1622    margin-bottom: 0;
1623  }
1624  .page-template-template-home-page .main-nav a,.main-nav ul.sub-menu li a{
1625    color: #fff !important;
1626    text-align: center;
1627    padding-left: 0;
1628    background-color: transparent !important;
1629  }
1630  .main-nav ul.sub-menu li a{
1631    padding-left: 0;
1632  }
1633  .page-template-template-home-page .sidenav .main-nav{
1634    background-color: #0000;
1635  }
1636  .main-nav ul{
1637    text-align: left;
1638  }
1639  .main-nav ul.sub-menu li a:focus, .main-nav ul ul a:focus,.main-nav a:focus{
1640    border:2px solid #fff;
1641    outline: none;
1642  }
1643  .main-nav li ul{
1644    border:none;
1645    box-shadow: none;
1646    border-top: none !important;
1647  }
1648  .main-nav .sub-menu li{
1649    border-bottom: none;
1650  }
1651  .toggle-nav button {
1652    font-weight: 600;
1653    border: none;
1654    font-size: 14px;
1655    padding: 8px 25px;
1656    color: #000000;
1657    display: inline-block;
1658    background: var(--second-theme-color);
1659    border-radius: 0;
1660    position: relative;
1661    z-index: 1;
1662  }
1663  .sidenav {
1664    height: 100%;
1665    width: 100%;
1666    position: fixed !important;
1667    z-index: 99999; 
1668    left: 0;
1669    top: -110%;
1670    overflow-x: hidden; 
1671    transition: 0.5s top ease-in-out;
1672    overflow-y: scroll;
1673    background: #000;
1674    visibility: hidden; 
1675    opacity: 0.9;
1676  }
1677  .main-nav ul li a:hover{
1678    color: #fff;
1679  }
1680  .main-nav li {
1681    padding: 0 15px;
1682    display: block;
1683    border-bottom: none;
1684    border-right: none;
1685    height: auto;
1686  }
1687  body.show-main-menu .sidenav{
1688    visibility: visible;
1689    top: 0;
1690    transition: 0.5s top ease-in-out;
1691    background: #000 !important;
1692  }
1693  .sidenav .close-button {
1694    margin-bottom:30px !important;
1695    font-size: 36px; 
1696    display: block !important;
1697    color: #fff; 
1698    padding: 10px !important;
1699    text-align: center;
1700    margin-top: 25px;
1701  }
1702  .sidenav #site-navigation {
1703    width: 100%; 
1704    margin-top: 45px;
1705  }
1706  .toggle-nav span{
1707    font-size:30px; cursor:pointer; text-align: right;
1708  }
1709  .main-nav ul ul li,.menubar .nav ul li{
1710    display: block;
1711    text-align: center !important;
1712  }
1713  .toggle-nav{
1714    display: block;
1715  }
1716  .main-nav li.current_page_item a{
1717    color: #ffffff;
1718  }
1719  .main-nav ul li a{
1720    padding: 8px;
1721    text-decoration: none;
1722    font-size: 15px;
1723    color: #fff;
1724    display: block;
1725    float: none;
1726    margin: 5px 0;
1727    border-right: none; 
1728    text-align: center;
1729  }
1730  .main-nav .menu-item-has-children > a::after{
1731    margin-top: 0;
1732  }
1733  .main-nav ul li ul li a:before{
1734    content:"\00BB \00a0";
1735  }
1736  .main-nav ul.sub-menu a:hover{
1737    color:#000000;
1738  }
1739  .main-nav ul ul{
1740    position: static; width: 100%; background: transparent;border-top-width: 0px; border-bottom-width: 0px;box-shadow: none; }
1741  .main-nav ul ul a{
1742    border-bottom: none; 
1743    padding-left: 40px;
1744  }
1745  .main-nav ul ul li.current_page_item a {
1746    color: #ffffff !important;
1747  }
1748  .main-nav ul ul ul.sub-menu a{
1749    padding-left: 0;
1750  }
1751  #mySidenav {
1752    text-align: left; display: inline;
1753  }
1754  .main-menu {
1755    padding: 0em;
1756    display: flex;
1757    flex-direction: column;
1758    align-items: center;
1759  }
1760  .main-nav ul.sub-menu>li>a:before {
1761    content: unset;
1762  }
1763  .main-nav ul.sub-menu>li>a:hover:before{
1764    opacity: 0;left: 0px;width: 0px;
1765  }
1766  .page-template-template-home-page .main-nav .current_page_item a, .main-nav .current_page_item a, .main-nav .current_page_item a:hover{
1767    background:none;
1768  }
1769}
1770@media screen and (min-width: 768px) and (max-width: 1000px){
1771  .toggle-nav{
1772    margin: 10px 0 5px;
1773  }
1774}
1775@media screen and (max-width: 600px){
1776  .page-template-template-home-page .mainhead.sticky-head, .admin-bar .sticky-head{
1777    top: 0 !important;
1778  }
1779}
1780@media screen and (min-width: 601px) and (max-width: 782px) {
1781  .admin-bar .sticky-head{
1782    top: 44px !important;
1783  }
1784}
1785@media screen and (max-width: 767px) {
1786  .main-header .header-btn a{
1787    padding: 10px 15px;
1788  }
1789  .page-template-template-home-page .main-header{
1790    position: static;
1791  }
1792  .page-template-template-home-page .main-header .header-box:before,
1793  .page-template-template-home-page .main-header .header-box:after,
1794  #slider-cat .slider-main-cont:after{
1795    content: none;
1796  }
1797  .page-template-template-home-page .main-header .header-box{
1798    box-shadow: none;
1799  }
1800  .page-template-template-home-page .main-header .header-box{
1801    margin-top: 0;
1802  }
1803  #slider-cat .owl-stage-outer, #slider-cat .owl-nav {
1804    clip-path: none;
1805  }
1806  #slider-cat .owl-nav{
1807    background-color: transparent;
1808    padding-right: 0;
1809  }
1810  #slider-cat .main-owl-nav{
1811    bottom: 15px;
1812    right: 50%;
1813    transform: translateX(50%);
1814    height: auto;
1815    width: auto;
1816    z-index: 1;
1817  }
1818  #slider-cat .sliderbtn{
1819    flex-direction: column;
1820    gap: 30px !important;
1821  }
1822  #slider-cat .slider-sub-cont, #project-section .blog-bx{
1823    text-align: center;
1824  }
1825  #project-section .project-btn{
1826    text-align: center !important;
1827    margin-top: 15px;
1828  }
1829  #slider-cat .text-content .slider-title a{
1830    -webkit-line-clamp: 3;
1831    font-size: 28px;
1832  }
1833  #slider-cat, #slider-cat .imagebox img, #slider-cat .slider-main-cont {
1834    height: 550px;
1835  }
1836  #project-section .blog-bx .project-sec-title{
1837    font-size: 23px;
1838  }
1839  #project-section .project-content:after, #project-section .project-content:before{
1840    display: block;
1841    height: 80px;
1842    width: 80px;
1843  }
1844  #project-section .project-content .project-sub-box{
1845    clip-path: polygon(100% 0, 100% 100%, 30% 100%, 0 12%, 0 0);
1846  }
1847  #project-section .project-content .project-cont{
1848    filter: none;
1849    box-shadow: 0px 3px 6px #00000029;
1850  }
1851  #project-section .project-content .project-img{
1852    height: 200px;
1853  }
1854  #project-section .project-content .project-title a{
1855    width: 65%;
1856    margin: 0 auto;
1857  }
1858  .wishlist_table .product-add-to-cart a{
1859    padding: 8px 8px !important;
1860  }
1861  #footer .footer-widget{
1862    text-align: center;
1863  }
1864  #footer ul li{
1865    width: 100%;
1866    text-align: center;
1867    margin: 0 auto;
1868    padding: 6px 0;
1869  }
1870  #footer ul li::before{
1871    content: none;
1872  }
1873  .single-product .woocommerce-product-gallery__wrapper img{
1874    width: 100% !important;
1875    height: auto !important;
1876  }
1877  .woocommerce ul.products li{
1878    width: 100% !important;
1879  }
1880  .wpcf7 input[type="text"],
1881  .wpcf7 input[type="tel"],
1882  .wpcf7 input[type="email"],
1883  .wpcf7 textarea {
1884    width: 100%;
1885  }
1886  .ftr-4-box{
1887    width: 100%;
1888  }
1889  .boxlayout{
1890    width: 270px;
1891  }
1892  .admin-bar .page-template-template-home-page .header.sticky-head, .admin-bar .sticky-head{
1893    top:0;
1894  }
1895  .logo, .toggle-nav {
1896   text-align: center !important;
1897  }
1898  .page-template-template-home-page .product-cart .cart-count{
1899    background: var(--second-theme-color);
1900    color: #ffffff;
1901  }
1902  ul.shop_table.cart.wishlist_table.wishlist_view.responsive.mobile{
1903    grid-template-columns: 100%;
1904  }
1905  .sidenav .close-button{
1906    margin-bottom: 20px !important; 
1907  }
1908  .admin-bar .page-template-template-home-page .header.main.sticky-head, .admin-bar .main.sticky-head{
1909    top: 0;
1910  }
1911  tr.wc-block-cart-items__row {
1912    gap: 0.4em;
1913  }
1914  td.wc-block-cart-item__total{
1915    padding-left: 0px !important;
1916  }
1917  li.wc-block-grid__product{
1918    max-width:100% !important;
1919    float:none;
1920  }
1921  .woocommerce-cart .wp-block-woocommerce-empty-cart-block li.wc-block-grid__product{
1922    max-width: 100% !important;
1923    margin: 0 8.8% 2.992em 0;
1924  }
1925  .header.main.sticky-head{
1926    position: static;
1927    box-shadow:none;
1928  }
1929  .header.main.sticky-head{
1930    position: static;
1931    transform: none;
1932  }
1933  #sidebar{
1934    margin-top: 30px;
1935  }
1936  .copywrap .copywrap-info{
1937    justify-content: center;
1938    align-items: center;
1939    flex-wrap: wrap;
1940  }
1941  .copywrap .copywrap-info p,
1942  .copywrap .footer-social {
1943    flex: 1 1 100%; 
1944    justify-content: center;
1945    align-items: center;
1946  }
1947  .copywrap .footer-social{
1948    margin-top: 10px;
1949  }
1950}
1951@media screen and (min-width: 768px) and (max-width: 991px) {
1952  .main-header .header-btn a{
1953    padding: 10px 15px;
1954  }
1955  #slider-cat, #slider-cat .imagebox img, #slider-cat .slider-main-cont{
1956    height: 612px;
1957  }
1958  #slider-cat .text-content .slider-title a{
1959    font-size: 30px;
1960  }
1961  #project-section .blog-bx .project-sec-title{
1962    font-size: 26px;
1963  }
1964  #project-section .project-content:after, #project-section .project-content:before{
1965    display: block;
1966    height: 70px;
1967    width: 70px;
1968  }
1969  #project-section .project-content .project-sub-box{
1970    clip-path: polygon(100% 0, 100% 100%, 20% 100%, 0 16%, 0 0);
1971  }
1972  #project-section .project-content .project-cont{
1973    filter: none;
1974    box-shadow: 0px 3px 6px #00000029;
1975  }
1976  #project-section .project-content .project-title a{
1977    width: 80%;
1978    margin: 0 auto;
1979  }
1980  .woocommerce-cart .wp-block-woocommerce-empty-cart-block li.wc-block-grid__product{
1981    max-width: 50% !important;
1982    margin: 0 1.8% 2.992em 0;
1983  }
1984  p.site-title a, h1.site-title a, h1.site-title, p.site-title {
1985    font-size: 20px;
1986  }
1987  .single-product .woocommerce-product-gallery__wrapper img{
1988    width: 100% !important;
1989    height: auto !important;
1990  }
1991  .is-sticky-on.mobile.sticky-head{
1992    top: 40px;
1993  }
1994  .boxlayout{
1995    width: 650px;
1996  }
1997  .ftr-4-box{
1998    display: inline-grid;
1999    float: none;
2000  }
2001  tr.wc-block-cart-items__row {
2002    gap: 1em;
2003  }
2004  li.wc-block-grid__product{
2005    max-width: 48% !important;
2006    float: left;
2007    clear: both;
2008    margin: 0 1% 2.992em;
2009    flex: 1 0 48% !important;
2010  }
2011  .woocommerce ul.products li.product {
2012    width: 48% !important;
2013    margin: 0 6px 2.992em;
2014  }
2015}
2016@media screen and (min-width: 992px) and (max-width: 1199px) {
2017  .main-header .header-btn a{
2018    padding: 10px 15px;
2019  }
2020  #slider-cat, #slider-cat .imagebox img, #slider-cat .slider-main-cont{
2021    height: 612px;
2022  }
2023  #slider-cat .text-content .slider-title a{
2024    font-size: 35px;
2025  }
2026  #project-section .project-content .project-sub-box{
2027    clip-path: polygon(100% 0, 100% 100%, 30% 100%, 0 35%, 0 0);
2028  }
2029  .main-nav li{
2030    padding: 6px 10px;
2031  }
2032  .woocommerce-cart .wp-block-woocommerce-empty-cart-block li.wc-block-grid__product{
2033    max-width: 21.75% !important;
2034  }
2035  p.site-title a, h1.site-title a, h1.site-title, p.site-title {
2036    font-size: 20px;
2037  }
2038  .main-nav a, .main-nav .menu-item-has-children > a::after{
2039    font-size: 12px;
2040  }
2041  .main-nav .menu-item-has-children > a::after{
2042    margin-top: 2px;
2043  }
2044  .admin-bar .page-template-template-home-page .header.sticky-head, .admin-bar .sticky-head{
2045    top: 32px;
2046  }
2047  .admin-bar .page-template-template-home-page .header.main.sticky-head, .admin-bar .main.sticky-head{
2048    top: 30px;
2049  }
2050  tr.wc-block-cart-items__row {
2051    gap: 1em;
2052  }
2053}
2054@media screen and (min-width: 1200px) and (max-width: 1399px){
2055  .main-header .header-btn a{
2056    padding: 10px 15px;
2057  }
2058  #slider-cat, #slider-cat .imagebox img, #slider-cat .slider-main-cont{
2059    height: 650px;
2060  }
2061  #project-section .project-content .project-sub-box{
2062    clip-path: polygon(100% 0, 100% 100%, 25% 100%, 0 35%, 0 0);
2063  }
2064  p.site-title a, h1.site-title a, h1.site-title, p.site-title {
2065    font-size: 25px;
2066  }
2067}
2068@media screen and (min-width: 1400px){
2069  .single-product.woocommerce-page div.product div.summary{
2070    width: 52%;
2071  }
2072}
2073@media screen and (min-width:1400px) and (max-width:1599px){
2074  #project-section .project-content .project-sub-box{
2075    clip-path: polygon(100% 0, 100% 100%, 20% 100%, 0 20%, 0 0);
2076  }
2077}
2078@media screen and (min-width:1600px) and (max-width:1900px){
2079  .container{
2080    max-width: 1520px;
2081  }
2082}
2083@media screen and (min-width:1920px) {
2084  .container{
2085    max-width: 1620px;
2086  }
2087}
Note: See TracBrowser for help on using the repository browser.