/******************************************************
    Dark Mode Styling
*******************************************************/

/*

[Table of contents]

1. Generic Styling
2. Main Header Styling
3. Staff Picks Section
4. Posts Styling
5. Single Post Page Styling
6. Sidebar/Widgets Styling
7. Contact Form Styling
8. Error Page Styling
9. WooCommerce Styling
10. Footer Styling

*/

/*-------------------------------------------*\
	1. Generic Styling
\*-------------------------------------------*/

body.dark {
    color: #c5c5c5;
    background-color: #222;
}

.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6,
.dark .post-title a,
.dark .entry blockquote p, .dark a {
    color: #fff;
}

.dark blockquote {
    border-left-color: #fff;
    background-image: url(../images/quotation-marks-white.svg);
}

.dark .entry table td,
.dark .entry table th,
.dark .comment table td,
.dark .comment table th,
.dark .wp-block-table.is-style-stripes td,
.dark .wp-block-table.is-style-stripes th {
    border-color: #3c3c3c;
}

.dark .entry table th {
    color: #fff;
}

.dark .entry table td {
    color: #c5c5c5;
}

/*-------------------------------------------*\
	2. Main Header Styling
\*-------------------------------------------*/

.dark .ticker-label {
    color: #222;
    background-color: #fff;
}

.dark .ticker-wrap::before {
    background: linear-gradient(90deg, #222 45%, rgba(255, 255, 255, 0) 100%);
}

.dark .ticker-wrap::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #222 55%);
}

.dark .ticker-post a:hover {
    color: #fff;
}

.dark #header-ticker,
.dark #main-header {
    background-color: #222;
}

.dark #hidden-sidebar-icon span,
.dark #hidden-sidebar-icon span::before,
.dark #hidden-sidebar-icon span::after {
    background-color: #fff;
}

.dark #main-header .wrapper::before, 
.dark #main-header .wrapper::after {
    background: linear-gradient(90deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #343434  49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
}

.dark #main-header-wrap::before {
    background-image: url(../images/menu-shadow-top-dark.svg);
}

.dark #main-header-wrap::after {
    background-image: url(../images/menu-shadow-bottom-dark.svg);
}

/*** Main Nav Styling ***/

.dark #main-nav a,
.home.dark .transparent-header.not-stuck #main-nav ul ul a {
    color: #fff;
}

.dark #main-nav a::after {
    background-color: #fff;
}

.dark #main-nav .menu-item-has-children > a::before {
    background-color: #fff;
    background-image: url(../images/drop-menu-black.svg);
}

.dark #main-nav ul li ul {
    background-color: #222;
    box-shadow: 0px 4px 10px rgb(0 0 0 / 37%);
}

.dark #main-nav ul li ul li::after {
	background: linear-gradient(90deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #343434 49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
}

@media screen and (max-width: 1200px) { 

    .dark #main-nav {
        background-color: #2a2a2a;
    }

    .dark #menu-icon {
        border-color: #323232;
        background-color: #323232;
        background-image: url(../images/menu-icon-white.svg);
    }

    .dark #main-nav li, .dark #main-header.stick-it #main-nav li {
        border-bottom-color: #3a3a3a;
    }

    .dark #main-nav .menu-arrow {
        border-color: #3a3a3a;
    }

    .dark #main-nav ul li ul {
        border-top-color: #3a3a3a;
        background-color: #313131;
        box-shadow: none;
        border-radius: 0;
    }

    .dark #main-nav .menu-arrow::after {
        background-image: url(../images/drop-menu-arrow-white.svg);
    }

    .dark #main-nav ul li ul a, .dark #main-header.stick-it #main-nav ul li ul a {
        color: #fff;
    }

}

/*** Header Elements ***/

.dark .cart-customlocation {
    background: url(../images/cart-customlocation-white.svg) no-repeat;
}

.dark .cart-count-wrap {
    color: #222;
    background-color: #fff;
}

.dark .cart-customlocation:hover .cart-count-wrap {
    color: #fff;
}

.dark .dark-light-icons,
.dark #header-search-icon {
    border-color: #323232;
    background-color: #323232;
}

.dark .dark-light-icons:hover {
    border-color: #444;
}

