<?php
add_filter( 'osf_customize_colors', 'osf_typography_custom_color', 10, 7 );
function osf_typography_custom_color($cssCode, $color_primary, $color_primary_hover, $color_secondary, $color_secondary_hover, $color_body, $color_heading) {
    $cssCode .= <<<CSS

blockquote cite,
.breadcrumb,
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="url"]::placeholder,
input[type="password"]::placeholder,
input[type="search"]::placeholder,
input[type="number"]::placeholder,
input[type="tel"]::placeholder,
input[type="range"]::placeholder,
input[type="date"]::placeholder,
input[type="month"]::placeholder,
input[type="week"]::placeholder,
input[type="time"]::placeholder,
input[type="datetime"]::placeholder,
input[type="datetime-local"]::placeholder,
input[type="color"]::placeholder,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea::placeholder,
textarea,
.mainmenu-container li a span,
.tags-links a,
.c-body,
.site-header-account .account-links-menu li a,
.site-header-account .account-dashboard li a,
.comment-form a,
.tagcloud a,
.elementor-nav-menu--dropdown a,
.elementor-search-form--skin-minimal .elementor-search-form__icon {
  color: {$color_body}; }




.button-outline,
.widget-area strong,
h1,
.site-title,
h2,
h3,
.page-header .page-title,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.tags-links .tags-title,
blockquote,
.form-group .form-row label,
label,
th,
a,
.main-navigation .top-menu > li > a,
.menu-toggle,
.vertical-navigation ul.menu > li > a,
.page-numbers.next:not(ul),
.page-numbers.prev:not(ul),
.header-search .search-button,
.pbr-social-share a,
.entry-content blockquote cite a,
.entry-content dt,
.entry-content th,
.osf-portfolio-info .label,
.site-header-account > a i,
.site-header-account > a .text-account,
.site-header-account > a .submenu-indicator,
.comment-content strong,
.comment-author,
.comment-author a,
.comment-metadata a.comment-edit-link,
.comment-reply-link,
.comment-content table th,
.comment-content dt,
.widget_search button[type="submit"],
.widget_meta a,
.widget_pages a,
.widget_archive a,
.widget_categories a,
.widget_nav_menu a,
.widget_categories .cat-count,
.c-heading,
fieldset legend,
.post-navigation .nav-link a,
.author-wrapper .author-name,
.search .site-content .page-title,
#secondary .widget_product_categories .current-cat > a,
#secondary .widget_product_categories .current-cat > .count,
.widget_recent_entries li.item-recent-post a,
.elementor-element .elementor-widget-wp-widget-recent-posts li.item-recent-post a,
.elementor-featured-box-wrapper .elementor-featured-box-icon i,
.elementor-featured-box-wrapper .elementor-featured-box-title,
.elementor-widget-opal-image-hotspots .elementor-accordion .elementor-tab-title,
.elementor-nav-menu--main .elementor-nav-menu a,
.elementor-portfolio__filter,
.elementor-price-table__currency,
.elementor-price-table__integer-part,
.elementor-progress-percentage,
.elementor-widget-progress .elementor-title,
.elementor-teams-wrapper .elementor-team-name,
.elementor-widget-opal-testimonials .elementor-testimonial-title,
.elementor-widget-opal-testimonials .elementor-testimonial-name {
  color: {$color_heading}; }



.button-custom:hover i,
blockquote:before,
.breadcrumb a:hover,
.breadcrumb a:hover span,
.list-check li:before,
.main-navigation .top-menu > li:hover > a,
.main-navigation .top-menu > li:active > a,
.main-navigation .top-menu > li:focus > a,
.mainmenu-container li.current-menu-item > a,
.mainmenu-container li.current-menu-parent > a,
.mainmenu-container .menu-item > a:hover,
.page-numbers:not(ul),
.page-numbers.next:not(ul):hover,
.page-numbers.prev:not(ul):hover,
.site-header .header-group .search-submit:hover,
.site-header .header-group .search-submit:focus,
.entry-header .entry-title a:hover,
.entry-meta .author a:not(:hover),
.more-link,
.pbr-social-share a:hover,
.post-navigation .nav-title,
.osf-portfolio-info i,
.site-header-account > a:hover i,
.site-header-account > a:hover .text-account,
.site-header-account > a:hover .submenu-indicator,
.comment-author a:hover,
.comment-metadata a:hover,
.title-with-icon:before,
.widget_recent_entries li a:hover,
.widget_recent_entries li a:active,
.widget_meta a:before,
.widget_pages a:before,
.widget_archive a:before,
.widget_categories a:before,
.widget_nav_menu a:before,
.button-outline-primary,
.elementor-wpcf7-button-outline_primary input[type="button"],
.elementor-wpcf7-button-outline_primary input[type="submit"],
.elementor-wpcf7-button-outline_primary button[type="submit"],
.mailchimp-button-outline_primary button,
.mailchimp-button-outline_primary button[type="submit"],
.mailchimp-button-outline_primary input[type="submit"],
.elementor-element .elementor-button-outline_primary .elementor-button,
.btn-link,
.elementor-element .elementor-button-link .elementor-button,
.button-link,
.elementor-wpcf7-button-link input[type="button"][type="submit"],
.elementor-wpcf7-button-link input[type="submit"],
.elementor-wpcf7-button-link button[type="submit"],
.mailchimp-button-link button,
.mailchimp-button-link button[type="submit"],
.mailchimp-button-link input[type="submit"],
.c-primary,
.mainmenu-container ul ul .menu-item > a:hover,
.mainmenu-container ul ul .menu-item > a:active,
.mainmenu-container ul ul .menu-item > a:focus,
.navigation-button .menu-toggle:hover,
.navigation-button .menu-toggle:focus,
.entry-content blockquote cite a:hover,
.site-header-account .account-dropdown a.register-link,
.site-header-account .account-dropdown a.lostpass-link,
.comment-form a:hover,
#secondary .elementor-widget-container h5:first-of-type,
.elementor-featured-box-wrapper:hover .elementor-featured-box-icon i:before,
.elementor-nav-menu-popup .mfp-close,
#secondary .elementor-widget-wp-widget-recent-posts a,
.elementor-element .elementor-widget-wp-widget-recent-posts li a:hover,
.elementor-element .elementor-widget-wp-widget-recent-posts li a:active,
.elementor-brand-wrapper .elementor-brand-description,
.contactform-content .form-title,
.elementor-opal-countdown-wrapper .elementor-countdown-digits,
.elementor-widget-heading .sub-title,
.elementor-widget-icon-box.elementor-view-framed:hover .elementor-icon,
.elementor-widget-icon-box.elementor-view-framed:not(:hover) .elementor-icon,
.elementor-widget-icon-box.elementor-view-default:hover .elementor-icon,
.elementor-widget-icon-box.elementor-view-default:not(:hover) .elementor-icon,
.elementor-widget-icon-box:hover .elementor-icon-box-title,
.elementor-widget.elementor-widget-icon-list .elementor-icon-list-item:not(:hover) i,
.elementor-widget.elementor-widget-icon-list .elementor-icon-list-item:not(:hover) .elementor-icon-list-text,
.elementor-widget.elementor-widget-icon-list .elementor-icon-list-item:hover i,
.elementor-widget.elementor-widget-icon-list .elementor-icon-list-item:hover .elementor-icon-list-text,
.elementor-widget-icon.elementor-view-default .elementor-icon,
.elementor-widget-icon.elementor-view-framed .elementor-icon,
.elementor-widget-opal-image-hotspots .elementor-accordion .elementor-tab-title.elementor-active,
.elementor-nav-menu--main.elementor-nav-menu--layout-horizontal .elementor-nav-menu a.elementor-sub-item.elementor-item-active,
.elementor-nav-menu--main .elementor-item.highlighted,
.elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-nav-menu--main .elementor-item:hover,
.elementor-nav-menu--main .elementor-item:focus,
.elementor-nav-menu--main .current-menu-ancestor .elementor-item.has-submenu,
.elementor-nav-menu--main .current-menu-item > .elementor-item,
.elementor-nav-menu--popup .elementor-item.highlighted,
.elementor-nav-menu--popup .elementor-item.elementor-item-active,
.elementor-nav-menu--popup .elementor-item:hover,
.elementor-nav-menu--popup .elementor-item:focus,
.elementor-nav-menu--popup .elementor-nav-menu--dropdown a:hover,
.elementor-nav-menu--popup .elementor-nav-menu--dropdown a.highlighted,
.elementor-nav-menu--dropdown:not(.mega-menu) a:hover,
.elementor-nav-menu--dropdown:not(.mega-menu) a.highlighted,
.elementor-nav-menu--dropdown:not(.mega-menu) a.has-submenu,
.elementor-menu-toggle:hover i,
.elementor-menu-toggle:hover .menu-toggle-title,
.elementor-widget-opal-phone:not(:hover) i,
.elementor-widget-opal-phone:not(:hover) .elementor-phone-title,
.elementor-widget-opal-phone:not(:hover) .elementor-phone-subtitle,
.portfolio .portfolio-content .entry-title a:hover,
.elementor-portfolio-style-overlay .portfolio .portfolio-content .entry-title a:hover,
.elementor-portfolio__filter.elementor-active,
.elementor-portfolio__filter:hover,
.single-portfolio-navigation .nav-link:hover span,
ul.elementor-price-table__features-list .item-active i,
.elementor-price-table__popular,
.elementor-price-table__heading,
.elementor-button-default .elementor-button,
.elementor-search-form--skin-full_screen .elementor-search-form__toggle:hover,
.elementor-widget-social-icons.elementor-social-custom .elementor-social-icon:hover i,
.elementor-teams-wrapper .elementor-team-name:hover,
.elementor-video-icon {
  color: {$color_primary->toCss()}; }


.f-primary {
  fill: {$color_primary->toCss()}; }


.main-navigation .top-menu > li:hover > a:after,
.main-navigation .top-menu > li.current-menu-parent > a:after,
.main-navigation .top-menu > li.current-menu-item > a:after,
.mp-level::-webkit-scrollbar-thumb,
.page-numbers:not(ul):not(.dots):not(.next):not(.prev):hover,
.page-numbers:not(ul):not(.dots):not(.next):not(.prev):focus,
.page-numbers.current:not(ul):not(.dots):not(.next):not(.prev),
.post-navigation > div:hover,
.page-links a:hover .page-number,
.page-links a:focus .page-number,
.page-links .current .page-number,
.page-links > .page-number,
.scrollup,
.tagcloud a:hover,
.tagcloud a:focus,
.button-primary,
input[type="reset"],
input.secondary[type="button"],
input.secondary[type="reset"],
input.secondary[type="submit"],
input[type="button"],
input[type="submit"],
button[type="submit"],
.cat-links a,
.secondary-button .search-submit,
.elementor-wpcf7-button-primary input[type="button"][type="submit"],
.elementor-wpcf7-button-primary input[type="submit"],
.elementor-wpcf7-button-primary button[type="submit"],
.mailchimp-button-primary button,
.mailchimp-button-primary button[type="submit"],
.mailchimp-button-primary input[type="submit"],
.button-default:hover,
.button-dark:hover,
.elementor-element .elementor-button-dark .elementor-button:hover,
.elementor-wpcf7-button-dark input:hover[type="submit"],
.elementor-wpcf7-button-dark button:hover[type="submit"],
.mailchimp-button-dark button:hover,
.mailchimp-button-dark input:hover[type="submit"],
.button-dark:active,
.elementor-element .elementor-button-dark .elementor-button:active,
.elementor-wpcf7-button-dark input:active[type="submit"],
.elementor-wpcf7-button-dark button:active[type="submit"],
.mailchimp-button-dark button:active,
.mailchimp-button-dark input:active[type="submit"],
.button-dark:focus,
.elementor-element .elementor-button-dark .elementor-button:focus,
.elementor-wpcf7-button-dark input:focus[type="submit"],
.elementor-wpcf7-button-dark button:focus[type="submit"],
.mailchimp-button-dark button:focus,
.mailchimp-button-dark input:focus[type="submit"],
.button-outline-dark:hover,
.elementor-element .elementor-button-outline_dark .elementor-button:hover,
.button-outline-dark:active,
.elementor-element .elementor-button-outline_dark .elementor-button:active,
.button-outline-dark:focus,
.elementor-element .elementor-button-outline_dark .elementor-button:focus,
.button-light:hover,
.elementor-element .elementor-button-light .elementor-button:hover,
.elementor-wpcf7-button-light input:hover[type="submit"],
.elementor-wpcf7-button-light button:hover[type="submit"],
.mailchimp-button-light button:hover,
.mailchimp-button-light input:hover[type="submit"],
.button-light:active,
.elementor-element .elementor-button-light .elementor-button:active,
.elementor-wpcf7-button-light input:active[type="submit"],
.elementor-wpcf7-button-light button:active[type="submit"],
.mailchimp-button-light button:active,
.mailchimp-button-light input:active[type="submit"],
.button-light:focus,
.elementor-element .elementor-button-light .elementor-button:focus,
.elementor-wpcf7-button-light input:focus[type="submit"],
.elementor-wpcf7-button-light button:focus[type="submit"],
.mailchimp-button-light button:focus,
.mailchimp-button-light input:focus[type="submit"],
.elementor-element .elementor-button-primary .elementor-button,
.button-outline:hover,
.button-outline:active,
.button-outline.active,
.show > .button-outline.dropdown-toggle,
.button-outline-primary:hover,
.elementor-wpcf7-button-outline_primary input:hover[type="button"],
.elementor-wpcf7-button-outline_primary input:hover[type="submit"],
.elementor-wpcf7-button-outline_primary button:hover[type="submit"],
.mailchimp-button-outline_primary button:hover,
.mailchimp-button-outline_primary input:hover[type="submit"],
.button-outline-primary:active,
.elementor-wpcf7-button-outline_primary input:active[type="button"],
.elementor-wpcf7-button-outline_primary input:active[type="submit"],
.elementor-wpcf7-button-outline_primary button:active[type="submit"],
.mailchimp-button-outline_primary button:active,
.mailchimp-button-outline_primary input:active[type="submit"],
.button-outline-primary.active,
.elementor-wpcf7-button-outline_primary input.active[type="button"],
.elementor-wpcf7-button-outline_primary input.active[type="submit"],
.elementor-wpcf7-button-outline_primary button.active[type="submit"],
.mailchimp-button-outline_primary button.active,
.mailchimp-button-outline_primary input.active[type="submit"],
.show > .button-outline-primary.dropdown-toggle,
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="button"],
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_primary .show > button.dropdown-toggle,
.mailchimp-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_primary .elementor-button:hover,
.elementor-element .elementor-button-outline_primary .elementor-button:active,
.elementor-element .elementor-button-outline_primary .elementor-button:focus,
.bg-primary,
.owl-theme .owl-nav [class*='owl-']:hover:before,
.elementor-element .elementor-button-secondary .elementor-button:after,
.elementor-element .elementor-button-outline_secondary .elementor-button:before,
.elementor-cta .elementor-cta_circle,
.elementor-widget-divider .elementor-divider-separator:before,
.elementor-icon-bg-yes .elementor-featured-box-wrapper .elementor-featured-box-icon i:after,
.elementor-flip-box__front,
.elementor-widget-icon-box.elementor-view-stacked:not(:hover) .elementor-icon,
.elementor-widget-icon-box.elementor-view-stacked:hover .elementor-icon,
.elementor-text-underline-yes .elementor-icon-list-item:hover .elementor-icon-list-text:before,
.elementor-widget-icon.elementor-view-stacked .elementor-icon,
.elementor-widget-opal-image-hotspots .scrollbar-inner > .scroll-element .scroll-bar,
.opal-image-hotspots-main-icons .opal-image-hotspots-icon,
.elementor-widget-opal-image-gallery .gallery-item-overlay,
.elementor-widget-opal-image-gallery .elementor-galerry__filter.elementor-active,
.elementor-nav-menu--main.elementor-nav-menu--layout-horizontal:not(.e--pointer-framed) .elementor-nav-menu > li.current-menu-parent > a:before,
.elementor-nav-menu--main.elementor-nav-menu--layout-horizontal:not(.e--pointer-framed) .elementor-nav-menu > li.current-menu-parent > a:after,
.elementor-nav-menu--main.e--pointer-dot .elementor-item.elementor-item-active:before,
.elementor-nav-menu--main.e--pointer-dot .elementor-item:not(:hover):before,
.elementor-nav-menu--main.e--pointer-dot .elementor-item:hover:before,
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:before,
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:after,
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
.elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after,
.elementor-nav-menu--popup.e--pointer-dot .elementor-item.elementor-item-active:before,
.elementor-nav-menu--popup.e--pointer-dot .elementor-item:hover:before,
.e--pointer-dot .elementor-item:before,
.e--pointer-underline .elementor-item .menu-title:before,
.e--pointer-underline .elementor-item .menu-title:after,
.single-portfolio-summary .pbr-social-share a:hover,
.elementor-teams-wrapper .team-icon-socials a,
.elementor-widget-opal-testimonials .elementor-testimonial-image:before,
.timeline-item .timeline-thumbnail:after {
  background-color: {$color_primary->toCss()}; }