.dark .dark-light-icons .dark-icon {
    background-image: url(../images/dark-icon-white.svg);
}

.dark #header-search-icon {
    background-image: url(../images/header-search-icon-white.svg);
}

/*** Hidden Sidebar Styling ***/

.dark #hidden-sidebar-wrap {
    background-color: #222;
}

.dark .hidden-sidebar-close {
    background-image: url(../images/hidden-sidebar-close-white.svg);
}

/*** Modal Search Form Styling ***/

.dark #modal-search {
	background-color: rgba(34,34,34,.97);
}

.dark #modal-search #searchform #s {
    color: #fff;
	border-bottom-color: #333;
}

.dark #modal-search #searchform #s:focus {
	border-bottom-color: #444;
}

.dark .m-search-close {
	background-image: url(../images/modal-close-white.svg);
}

.dark .search-info {
	color: #747474;
}

/*-------------------------------------------*\
	3. Staff Picks Section
\*-------------------------------------------*/

.dark .staff-picks {
    background-color: #1a1a1a;
}

.dark .staff-picks .section-heading span {
    color: #1a1a1a;
    background-color: #1a1a1a;
}

.dark .section-heading span {
    color: #222;
    background-color: #222;
    text-shadow: -1px 0 #3C3C3C, 0 1px #3C3C3C, 1px 0 #3C3C3C, 0 -1px #3C3C3C;
}

.dark .section-heading h2 {
    color: #fff;
}