.button-outline-secondary,
.elementor-wpcf7-button-outline_secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-outline_secondary input[type="submit"],
.elementor-wpcf7-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary button,
.mailchimp-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary input[type="submit"],
.elementor-element.elementor-button-link .elementor-button:hover,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus,
.tagcloud a:hover,
.tagcloud a:focus,
.button-primary,
input[type="reset"],
input.secondary[type="button"],
input.secondary[type="reset"],
input.secondary[type="submit"],
input[type="button"],
input[type="submit"],
button[type="submit"],
.cat-links a,
.secondary-button .search-submit,
.elementor-wpcf7-button-primary input[type="button"][type="submit"],
.elementor-wpcf7-button-primary input[type="submit"],
.elementor-wpcf7-button-primary button[type="submit"],
.mailchimp-button-primary button,
.mailchimp-button-primary button[type="submit"],
.mailchimp-button-primary input[type="submit"],
.button-default:hover,
.button-dark:hover,
.elementor-element .elementor-button-dark .elementor-button:hover,
.elementor-wpcf7-button-dark input:hover[type="submit"],
.elementor-wpcf7-button-dark button:hover[type="submit"],
.mailchimp-button-dark button:hover,
.mailchimp-button-dark input:hover[type="submit"],
.button-dark:active,
.elementor-element .elementor-button-dark .elementor-button:active,
.elementor-wpcf7-button-dark input:active[type="submit"],
.elementor-wpcf7-button-dark button:active[type="submit"],
.mailchimp-button-dark button:active,
.mailchimp-button-dark input:active[type="submit"],
.button-dark:focus,
.elementor-element .elementor-button-dark .elementor-button:focus,
.elementor-wpcf7-button-dark input:focus[type="submit"],
.elementor-wpcf7-button-dark button:focus[type="submit"],
.mailchimp-button-dark button:focus,
.mailchimp-button-dark input:focus[type="submit"],
.button-outline-dark:hover,
.elementor-element .elementor-button-outline_dark .elementor-button:hover,
.button-outline-dark:active,
.elementor-element .elementor-button-outline_dark .elementor-button:active,
.button-outline-dark:focus,
.elementor-element .elementor-button-outline_dark .elementor-button:focus,
.button-light:hover,
.elementor-element .elementor-button-light .elementor-button:hover,
.elementor-wpcf7-button-light input:hover[type="submit"],
.elementor-wpcf7-button-light button:hover[type="submit"],
.mailchimp-button-light button:hover,
.mailchimp-button-light input:hover[type="submit"],
.button-light:active,
.elementor-element .elementor-button-light .elementor-button:active,
.elementor-wpcf7-button-light input:active[type="submit"],
.elementor-wpcf7-button-light button:active[type="submit"],
.mailchimp-button-light button:active,
.mailchimp-button-light input:active[type="submit"],
.button-light:focus,
.elementor-element .elementor-button-light .elementor-button:focus,
.elementor-wpcf7-button-light input:focus[type="submit"],
.elementor-wpcf7-button-light button:focus[type="submit"],
.mailchimp-button-light button:focus,
.mailchimp-button-light input:focus[type="submit"],
.elementor-element .elementor-button-primary .elementor-button,
.button-outline-primary,
.elementor-wpcf7-button-outline_primary input[type="button"],
.elementor-wpcf7-button-outline_primary input[type="submit"],
.elementor-wpcf7-button-outline_primary button[type="submit"],
.mailchimp-button-outline_primary button,
.mailchimp-button-outline_primary button[type="submit"],
.mailchimp-button-outline_primary input[type="submit"],
.elementor-element .elementor-button-outline_primary .elementor-button,
.button-outline:hover,
.button-outline:active,
.button-outline.active,
.show > .button-outline.dropdown-toggle,
.button-outline-primary:hover,
.elementor-wpcf7-button-outline_primary input:hover[type="button"],
.elementor-wpcf7-button-outline_primary input:hover[type="submit"],
.elementor-wpcf7-button-outline_primary button:hover[type="submit"],
.mailchimp-button-outline_primary button:hover,
.mailchimp-button-outline_primary input:hover[type="submit"],
.button-outline-primary:active,
.elementor-wpcf7-button-outline_primary input:active[type="button"],
.elementor-wpcf7-button-outline_primary input:active[type="submit"],
.elementor-wpcf7-button-outline_primary button:active[type="submit"],
.mailchimp-button-outline_primary button:active,
.mailchimp-button-outline_primary input:active[type="submit"],
.button-outline-primary.active,
.elementor-wpcf7-button-outline_primary input.active[type="button"],
.elementor-wpcf7-button-outline_primary input.active[type="submit"],
.elementor-wpcf7-button-outline_primary button.active[type="submit"],
.mailchimp-button-outline_primary button.active,
.mailchimp-button-outline_primary input.active[type="submit"],
.show > .button-outline-primary.dropdown-toggle,
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="button"],
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_primary .show > button.dropdown-toggle,
.mailchimp-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_primary .elementor-button:hover,
.elementor-element .elementor-button-outline_primary .elementor-button:active,
.elementor-element .elementor-button-outline_primary .elementor-button:focus,
.b-primary,
.owl-theme .owl-nav [class*='owl-']:hover:before,
.elementor-widget-icon-box.elementor-view-framed:hover .elementor-icon,
.elementor-widget-icon-box.elementor-view-framed:not(:hover) .elementor-icon,
.elementor-widget-icon.elementor-view-default .elementor-icon,
.elementor-widget-icon.elementor-view-framed .elementor-icon,
.elementor-widget-opal-image-gallery .elementor-galerry__filter.elementor-active:before,
.mc4wp-form-fields:focus-within,
.e--pointer-framed .elementor-item.elementor-item-active:before,
.e--pointer-framed .elementor-item.elementor-item-active:after,
.e--pointer-framed .elementor-item:before,
.e--pointer-framed .elementor-item:after,
.elementor-nav-menu--main > .elementor-nav-menu,
.elementor-nav-menu--main .elementor-nav-menu ul,
.elementor-search-form__container:not(.elementor-search-form--full-screen):focus-within,
.elementor-search-form--skin-full_screen .elementor-search-form__toggle:hover {
  border-color: {$color_primary->toCss()}; }


.site-header-account .account-dropdown .account-wrap,
.timeline-item .timeline-thumbnail:before {
  border-top-color: {$color_primary->toCss()}; }


.main-navigation .top-menu > li:hover:before,
.main-navigation .top-menu > li:active:before,
.main-navigation .top-menu > li:focus:before,
.site-header-account .account-dropdown .account-wrap:before,
.elementor-nav-menu--layout-horizontal .elementor-nav-menu li.menu-item-has-children:before,
.elementor-nav-menu--layout-horizontal .elementor-nav-menu li.has-mega-menu:before,
.elementor-portfolio__filter.elementor-active:after,
.elementor-portfolio__filter:hover:after {
  border-bottom-color: {$color_primary->toCss()}; }


.opal-timeline-line {
  border-left-color: {$color_primary->toCss()}; }




.btn-link:focus,
.elementor-element .elementor-button-link .elementor-button:focus,
.btn-link:hover,
.elementor-element .elementor-button-link .elementor-button:hover,
.button-link:focus,
.more-link:focus,
.elementor-wpcf7-button-link input:focus[type="submit"],
.elementor-wpcf7-button-link button:focus[type="submit"],
.mailchimp-button-link button:focus,
.mailchimp-button-link input:focus[type="submit"],
.button-link:hover,
.more-link:hover,
.elementor-wpcf7-button-link input:hover[type="submit"],
.elementor-wpcf7-button-link button:hover[type="submit"],
.mailchimp-button-link button:hover,
.mailchimp-button-link input:hover[type="submit"],
a:hover,
a:active,
.widget_search button[type="submit"]:hover,
.widget_search button[type="submit"]:focus,
.elementor-widget-opal-phone:hover i,
.elementor-widget-opal-phone:hover .elementor-phone-title,
.elementor-widget-opal-phone:hover .elementor-phone-subtitle,
.elementor-search-form .elementor-search-form__submit:active,
.elementor-search-form .elementor-search-form__submit:hover {
  color: {$color_primary_hover->toCss()}; }


.tags-links a:hover,
.scrollup:hover,
.button-primary:hover,
input:hover[type="reset"],
input:hover[type="button"],
input:hover[type="submit"],
button:hover[type="submit"],
.cat-links a:hover,
.secondary-button .search-submit:hover,
.elementor-wpcf7-button-primary input:hover[type="submit"],
.elementor-wpcf7-button-primary button:hover[type="submit"],
.mailchimp-button-primary button:hover,
.button-primary:active,
input:active[type="reset"],
input:active[type="button"],
input:active[type="submit"],
button:active[type="submit"],
.cat-links a:active,
.secondary-button .search-submit:active,
.elementor-wpcf7-button-primary input:active[type="submit"],
.elementor-wpcf7-button-primary button:active[type="submit"],
.mailchimp-button-primary button:active,
.button-primary.active,
input.active[type="reset"],
input.active[type="button"],
input.active[type="submit"],
button.active[type="submit"],
.cat-links a.active,
.secondary-button .active.search-submit,
.elementor-wpcf7-button-primary input.active[type="submit"],
.elementor-wpcf7-button-primary button.active[type="submit"],
.mailchimp-button-primary button.active,
.show > .button-primary.dropdown-toggle,
.show > input.dropdown-toggle[type="reset"],
.show > input.dropdown-toggle[type="button"],
.show > input.dropdown-toggle[type="submit"],
.show > button.dropdown-toggle[type="submit"],
.cat-links .show > a.dropdown-toggle,
.secondary-button .show > .dropdown-toggle.search-submit,
.elementor-wpcf7-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-primary .show > button.dropdown-toggle,
.mailchimp-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-primary .elementor-button:hover,
.elementor-element .elementor-button-primary .elementor-button:active,
.elementor-element .elementor-button-primary .elementor-button:focus {
  background-color: {$color_primary_hover->toCss()}; }


.tags-links a:hover,
.button-primary:hover,
input:hover[type="reset"],
input:hover[type="button"],
input:hover[type="submit"],
button:hover[type="submit"],
.cat-links a:hover,
.secondary-button .search-submit:hover,
.elementor-wpcf7-button-primary input:hover[type="submit"],
.elementor-wpcf7-button-primary button:hover[type="submit"],
.mailchimp-button-primary button:hover,
.button-primary:active,
input:active[type="reset"],
input:active[type="button"],
input:active[type="submit"],
button:active[type="submit"],
.cat-links a:active,
.secondary-button .search-submit:active,
.elementor-wpcf7-button-primary input:active[type="submit"],
.elementor-wpcf7-button-primary button:active[type="submit"],
.mailchimp-button-primary button:active,
.button-primary.active,
input.active[type="reset"],
input.active[type="button"],
input.active[type="submit"],
button.active[type="submit"],
.cat-links a.active,
.secondary-button .active.search-submit,
.elementor-wpcf7-button-primary input.active[type="submit"],
.elementor-wpcf7-button-primary button.active[type="submit"],
.mailchimp-button-primary button.active,
.show > .button-primary.dropdown-toggle,
.show > input.dropdown-toggle[type="reset"],
.show > input.dropdown-toggle[type="button"],
.show > input.dropdown-toggle[type="submit"],
.show > button.dropdown-toggle[type="submit"],
.cat-links .show > a.dropdown-toggle,
.secondary-button .show > .dropdown-toggle.search-submit,
.elementor-wpcf7-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-primary .show > button.dropdown-toggle,
.mailchimp-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-primary .elementor-button:hover,
.elementor-element .elementor-button-primary .elementor-button:active,
.elementor-element .elementor-button-primary .elementor-button:focus {
  border-color: {$color_primary_hover->toCss()}; }