.dark .section-heading::after {
    background: linear-gradient(90deg, rgba(227, 227, 227, 0) 23.5%, #393939 66%, rgba(227, 227, 227, 0) 97.5%);
}

.dark .view-all-link {
    color: #fff;
    border-color: #323232;
    background-color: #222;
}

.dark .view-all-link::after {
	background-image: url(../images/view-all-white.svg);
}

.dark .view-all-link:hover {
    color: #fff;
    border-color: #323232;
    background-color: #323232;
}

/*-------------------------------------------*\
	4. Posts Styling
\*-------------------------------------------*/

.dark .layout-2-feat, .dark .small-feat-home-3 {
    background-color: #262626;
}

.dark .circle-title a, .dark .circle-feat .excerpt {
    background-color: #222;
}

.dark .circle-feat .post-thumb::before {
    background-image: url(../images/feat-post-mask-dark.svg);
}

.dark .circle-feat .post-thumb::after {
    background-image: url(../images/circle-feat-dark.svg);
}

.dark .small-feat-home-3 .small-post.format-audio .post-thumb::before, 
.dark .small-feat-home-3 .small-post.format-video .post-thumb::before, 
.dark .small-feat-home-3 .small-post.format-gallery .post-thumb::before {
    background-image: url(../images/small-post-mask-dark-2.svg);
}

.dark .small-post::before,
.dark .small-feat .small-post:first-child::before,
.dark .small-feat::after,
.dark .small-widget .small-post-outer::after {
    background: linear-gradient(90deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #343434 49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
}

.dark .small-posts .small-post-outer::before {
    color: #545454;
}

.dark .small-content .post-meta::before {
    background-color: #fff;
}

.dark .small-content .post-meta:hover::before {
	opacity: 1;
}

.dark .small-post .post-date::first-letter {
	color: #222;
}

.dark .small-post .post-date:hover {
    color: #fff;
}

.dark .small-post.format-audio .post-thumb::before, 
.dark .small-post.format-video .post-thumb::before, 
.dark .small-post.format-gallery .post-thumb::before {
    background-image: url(../images/small-post-mask-dark.svg);
}

.dark .small-post.format-audio .post-thumb::after {
    background-image: url(../images/audio-format-white.svg);
}

.dark .small-post.format-video .post-thumb::after {
    background-image: url(../images/video-format-white.svg);
}

.dark .small-post.format-gallery .post-thumb::after {
    background-image: url(../images/gallery-format-white.svg);
}

/*** Large Posts Styling ***/

.dark .post-content {
    border-color: #333;
    background-color: #222;
}

.dark .category-highlight {
    background-color: #333;
}

.dark .category-highlight:hover {
	background-color: var(--accent-color);
}

.dark .more-arrow {
    border-color: #333;
    background-image: url(../images/more-arrow-white.svg);
}

.dark .more-arrow:hover {
    border-color: var(--accent-color);
}

.dark .author-meta-outer-wrap::before {
    background: linear-gradient(90deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #333 49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
}

.dark .post-content::after {
    border-bottom-color: #333;
}

.dark .author-meta-wrap .author-name a {
    color: #fff;
}

.dark .author-meta-wrap .author-name a:hover {
    color: var(--accent-color);
}

.dark article.sticky .post-title::before {
	background-image: url(../images/sticky-pin.svg);
}

/*** Pagination Styling ***/

.dark .pagination a {
    color: #222;
}

.dark .pagination a:hover {
    color: #fff;
}

.dark .pagination .current,
.dark .post-nav-links .current {
    background-color: #2c2c2c;
}

/*-------------------------------------------*\
	5. Single Post Page Styling
\*-------------------------------------------*/

.dark .single-header .thumb-meta-links a,
.dark .single-header .thumb-meta-links span,
.dark .single-header .button-share-icons,
.dark .single-share-icons a,
.dark .author-icons a {
    color: #fff;
    border-color: #333;
    background-color: #222;
}

.dark .single-header .thumb-meta-links a:hover,
.dark .single-header .thumb-meta-links span:hover,
.dark .single-share-icons .twitter:hover,
.dark .single-share-icons .facebook:hover,
.dark .single-share-icons .linkedin:hover,
.dark .single-share-icons .reddit:hover,
.dark .single-share-icons .mail-to:hover,
.dark .author-icons a:hover {
    background-color: #333;
}

.dark .single-header .meta-comments {
    background-image: url(../images/meta-comments.svg);
}

.dark .single-header .thumb-share {
    background-image: url(../images/thumb-share.svg);
}

.dark .share-this-txt {
    color: #fff;
}

.dark .single-wrap-left .section-heading h2 {
    background-color: #222;
}

.dark .single-wrap-left .section-heading span {
    color: #545454;
    text-shadow: none;
}

.dark .single-header .button-share-icons .twitter {
    background-image: url(../images/button-share-twitter-white.svg);
}

.dark .single-header .button-share-icons .facebook {
    background-image: url(../images/button-share-facebook-white.svg);
}

.dark .single-header .button-share-icons .mail-to {
    background-image: url(../images/button-share-email-white.svg);
}

.dark .single-header .button-share-icons li::after {
    background-color: #333;
}

.dark .button-share-icons a.social-pop:hover,
.dark .button-share-icons a.mail-to:hover {
    background-color: transparent;
}

.dark .single-share-icons .twitter {
    background-image: url(../images/button-share-twitter-white.svg);
}

.dark .single-share-icons .facebook {
    background-image: url(../images/button-share-facebook-white.svg);
}

.dark .single-share-icons .linkedin {
    background-image: url(../images/share-linkedin-white.svg);
}

.dark .single-share-icons .reddit {
    background-image: url(../images/share-reddit-white.svg);
}

.dark .single-share-icons .mail-to {
    background-image: url(../images/button-share-email-white.svg);
}

.dark .single-share-icons .copy-link-share {
    border-color: #333;
    background-color: #222;
}

.dark .single-share-icons .copy-link-share:hover {
    background-color: #1a1a1a;
}

.dark .copy-link-input {
    color: #fff;
}

.dark .copy-link-button {
    background-color: #303030;
    background-image: url(../images/copy-url-white.svg);
}

.dark .copy-link-button:hover {
    background-color: #3a3a3a;
}

/*** Single Tags Styling ***/

.dark .tagcloud a, .dark .wp-block-tag-cloud a {
    color: #fff;
	background-color: #333;
}

.dark .tagcloud a:hover, .dark .wp-block-tag-cloud a:hover {
    background-color: var(--accent-color);
}

/*** Author Bio Styling ***/

.dark .author-icons .twitter-link {
    background-image: url(../images/tw-author-bio-white.svg);
}

.dark .author-icons .facebook-link {
    background-image: url(../images/fb-author-bio-white.svg);
}

.dark .author-icons .linkedin-link {
    background-image: url(../images/linkedin-author-bio-white.svg);
}

.dark .author-icons .instagram-link {
    background-image: url(../images/insta-author-bio-white.svg);
}

.dark .author-icons .youtube-link {
    background-image: url(../images/yt-author-bio-white.svg);
}

.dark .author-icons .author-link {
    background-image: url(../images/link-author-bio-white.svg);
}

/*** Next / Previous Posts ***/

.dark .next-prev-posts::before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    margin-bottom: 40px;
    background: linear-gradient(90deg, rgba(227, 227, 227, 0) 0%, #393939 50%, rgba(227, 227, 227, 0) 100%);
}

.dark .small-nav-post .post-date:hover {
    color: #fff;
}

.dark .small-nav-post .post-date::first-letter {
	color: #222;
}

.dark .nav-post-arrow {
    border-color: #333;
    background-color: #222;
    background-image: url(../images/prev-post-arrow-white.svg);
}

.dark .small-nav-post + .small-nav-post .nav-post-arrow {
    background-image: url(../images/next-post-arrow-white.svg);
}

.dark .nav-post-arrow:hover {
    background-color: #333;
}

/*** Comments Section Styling ***/

.dark #respond .section-heading::after {
    background: linear-gradient(90deg, rgba(227, 227, 227, 0) 23.5%, #393939 66%, rgba(227, 227, 227, 0) 97.5%);
}

.dark #submit {
    color: #222;
    background-color: #fff;
}

.dark #submit:hover {
    color: #fff;
    background-color: var(--accent-color);
}

.dark #author, .dark #email, .dark #url, .dark #comment {
    background: #1a1a1a;
    border-color: #323232;
}