.vertical-navigation ul.menu > li > a:hover,
.vertical-navigation ul.menu > li > a:hover i,
.button-outline-secondary,
.elementor-wpcf7-button-outline_secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-outline_secondary input[type="submit"],
.elementor-wpcf7-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary button,
.mailchimp-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary input[type="submit"],
.elementor-element .elementor-button-outline_secondary .elementor-button,
.c-secondary,
.author-wrapper .author-name h6,
.contactform-content button.mfp-close,
ul.elementor-price-table__features-list i {
  color: {$color_secondary->toCss()}; }


.f-secondary {
  fill: {$color_secondary->toCss()}; }



.button-secondary,
.elementor-wpcf7-button-secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-secondary input[type="submit"],
.elementor-wpcf7-button-secondary button[type="submit"],
.mailchimp-button-secondary button,
.mailchimp-button-secondary button[type="submit"],
.mailchimp-button-secondary input[type="submit"],
.elementor-button-secondary button[type="submit"],
.elementor-button-secondary input[type="button"],
.elementor-button-secondary input[type="submit"],
.elementor-element .elementor-button-secondary .elementor-button,
.button-outline-secondary:hover,
.elementor-wpcf7-button-outline_secondary input:hover[type="submit"],
.elementor-wpcf7-button-outline_secondary button:hover[type="submit"],
.mailchimp-button-outline_secondary button:hover,
.mailchimp-button-outline_secondary input:hover[type="submit"],
.button-outline-secondary:active,
.elementor-wpcf7-button-outline_secondary input:active[type="submit"],
.elementor-wpcf7-button-outline_secondary button:active[type="submit"],
.mailchimp-button-outline_secondary button:active,
.mailchimp-button-outline_secondary input:active[type="submit"],
.button-outline-secondary.active,
.elementor-wpcf7-button-outline_secondary input.active[type="submit"],
.elementor-wpcf7-button-outline_secondary button.active[type="submit"],
.mailchimp-button-outline_secondary button.active,
.mailchimp-button-outline_secondary input.active[type="submit"],
.show > .button-outline-secondary.dropdown-toggle,
.elementor-wpcf7-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_secondary .show > button.dropdown-toggle,
.mailchimp-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_secondary .elementor-button:hover,
.elementor-element .elementor-button-outline_secondary .elementor-button:active,
.elementor-element .elementor-button-outline_secondary .elementor-button:focus,
.bg-secondary,
#secondary .elementor-widget-wp-widget-categories a:before,
.title-bg-polygon,
.elementor-flip-box__back,
.elementor-text-underline-yes .elementor-icon-list-item:not(:hover) .elementor-icon-list-text:before,
.elementor-teams-wrapper .team-icon-socials a:hover {
  background-color: {$color_secondary->toCss()}; }


.form-control:focus,
.button-secondary,
.elementor-wpcf7-button-secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-secondary input[type="submit"],
.elementor-wpcf7-button-secondary button[type="submit"],
.mailchimp-button-secondary button,
.mailchimp-button-secondary button[type="submit"],
.mailchimp-button-secondary input[type="submit"],
.elementor-button-secondary button[type="submit"],
.elementor-button-secondary input[type="button"],
.elementor-button-secondary input[type="submit"],
.elementor-element .elementor-button-secondary .elementor-button,
.button-outline-secondary,
.elementor-wpcf7-button-outline_secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-outline_secondary input[type="submit"],
.elementor-wpcf7-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary button,
.mailchimp-button-outline_secondary button[type="submit"],
.mailchimp-button-outline_secondary input[type="submit"],
.elementor-element .elementor-button-outline_secondary .elementor-button,
.button-outline-secondary:hover,
.elementor-wpcf7-button-outline_secondary input:hover[type="submit"],
.elementor-wpcf7-button-outline_secondary button:hover[type="submit"],
.button-outline-secondary:active,
.elementor-wpcf7-button-outline_secondary input:active[type="submit"],
.elementor-wpcf7-button-outline_secondary button:active[type="submit"],
.button-outline-secondary.active,
.elementor-wpcf7-button-outline_secondary input.active[type="submit"],
.elementor-wpcf7-button-outline_secondary button.active[type="submit"],
.show > .button-outline-secondary.dropdown-toggle,
.elementor-wpcf7-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_secondary .show > button.dropdown-toggle,
.mailchimp-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_secondary .elementor-button:hover,
.elementor-element .elementor-button-outline_secondary .elementor-button:active,
.elementor-element .elementor-button-outline_secondary .elementor-button:focus,
.b-secondary {
  border-color: {$color_secondary->toCss()}; }




.button-secondary:hover,
.elementor-wpcf7-button-secondary input:hover[type="submit"],
.elementor-wpcf7-button-secondary button:hover[type="submit"],
.mailchimp-button-secondary button:hover,
.mailchimp-button-secondary input:hover[type="submit"],
.button-secondary:active,
.elementor-wpcf7-button-secondary input:active[type="submit"],
.elementor-wpcf7-button-secondary button:active[type="submit"],
.mailchimp-button-secondary button:active,
.mailchimp-button-secondary input:active[type="submit"],
.button-secondary.active,
.elementor-wpcf7-button-secondary input.active[type="submit"],
.elementor-wpcf7-button-secondary button.active[type="submit"],
.mailchimp-button-secondary button.active,
.mailchimp-button-secondary input.active[type="submit"],
.show > .button-secondary.dropdown-toggle,
.elementor-wpcf7-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-secondary .show > button.dropdown-toggle,
.mailchimp-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-button-secondary button[type="submit"]:hover,
.elementor-button-secondary button[type="submit"]:active,
.elementor-button-secondary button[type="submit"]:focus,
.elementor-button-secondary input[type="button"]:hover,
.elementor-button-secondary input[type="button"]:active,
.elementor-button-secondary input[type="button"]:focus,
.elementor-button-secondary input[type="submit"]:hover,
.elementor-button-secondary input[type="submit"]:active,
.elementor-button-secondary input[type="submit"]:focus,
.elementor-element .elementor-button-secondary .elementor-button:hover,
.elementor-element .elementor-button-secondary .elementor-button:active,
.elementor-element .elementor-button-secondary .elementor-button:focus {
  background-color: {$color_secondary_hover->toCss()}; }


.button-secondary:hover,
.elementor-wpcf7-button-secondary input:hover[type="submit"],
.elementor-wpcf7-button-secondary button:hover[type="submit"],
.mailchimp-button-secondary button:hover,
.mailchimp-button-secondary input:hover[type="submit"],
.button-secondary:active,
.elementor-wpcf7-button-secondary input:active[type="submit"],
.elementor-wpcf7-button-secondary button:active[type="submit"],
.mailchimp-button-secondary button:active,
.mailchimp-button-secondary input:active[type="submit"],
.button-secondary.active,
.elementor-wpcf7-button-secondary input.active[type="submit"],
.elementor-wpcf7-button-secondary button.active[type="submit"],
.mailchimp-button-secondary button.active,
.mailchimp-button-secondary input.active[type="submit"],
.show > .button-secondary.dropdown-toggle,
.elementor-wpcf7-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-secondary .show > button.dropdown-toggle,
.mailchimp-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-button-secondary button[type="submit"]:hover,
.elementor-button-secondary button[type="submit"]:active,
.elementor-button-secondary button[type="submit"]:focus,
.elementor-button-secondary input[type="button"]:hover,
.elementor-button-secondary input[type="button"]:active,
.elementor-button-secondary input[type="button"]:focus,
.elementor-button-secondary input[type="submit"]:hover,
.elementor-button-secondary input[type="submit"]:active,
.elementor-button-secondary input[type="submit"]:focus,
.elementor-element .elementor-button-secondary .elementor-button:hover,
.elementor-element .elementor-button-secondary .elementor-button:active,
.elementor-element .elementor-button-secondary .elementor-button:focus {
  border-color: {$color_secondary_hover->toCss()}; }