.dark #author:focus, .dark #email:focus, .dark #url:focus, .dark #comment:focus {
    color: #c5c5c5;
    border-color: #404040;
}

.dark .comment-author {
    color: #fff;
}

.dark .comment-reply-link {
    color: #fff;
    border-color: #333;
    background-color: #222;
}

.dark .comment-reply-link:hover {
    border-color: #333;
    background-color: #333;
}

.dark .comment .children::before {
    background: linear-gradient(90deg, rgba(227, 227, 227, 0) 0%, #393939 50%, rgba(227, 227, 227, 0) 100%);
}

.dark #respond p label {
    color: #fff;
}

/*-------------------------------------------*\
	6. Sidebar/Widgets Styling
\*-------------------------------------------*/

.dark .widget .children li:first-child,
.dark .widget .sub-menu li:first-child {
    border-top-color: #343434;
}

.dark #hidden-sidebar .widget_nav_menu .menu-arrow {
    border-color: #424242;
}

.dark #hidden-sidebar 
.widget_nav_menu  
.menu-arrow::after {
    background-image: url(../images/drop-menu-side-white.svg);
}

.dark .section-heading-w::after,
.dark #respond #reply-title::after,
.dark .widget-sidebar .wp-block-group__inner-container h2:first-of-type::after {
    background-color: #fff;
}

.dark .wp-block-categories-list li a,
.dark .wp-block-archives-list li a,
.dark .widget .menu li a,
.dark .widget_pages li a,
.dark .wp-block-latest-posts__list li a,
.dark .widget_recent_entries li a,
.dark .widget_recent_comments li a,
.dark .widget_archive li a,
.dark .widget_categories li a,
.dark .widget_meta li a,
.dark .wc-block-product-categories-list li a,
.dark .wp-block-latest-comments li a {
    color: #fff;
}

.dark .wp-block-categories-list li a:hover,
.dark .wp-block-archives-list li a:hover,
.dark .widget .menu li a:hover,
.dark .widget_pages li a:hover,
.dark .wp-block-latest-posts__list li a:hover,
.dark .widget_recent_entries li a:hover,
.dark .widget_recent_comments li a:hover,
.dark .widget_archive li a:hover,
.dark .widget_categories li a:hover,
.dark .widget_meta li a:hover,
.dark .wc-block-product-categories-list li a:hover,
.dark .wp-block-latest-comments li a:hover {
    color: #898989;
}

.dark .wp-block-categories-list li,
.dark .wp-block-archives-list li,
.dark .widget .menu li,
.dark .widget_pages li,
.dark .wp-block-latest-posts__list li,
.dark .widget_recent_entries li,
.dark .widget_recent_comments li,
.dark .widget_archive li,
.dark .widget_categories li,
.dark .widget_meta li,
.dark .entry .wp-block-rss li,
.dark .wc-block-product-categories-list li,
.dark .wp-block-latest-comments li {
    border-bottom-color: #343434;
}

/*-------------------------------------------*\
	7. Contact Form Styling
\*-------------------------------------------*/

.dark .wpcf7-text, .dark .wpcf7-textarea, .dark .wpcf7-select {
    background: #1a1a1a;
    border-color: #323232;
}

.dark .wpcf7-text:focus, .dark .wpcf7-textarea:focus, .dark .wpcf7-select:focus {
    color: #c5c5c5;
    border-color: #404040;
}

.dark .wpcf7-submit {
    color: #222;
    background-color: #fff;
}

.dark .wpcf7-submit:hover {
    color: #fff;
    background-color: var(--accent-color);
}

/*-------------------------------------------*\
	8. Error Page Styling
\*-------------------------------------------*/

.dark .error-content-wrap::before {
	background-image: url(../images/error-broken-white.svg);
}

.dark .error-wrap #s {
    color: #9e9e9e;
    background: #1a1a1a;
    border-color: #323232;
}

.dark .error-wrap #s:focus {
    color: #c5c5c5;
    border-color: #404040;
}

.dark .error-wrap #searchsubmit {
    color: #222;
    background-color: #fff;
}

.dark .error-wrap #searchsubmit:hover {
    color: #fff;
    background-color: var(--accent-color);
}

/*-------------------------------------------*\
	9. WooCommerce Styling
\*-------------------------------------------*/

.woocommerce.dark #respond input#submit, 
.woocommerce.dark a.button, 
.woocommerce.dark button.button, 
.woocommerce.dark input.button, 
.woocommerce.dark #respond input#submit.alt, 
.woocommerce.dark a.button.alt, 
.woocommerce.dark button.button.alt, 
.woocommerce.dark input.button.alt, 
.woocommerce.dark button.button:disabled, 
.woocommerce.dark button.button:disabled[disabled] {
    color: #ffffff;
    border-color: #363636;
    background-color: #363636;
}

.dark .product-content .product-price,
.dark .wc-block-grid__product .wc-block-grid__product-title {
    color: #fff;
}

.woocommerce.dark nav.woocommerce-pagination ul li span.current {
    background-color: #2a2a2a;
}

.dark select {
    color: #8a8a8a;
    background-color: #363636;
}

.dark .woocommerce form .form-row label {
    color: #fff;
}

.dark .select2-container--default .select2-selection--single,
.dark .woocommerce form .form-row input.input-text,
.dark .woocommerce form .form-row textarea {
    color: #949494;
    border-color: #373737;
    background-color: #1D1D1D;
}

.dark .select2-container--default .select2-selection--single:focus,
.dark .woocommerce form .form-row input.input-text:focus,
.dark .woocommerce form .form-row textarea:focus {
    color: #c5c5c5;
    background-color: #1a1a1a;
}

.dark .woocommerce .woocommerce-error, 
.dark .woocommerce .woocommerce-info, 
.dark .woocommerce .woocommerce-message {
    color: #fff;
    border-color: #3a3a3a;
    background-color: #2a2a2a;
}

.dark #add_payment_method #payment, 
.dark .woocommerce-cart #payment, 
.dark .woocommerce-checkout #payment {
    background: #282828;
}

.woocommerce-checkout.dark  #payment ul.payment_methods {
    border-bottom-color: #222;
}

.dark .woocommerce #respond input#submit, 
.dark .woocommerce a.button, 
.dark .woocommerce button.button, 
.dark .woocommerce input.button, 
.dark .woocommerce #respond input#submit.alt, 
.dark .woocommerce a.button.alt, 
.dark .woocommerce button.button.alt, 
.dark .woocommerce input.button.alt, 
.dark .woocommerce button.button:disabled, 
.dark .woocommerce button.button:disabled[disabled] {
    color: #fff;
    background-color: #363636;
}