CSS;
    return $cssCode;
}
add_filter('osf_customize_grid', 'osf_typography_grid_bootstrap', 10 , 2);
function osf_typography_grid_bootstrap($cssCode, $gridGutter){
    $cssCode .= <<<CSS

.row,
body.opal-content-layout-2cl #content .wrap,
body.opal-content-layout-2cr #content .wrap,
[data-opal-columns],
body.opal-portfolio-layout-2cr .portfolio-wrap,
.site-footer .widget-area,
.comment-form,
.widget .gallery,
.elementor-element .gallery,
.entry-gallery .gallery,
.single .gallery,
[data-elementor-columns],
.single-portfolio-summary .single-portfolio-summary-inner {
    margin-right: -{$gridGutter}px;
    margin-left: -{$gridGutter}px;
}



.col-1,
.col-2,
[data-elementor-columns-mobile="6"] .column-item,
.col-3,
[data-elementor-columns-mobile="4"] .column-item,
.col-4,
[data-elementor-columns-mobile="3"] .column-item,
.col-5,
.col-6,
[data-elementor-columns-mobile="2"] .column-item,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.related-posts .column-item,
.opal-content-layout-2cr .related-posts .column-item,
.opal-content-layout-2cl .related-posts .column-item,
.site-footer .widget-area .widget-column,
.comment-form > *,
.comment-form > .comment-form-rating,
.widget .gallery-columns-1 .gallery-item,
.elementor-element .gallery-columns-1 .gallery-item,
.entry-gallery .gallery-columns-1 .gallery-item,
.single .gallery-columns-1 .gallery-item,
[data-elementor-columns-mobile="1"] .column-item,
.single-portfolio-summary .single-portfolio-summary-inner .single-portfolio-summary-meta-title,
.single-portfolio-summary .single-portfolio-summary-meta,
.single-portfolio-summary .single-portfolio-summary-content,
.single-portfolio-summary.col-lg-5 .single-portfolio-summary-meta,
.single-portfolio-summary.col-lg-5 .single-portfolio-summary-content,
.col,
body.opal-content-layout-2cl #primary,
body.opal-content-layout-2cr #primary,
body.opal-portfolio-layout-2cr #portfolio-primary,
body.opal-portfolio-layout-2cr #portfolio-secondary,
.col-auto,
.col-sm-1,
[data-opal-columns="12"] .column-item,
.col-sm-2,
[data-opal-columns="6"] .column-item,
.col-sm-3,
[data-opal-columns="4"] .column-item,
.col-sm-4,
[data-opal-columns="3"] .column-item,
.widget .gallery-columns-6 .gallery-item,
.elementor-element .gallery-columns-6 .gallery-item,
.entry-gallery .gallery-columns-6 .gallery-item,
.single .gallery-columns-6 .gallery-item,
.col-sm-5,
.col-sm-6,
[data-opal-columns="2"] .column-item,
.opal-archive-style-1 .column-item,
.opal-archive-style-2 .column-item,
.opal-archive-style-5 .column-item,
.opal-archive-style-4 .column-item,
.opal-archive-style-3 .column-item,
.comment-form .comment-form-url,
.comment-form .comment-form-email,
.comment-form .comment-form-author,
.widget .gallery-columns-2 .gallery-item,
.elementor-element .gallery-columns-2 .gallery-item,
.entry-gallery .gallery-columns-2 .gallery-item,
.single .gallery-columns-2 .gallery-item,
.widget .gallery-columns-3 .gallery-item,
.elementor-element .gallery-columns-3 .gallery-item,
.entry-gallery .gallery-columns-3 .gallery-item,
.single .gallery-columns-3 .gallery-item,
.widget .gallery-columns-4 .gallery-item,
.elementor-element .gallery-columns-4 .gallery-item,
.entry-gallery .gallery-columns-4 .gallery-item,
.single .gallery-columns-4 .gallery-item,
.elementor-timeline-view-vertical .timeline-thumbnail,
.elementor-timeline-view-vertical .timeline-content,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
[data-opal-columns="1"] .column-item,
.opal-archive-style-1.opal-content-layout-2cr .column-item,
.opal-archive-style-2.opal-content-layout-2cr .column-item,
.opal-archive-style-5.opal-content-layout-2cr .column-item,
.opal-archive-style-4.opal-content-layout-2cr .column-item,
.opal-archive-style-3.opal-content-layout-2cr .column-item,
.entry-summary .comment-form .comment-form-url,
.entry-summary .comment-form .comment-form-email,
.entry-summary .comment-form .comment-form-author,
.elementor-widget-opal-image-hotspots .opal-image-hotspots-accordion,
.elementor-widget-opal-image-hotspots .opal-image-hotspots-accordion + .opal-image-hotspots-container,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
[data-elementor-columns-tablet="6"] .column-item,
.col-md-3,
[data-elementor-columns-tablet="4"] .column-item,
.col-md-4,
[data-elementor-columns-tablet="3"] .column-item,
.col-md-5,
.col-md-6,
[data-elementor-columns-tablet="2"] .column-item,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
[data-elementor-columns-tablet="1"] .column-item,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
[data-elementor-columns="6"] .column-item,
.col-xl-3,
[data-elementor-columns="4"] .column-item,
.col-xl-4,
[data-elementor-columns="3"] .column-item,
.col-xl-5,
.col-xl-6,
[data-elementor-columns="2"] .column-item,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
[data-elementor-columns="1"] .column-item,
.col-xl,
.col-xl-auto {
    padding-right: {$gridGutter}px;
    padding-left: {$gridGutter}px;
}



.container,
#content,
ul.elementor-nav-menu--dropdown.mega-containerwidth > li.mega-menu-item > .elementor {
    padding-right: {$gridGutter}px;
    padding-left: {$gridGutter}px;
}
  @media (min-width: 576px) {
    .container, #content, ul.elementor-nav-menu--dropdown.mega-containerwidth > li.mega-menu-item > .elementor {
      max-width: 540px; } }
  @media (min-width: 768px) {
    .container, #content, ul.elementor-nav-menu--dropdown.mega-containerwidth > li.mega-menu-item > .elementor {
      max-width: 720px; } }
  @media (min-width: 992px) {
    .container, #content, ul.elementor-nav-menu--dropdown.mega-containerwidth > li.mega-menu-item > .elementor {
      max-width: 960px; } }
  @media (min-width: 1200px) {
    .container, #content, ul.elementor-nav-menu--dropdown.mega-containerwidth > li.mega-menu-item > .elementor {
      max-width: 1170px; } }


CSS;
    return $cssCode;
}
add_filter('osf_customize_button_primary_color', 'osf_typography_button_primary_color', 10 , 11);
function osf_typography_button_primary_color($cssCode, $primary, $primary_hover, $primary_border, $primary_border_hover, $primary_color, $primary_color_hover, $primary_color_outline, $button_css, $font_style_code){
    $cssCode .= <<<CSS


.button-primary,
input[type="reset"],
input.secondary[type="button"],
input.secondary[type="reset"],
input.secondary[type="submit"],
input[type="button"],
input[type="submit"],
button[type="submit"],
.cat-links a,
.secondary-button .search-submit,
.elementor-wpcf7-button-primary input[type="button"][type="submit"],
.elementor-wpcf7-button-primary input[type="submit"],
.elementor-wpcf7-button-primary button[type="submit"],
.mailchimp-button-primary button,
.mailchimp-button-primary button[type="submit"],
.mailchimp-button-primary input[type="submit"],
.button-default:hover,
.button-dark:hover,
.elementor-element .elementor-button-dark .elementor-button:hover,
.elementor-wpcf7-button-dark input:hover[type="submit"],
.elementor-wpcf7-button-dark button:hover[type="submit"],
.mailchimp-button-dark button:hover,
.mailchimp-button-dark input:hover[type="submit"],
.button-dark:active,
.elementor-element .elementor-button-dark .elementor-button:active,
.elementor-wpcf7-button-dark input:active[type="submit"],
.elementor-wpcf7-button-dark button:active[type="submit"],
.mailchimp-button-dark button:active,
.mailchimp-button-dark input:active[type="submit"],
.button-dark:focus,
.elementor-element .elementor-button-dark .elementor-button:focus,
.elementor-wpcf7-button-dark input:focus[type="submit"],
.elementor-wpcf7-button-dark button:focus[type="submit"],
.mailchimp-button-dark button:focus,
.mailchimp-button-dark input:focus[type="submit"],
.button-outline-dark:hover,
.elementor-element .elementor-button-outline_dark .elementor-button:hover,
.button-outline-dark:active,
.elementor-element .elementor-button-outline_dark .elementor-button:active,
.button-outline-dark:focus,
.elementor-element .elementor-button-outline_dark .elementor-button:focus,
.button-light:hover,
.elementor-element .elementor-button-light .elementor-button:hover,
.elementor-wpcf7-button-light input:hover[type="submit"],
.elementor-wpcf7-button-light button:hover[type="submit"],
.mailchimp-button-light button:hover,
.mailchimp-button-light input:hover[type="submit"],
.button-light:active,
.elementor-element .elementor-button-light .elementor-button:active,
.elementor-wpcf7-button-light input:active[type="submit"],
.elementor-wpcf7-button-light button:active[type="submit"],
.mailchimp-button-light button:active,
.mailchimp-button-light input:active[type="submit"],
.button-light:focus,
.elementor-element .elementor-button-light .elementor-button:focus,
.elementor-wpcf7-button-light input:focus[type="submit"],
.elementor-wpcf7-button-light button:focus[type="submit"],
.mailchimp-button-light button:focus,
.mailchimp-button-light input:focus[type="submit"],
.elementor-element .elementor-button-primary .elementor-button {
    background-color: {$primary};
    border-color: {$primary};
    color: {$primary_color};
    {$button_css}
    {$font_style_code}
}



.button-primary:hover,
input:hover[type="reset"],
input:hover[type="button"],
input:hover[type="submit"],
button:hover[type="submit"],
.cat-links a:hover,
.secondary-button .search-submit:hover,
.elementor-wpcf7-button-primary input:hover[type="submit"],
.elementor-wpcf7-button-primary button:hover[type="submit"],
.mailchimp-button-primary button:hover,
.button-primary:active,
input:active[type="reset"],
input:active[type="button"],
input:active[type="submit"],
button:active[type="submit"],
.cat-links a:active,
.secondary-button .search-submit:active,
.elementor-wpcf7-button-primary input:active[type="submit"],
.elementor-wpcf7-button-primary button:active[type="submit"],
.mailchimp-button-primary button:active,
.button-primary.active,
input.active[type="reset"],
input.active[type="button"],
input.active[type="submit"],
button.active[type="submit"],
.cat-links a.active,
.secondary-button .active.search-submit,
.elementor-wpcf7-button-primary input.active[type="submit"],
.elementor-wpcf7-button-primary button.active[type="submit"],
.mailchimp-button-primary button.active,
.show > .button-primary.dropdown-toggle,
.show > input.dropdown-toggle[type="reset"],
.show > input.dropdown-toggle[type="button"],
.show > input.dropdown-toggle[type="submit"],
.show > button.dropdown-toggle[type="submit"],
.cat-links .show > a.dropdown-toggle,
.secondary-button .show > .dropdown-toggle.search-submit,
.elementor-wpcf7-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-primary .show > button.dropdown-toggle,
.mailchimp-button-primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-primary .elementor-button:hover,
.elementor-element .elementor-button-primary .elementor-button:active,
.elementor-element .elementor-button-primary .elementor-button:focus {
    background-color: {$primary_hover};
    border-color: {$primary_hover};
    color: {$primary_color_hover};
    {$button_css}
}



.button-outline:hover,
.button-outline:active,
.button-outline.active,
.show > .button-outline.dropdown-toggle,
.button-outline-primary:hover,
.elementor-wpcf7-button-outline_primary input:hover[type="button"],
.elementor-wpcf7-button-outline_primary input:hover[type="submit"],
.elementor-wpcf7-button-outline_primary button:hover[type="submit"],
.mailchimp-button-outline_primary button:hover,
.mailchimp-button-outline_primary input:hover[type="submit"],
.button-outline-primary:active,
.elementor-wpcf7-button-outline_primary input:active[type="button"],
.elementor-wpcf7-button-outline_primary input:active[type="submit"],
.elementor-wpcf7-button-outline_primary button:active[type="submit"],
.mailchimp-button-outline_primary button:active,
.mailchimp-button-outline_primary input:active[type="submit"],
.button-outline-primary.active,
.elementor-wpcf7-button-outline_primary input.active[type="button"],
.elementor-wpcf7-button-outline_primary input.active[type="submit"],
.elementor-wpcf7-button-outline_primary button.active[type="submit"],
.mailchimp-button-outline_primary button.active,
.mailchimp-button-outline_primary input.active[type="submit"],
.show > .button-outline-primary.dropdown-toggle,
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="button"],
.elementor-wpcf7-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_primary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_primary .show > button.dropdown-toggle,
.mailchimp-button-outline_primary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_primary .elementor-button:hover,
.elementor-element .elementor-button-outline_primary .elementor-button:active,
.elementor-element .elementor-button-outline_primary .elementor-button:focus {
    {$button_css}
    {$font_style_code}
}



.btn-link,
.elementor-element .elementor-button-link .elementor-button,
.button-link,
.more-link,
.elementor-wpcf7-button-link input[type="button"][type="submit"],
.elementor-wpcf7-button-link input[type="submit"],
.elementor-wpcf7-button-link button[type="submit"],
.mailchimp-button-link button,
.mailchimp-button-link button[type="submit"],
.mailchimp-button-link input[type="submit"] {
   
    {$button_css}
    {$font_style_code}
}



.btn-link:hover,
.elementor-element .elementor-button-link .elementor-button:hover,
.button-link:hover,
.more-link:hover,
.elementor-wpcf7-button-link input:hover[type="submit"],
.elementor-wpcf7-button-link button:hover[type="submit"],
.mailchimp-button-link button:hover,
.mailchimp-button-link input:hover[type="submit"] {
    {$button_css}
    {$font_style_code}
}