.woocommerce-cart.dark table.cart .product-name a,
.dark .product_meta, .woocommerce.dark div.product .woocommerce-tabs ul.tabs li.active,
.woocommerce.dark div.product .woocommerce-tabs ul.tabs li:hover a,
.woocommerce.dark #reviews #reply-title, .dark .comment-form-rating label,
.woocommerce.dark .woocommerce-breadcrumb a {
    color: #fff;
}

.woocommerce-cart.dark table.cart tr,
.dark .woocommerce table.shop_table {
    border-color: #383838;
}

.dark #add_payment_method .cart-collaterals .cart_totals tr td, 
.dark #add_payment_method .cart-collaterals .cart_totals tr th, 
.woocommerce-cart.dark .cart-collaterals .cart_totals tr td, 
.woocommerce-cart.dark .cart-collaterals .cart_totals tr th, 
.woocommerce-checkout.dark .cart-collaterals .cart_totals tr td, 
.woocommerce-checkout.dark .cart-collaterals .cart_totals tr th {
    border-top-color: #383838;
}

.woocommerce-cart.dark table.cart td.actions .coupon .input-text,
.dark .woocommerce .quantity .qty {
    color: #949494;
    border-color: #373737;
    background-color: #1D1D1D;
}

.woocommerce-cart.dark table.cart td.actions .coupon .input-text:focus,
.dark .woocommerce .quantity .qty:focus {
    color: #ccc;
}

.dark .woocommerce-product-details__short-description {
    color: #c5c5c5;
}

.woocommerce.dark .quantity .qty {
    color: #B1B1B1;
    border-color: #373737;
    background-color: #1D1D1D;
}

.woocommerce.dark .quantity .qty:focus {
    color: #fff;
    background-color: #1a1a1a;
}

.woocommerce.dark div.product .woocommerce-tabs ul.tabs::before {
    border-bottom-color: #363636;
}

.woocommerce.dark div.product .woocommerce-tabs ul.tabs li.active {
    border-bottom-color: #fff;
}

.dark .woocommerce-MyAccount-navigation ul li {
    border-bottom-color: #303030;
}

.dark .woocommerce-MyAccount-navigation ul li a {
    color: #fff;
}

.woocommerce.dark button.single_add_to_cart_button.button.alt:hover {
    color: #222;
    background-color: #fff;
}

/*-------------------------------------------*\
	10. Footer Styling
\*-------------------------------------------*/

.dark #footer-newsletter-inner {
    background-color: #222;
    background-image: url(../images/footer-bg-dark.svg);
}

.dark #footer-newsletter .wrapper::before,
.dark #footer-newsletter .wrapper::after {
    background: linear-gradient(90deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #343434 49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
}

.dark #footer-newsletter input[type=email], .dark #footer-newsletter input[type=text] {
    color: #9e9e9e;
    background: #1a1a1a;
    border-color: #323232;
}

.dark #footer-newsletter input[type=email]:focus,
.dark #footer-newsletter input[type=text]:focus {
    color: #c5c5c5;
    border-color: #404040;
}

.dark #footer-newsletter input[type=submit] {
    color: #222;
    background-color: #fff;
}

.dark #footer-newsletter input[type=submit]:hover {
    color: #fff;
    background-color: var(--accent-color);
}

/*** Copyrights DIV Styling ***/

.dark #footer-social li::after {
    background: linear-gradient(180deg, rgba(50, 50, 50, 0) 0%, rgba(50, 50, 50, 0.714286) 25%, #343434 49%, rgba(50, 50, 50, 0.784314) 73.5%, rgba(50, 50, 50, 0) 100%);
    transform: matrix(1, 0, 0, -1, 0, 0);
    line-height: 32px;
}

.dark #footer-social svg {
    color: #fff;
    transition: color .3s;
}

.dark #footer-social a:hover svg {
    color: #838383;
}

/*** Back To Top ***/

.dark #back-to-top {
    background-color: #fff;
    background-image: url(../images/back-to-top-dark.svg);
}

.dark #back-to-top:hover {
    background-color: var(--accent-color);
    background-image: url(../images/back-to-top.svg);
}