CSS;
    return $cssCode;
}

add_filter('osf_customize_button_secondary_color', 'osf_typography_button_secondary_color', 10 , 11);
function osf_typography_button_secondary_color($cssCode, $secondary, $secondary_hover, $secondary_border, $secondary_border_hover, $secondary_color, $secondary_color_hover, $secondary_color_outline, $button_css, $font_style_code){
    $cssCode .= <<<CSS


.button-secondary,
.elementor-wpcf7-button-secondary input[type="button"][type="submit"],
.elementor-wpcf7-button-secondary input[type="submit"],
.elementor-wpcf7-button-secondary button[type="submit"],
.mailchimp-button-secondary button,
.mailchimp-button-secondary button[type="submit"],
.mailchimp-button-secondary input[type="submit"],
.elementor-button-secondary button[type="submit"],
.elementor-button-secondary input[type="button"],
.elementor-button-secondary input[type="submit"],
.elementor-element .elementor-button-secondary .elementor-button {
    background-color: {$secondary};
    border-color: {$secondary};
    color: {$secondary_color};
    {$button_css}
    {$font_style_code}
}



.button-secondary:hover,
.elementor-wpcf7-button-secondary input:hover[type="submit"],
.elementor-wpcf7-button-secondary button:hover[type="submit"],
.mailchimp-button-secondary button:hover,
.mailchimp-button-secondary input:hover[type="submit"],
.button-secondary:active,
.elementor-wpcf7-button-secondary input:active[type="submit"],
.elementor-wpcf7-button-secondary button:active[type="submit"],
.mailchimp-button-secondary button:active,
.mailchimp-button-secondary input:active[type="submit"],
.button-secondary.active,
.elementor-wpcf7-button-secondary input.active[type="submit"],
.elementor-wpcf7-button-secondary button.active[type="submit"],
.mailchimp-button-secondary button.active,
.mailchimp-button-secondary input.active[type="submit"],
.show > .button-secondary.dropdown-toggle,
.elementor-wpcf7-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-secondary .show > button.dropdown-toggle,
.mailchimp-button-secondary .show > input.dropdown-toggle[type="submit"],
.elementor-button-secondary button[type="submit"]:hover,
.elementor-button-secondary button[type="submit"]:active,
.elementor-button-secondary button[type="submit"]:focus,
.elementor-button-secondary input[type="button"]:hover,
.elementor-button-secondary input[type="button"]:active,
.elementor-button-secondary input[type="button"]:focus,
.elementor-button-secondary input[type="submit"]:hover,
.elementor-button-secondary input[type="submit"]:active,
.elementor-button-secondary input[type="submit"]:focus,
.elementor-element .elementor-button-secondary .elementor-button:hover,
.elementor-element .elementor-button-secondary .elementor-button:active,
.elementor-element .elementor-button-secondary .elementor-button:focus {
    background-color: {$secondary_hover};
    border-color: {$secondary_hover};
    color: {$secondary_color};
    {$button_css}
    {$font_style_code}
}



.button-outline-secondary:hover,
.elementor-wpcf7-button-outline_secondary input:hover[type="submit"],
.elementor-wpcf7-button-outline_secondary button:hover[type="submit"],
.mailchimp-button-outline_secondary button:hover,
.mailchimp-button-outline_secondary input:hover[type="submit"],
.button-outline-secondary:active,
.elementor-wpcf7-button-outline_secondary input:active[type="submit"],
.elementor-wpcf7-button-outline_secondary button:active[type="submit"],
.mailchimp-button-outline_secondary button:active,
.mailchimp-button-outline_secondary input:active[type="submit"],
.button-outline-secondary.active,
.elementor-wpcf7-button-outline_secondary input.active[type="submit"],
.elementor-wpcf7-button-outline_secondary button.active[type="submit"],
.mailchimp-button-outline_secondary button.active,
.mailchimp-button-outline_secondary input.active[type="submit"],
.show > .button-outline-secondary.dropdown-toggle,
.elementor-wpcf7-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-wpcf7-button-outline_secondary .show > button.dropdown-toggle[type="submit"],
.mailchimp-button-outline_secondary .show > button.dropdown-toggle,
.mailchimp-button-outline_secondary .show > input.dropdown-toggle[type="submit"],
.elementor-element .elementor-button-outline_secondary .elementor-button:hover,
.elementor-element .elementor-button-outline_secondary .elementor-button:active,
.elementor-element .elementor-button-outline_secondary .elementor-button:focus {
    {$button_css}
    {$font_style_code}
}


CSS;
    return $cssCode;
}
add_filter('osf_customize_typo_heading', 'osf_typography_custom_typo_heading', 10 , 2);
function osf_typography_custom_typo_heading($cssCode, $heading_css){
    $cssCode .= <<<CSS

.typo-heading,
.button-default,
.button-dark,
.elementor-element .elementor-button-dark .elementor-button,
.elementor-wpcf7-button-dark input[type="button"][type="submit"],
.elementor-wpcf7-button-dark input[type="submit"],
.elementor-wpcf7-button-dark button[type="submit"],
.mailchimp-button-dark button,
.mailchimp-button-dark button[type="submit"],
.mailchimp-button-dark input[type="submit"],
h1,
.site-title,
h2,
h3,
.page-header .page-title,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.tags-links .tags-title,
blockquote,
.breadcrumb,
.main-navigation .top-menu > li > a,
.vertical-navigation .vertical-navigation-header,
.entry-meta,
.tags-links a,
.post-navigation .nav-title,
.post-navigation .nav-link a,
.author-wrapper .author-name,
.comment-author,
.widget_recent_entries li.item-recent-post a,
.widget_recent_entries .post-date,
.widget_meta a,
.widget_pages a,
.widget_archive a,
.widget_categories a,
.widget_nav_menu a,
.widget_categories .cat-count,
.tagcloud a,
#secondary .elementor-widget-container h5:first-of-type,
.elementor-element .elementor-widget-wp-widget-recent-posts li.item-recent-post a,
.elementor-element .elementor-widget-wp-widget-recent-posts .post-date,
.contactform-content .form-title,
.elementor-cta__status-text,
.elementor-opal-countdown-wrapper .elementor-countdown-item:not(:first-child) .elementor-countdown-digits:before,
.elementor-featured-box-wrapper .elementor-featured-box-title,
.elementor-widget-heading .sub-title,
.elementor-portfolio__filter,
.elementor-price-table__price,
.elementor-price-table__period,
.elementor-progress-percentage,
.elementor-widget-progress .elementor-title,
.elementor-teams-wrapper .elementor-team-name {
    {$heading_css}
}


CSS;
    return $cssCode;
}
add_filter('osf_customize_typo_tertiary', 'osf_typography_custom_typo_tertiary', 10 , 2);
function osf_typography_custom_typo_tertiary($cssCode, $tertiary_css){
    $cssCode .= <<<CSS

.typo-tertiary,
.elementor-nav-menu--canvas {
    {$tertiary_css}
}


CSS;
    return $cssCode;
}
 
add_filter('osf_customize_typo_quaternary', 'osf_typography_custom_typo_quaternary', 10 , 2);
function osf_typography_custom_typo_quaternary($cssCode, $quaternary_css){
    $cssCode .= <<<CSS

.typo-quaternary {
    {$quaternary_css}
}


CSS;
    return $cssCode;
}
