<?php
/**
 * @package Ayyash
 * @author ThemeRox
 */

$rox_customizer_path = trailingslashit(get_template_directory()) . 'inc/customizer/';

require $rox_customizer_path . "defaults.php";
require $rox_customizer_path . "helpers.php";
require $rox_customizer_path . "google-fonts.php";

if (!class_exists('Rox_Customize')):

    /**
     * Contains methods for customizing the theme customization screen.
     *
     * @link http://codex.wordpress.org/Theme_Customization_API
     * @since MyTheme 1.0
     */
    class Rox_Customize
    {

        // Hold an instance of the class
        private static $instance;

        public function __construct()
        {

            // Setup the Theme Customizer settings and controls...
            
            add_action('customize_register', array($this, 'register'));

            // Output custom CSS to live site
            add_action('wp_head', array($this, 'header_output'));

            //enqueue required fonts
            add_action('wp_enqueue_scripts', array($this, 'enqueue_fonts'));

            // Enqueue live preview javascript in Theme Customizer admin screen
            add_action('customize_preview_init', array($this, 'live_preview'));

            add_action('customize_controls_enqueue_scripts', array($this, 'enqueue_scripts'));

            add_filter('body_class', array($this, 'body_classes'));

            add_action('roxtheme_rox_header_css', array($this, 'rox_header_css'));
        }

        /**
         * Returns an instance of the Rox_Customize class, creates one if an instance doesn't exist. Implements Singleton pattern
         *
         * @return Rox_Customize
         */
        public static function get_instance()
        {
            if (!isset(self::$instance)) {
                self::$instance = new self ();
            }

            return self::$instance;
        }

        // Temporary fix to prevent fatal errors
        public static function getInstance()
        {
            return self::get_instance();
        }

        /**
         * This hooks into 'customize_register' (available as of WP 3.4) and allows
         * you to add new sections and controls to the Theme Customize screen.
         *
         * Note: To enable instant preview, we have to actually write a bit of custom
         * javascript. See live_preview() for more.
         *
         * @see add_action('customize_register',$func)
         *
         * @param \WP_Customize_Manager $wp_customize
         *
         * @link http://ottopress.com/2012/how-to-leverage-the-theme-customizer-in-your-own-themes/
         * @since MyTheme 1.0
         */
        public static function register($wp_customize)
        {
            $rox_customizer_path = trailingslashit(get_template_directory()) . 'inc/customizer/';

            // Load all custom controls
            require $rox_customizer_path . "custom-controls/google-fonts-control.php";
            require $rox_customizer_path . "custom-controls/text-area-control.php";
            require $rox_customizer_path . "custom-controls/misc-control.php";
            require $rox_customizer_path . "custom-controls/multiple-checkbox-control.php";
            require $rox_customizer_path . "custom-controls/range-control.php";

            // Load all Customizer Panels
            require $rox_customizer_path . "panels/general.php";
            require $rox_customizer_path . "panels/layout.php";
            require $rox_customizer_path . "panels/background-images.php";
            require $rox_customizer_path . "panels/colors.php";
            require $rox_customizer_path . "panels/typography.php";
            require $rox_customizer_path . "panels/woocommerce.php";

            Rox_Customize_General::register($wp_customize);
            Rox_Customize_Layout::register($wp_customize);
            Rox_Customize_Background_Images::register($wp_customize);
            Rox_Customize_Colors::register($wp_customize);
            Rox_Customize_Typography::register($wp_customize);
            Rox_Customize_WooCommerce::register($wp_customize);
        }

        /**
         * This will output the custom WordPress settings to the live theme's WP head.
         *
         * Used by hook: 'wp_head'
         *
         * @see add_action('wp_head',$func)
         * @since MyTheme 1.0
         */
        public static function header_output()
        {
            ?>
            <!--Customizer CSS-->
            <style type="text/css">
                /* Custom CSS from Customizer Options for Pxlrtheme */
                <?php self::print_css(); ?>
                /* Custom CSS from Pxlrtheme Page Options */

                <?php
                    $css = rox_get_mod( 'custom_css' );
                    if( $css !== '' ) {
                        echo esc_textarea($css) ;
                    }
                ?>
            </style>
            <!--/Customizer CSS-->
            <?php
        }

        /**
         * This outputs the javascript needed to automate the live settings preview.
         * Also keep in mind that this function isn't necessary unless your settings
         * are using 'transport'=>'postMessage' instead of the default 'transport'
         * => 'refresh'
         *
         * Used by hook: 'customize_preview_init'
         *
         * @see add_action('customize_preview_init',$func)
         * @since MyTheme 1.0
         */
        public static function live_preview()
        {

            /*TO DO - Implement Live Preview using Javascript and postMessage Transport*/

            //wp_enqueue_script( 'roxtheme-customizer-preview', get_template_directory_uri() . '/inc/customizer/assets/js/customizer-preview.js', array(  'jquery' ), '', true );


        }

        public static function body_classes($classes)
        {
            global $post;

            $classes[] = 'ayyash';

            return $classes;
        }

        public static function rox_header_css()
        {
            $color = roxtheme_get_meta(array(), '_roxtheme_pb_menu');
            $hover_color = roxtheme_get_meta(array(), '_roxtheme_pb_menu_hover');
            ?>

            @media (min-width: 768px) {
            .transparent-header .main-header,
            .transparent-header .main-header a,
            .transparent-header .main-header .main-navigation .nav > li > a {
            color: <?php echo esc_attr($color); ?>;
            }

            .transparent-header .main-header a:hover,
            .transparent-header .main-header .main-navigation .nav > li > a:hover,
            .transparent-header .main-header .main-navigation .nav > li.current-menu-item > a,
            .transparent-header .main-header .main-navigation .nav > li.current-menu-parent > a {
            color: <?php echo esc_attr($hover_color); ?>;
            }

            .transparent-header .main-navigation .nav > li.current-menu-item, .main-navigation .nav > li.current-menu-parent{
            border-color: <?php echo roxtheme_get_meta(array(), '_roxtheme_pb_menu_active'); ?>!important;
            }
            }

            @media (max-width: 767px) {
            .transparent-header .main-header .navbar-toggle a{
            color: <?php echo esc_attr($color); ?>!important;
            }
            .transparent-header .main-header .navbar-toggle a:hover{
            color: <?php echo esc_attr($color); ?>!important;
            }
            .transparent-header .main-header .navbar-toggle a:hover.fa{
            color: <?php echo esc_attr($color); ?>!important;
            }
            }
            <?php
        }

        private static function build_hovericon_css($module)
        {
            $output = "#{$module['id']}.hover-icon .fa { background-color : {$module['hover_color']}; color: {$module['color']} ; box-shadow: 0 0 0 4px {$module['color']}; } \n";
            $output .= "#{$module['id']}.hover-icon .fa:hover { background-color : {$module['color']}; color: {$module['hover_color']} ; box-shadow: 0 0 0 8px {$module['color']}; } \n";

            return $output;
        }

        private static function build_section_css($section)
        {

            return "#{$section['id']} h1, #{$section['id']}  h2, #{$section['id']}  h3, #{$section['id']}  h4, #{$section['id']}  h5, #{$section['id']} h6, #{$section['id']} p { color: {$section['text_color']}; } ";
        }

        public function enqueue_scripts()
        {

            wp_enqueue_script('chosen', get_template_directory_uri() . '/assets/plugins/chosen/chosen.jquery.min.js', array(
                'jquery',
                'wp-color-picker'
            ), '', true);

            wp_enqueue_script('roxtheme-customizer', get_template_directory_uri() . '/inc/customizer/assets/js/customizer.js', array(), '', true);

            wp_localize_script('roxtheme-customizer', 'roxthemeCustomizerFontsL10n', rox_get_all_fonts());

            wp_enqueue_style('chosen', get_template_directory_uri() . '/assets/plugins/chosen/chosen.min.css');
        }

        public function enqueue_fonts()
        {

            $fonts = array(
                'typography_global_font_family' => rox_get_mod('typography_global_font_family'),
                'typography_global_font_variant' => rox_get_mod('typography_global_font_variant'),
                'typography_heading_h1_font_family' => rox_get_mod('typography_heading_h1_font_family'),
                'typography_heading_h1_font_variant' => rox_get_mod('typography_heading_h1_font_variant'),
                'typography_heading_h2_font_family' => rox_get_mod('typography_heading_h2_font_family'),
                'typography_heading_h2_font_variant' => rox_get_mod('typography_heading_h2_font_variant'),
                'typography_heading_h3_font_family' => rox_get_mod('typography_heading_h3_font_family'),
                'typography_heading_h3_font_variant' => rox_get_mod('typography_heading_h3_font_variant'),
                'typography_heading_h4_font_family' => rox_get_mod('typography_heading_h4_font_family'),
                'typography_heading_h4_font_variant' => rox_get_mod('typography_heading_h4_font_variant'),
                'typography_heading_h5_font_family' => rox_get_mod('typography_heading_h5_font_family'),
                'typography_heading_h5_font_variant' => rox_get_mod('typography_heading_h5_font_variant'),
                'typography_heading_h6_font_family' => rox_get_mod('typography_heading_h6_font_family'),
                'typography_heading_h6_font_variant' => rox_get_mod('typography_heading_h6_font_variant'),
                'typography_menu_font_family' => rox_get_mod('typography_menu_font_family'),
                'typography_menu_font_variant' => rox_get_mod('typography_menu_font_variant'),
                'typography_menu_sub_font_family' => rox_get_mod('typography_menu_sub_font_family'),
                'typography_menu_sub_font_variant' => rox_get_mod('typography_menu_sub_font_variant'),
                'typography_site_title_font_family' => rox_get_mod('typography_site_title_font_family'),
                'typography_site_title_font_variant' => rox_get_mod('typography_site_title_font_variant'),
                'typography_site_tagline_font_family' => rox_get_mod('typography_site_tagline_font_family'),
                'typography_site_tagline_font_variant' => rox_get_mod('typography_site_tagline_font_variant'),
                'typography_sidebar_title_font_family' => rox_get_mod('typography_sidebar_title_font_family'),
                'typography_sidebar_title_font_variant' => rox_get_mod('typography_sidebar_title_font_variant'),
                'typography_sidebar_body_font_family' => rox_get_mod('typography_sidebar_body_font_family'),
                'typography_sidebar_body_font_variant' => rox_get_mod('typography_sidebar_body_font_variant'),
                'typography_footer_title_font_family' => rox_get_mod('typography_footer_title_font_family'),
                'typography_footer_title_font_variant' => rox_get_mod('typography_footer_title_font_variant'),
                'typography_footer_body_font_family' => rox_get_mod('typography_footer_body_font_family'),
                'typography_footer_body_font_variant' => rox_get_mod('typography_footer_body_font_variant'),
                'typography_footer_text_font_family' => rox_get_mod('typography_footer_text_font_family'),
                'typography_footer_text_font_variant' => rox_get_mod('typography_footer_text_font_variant')
            );

            $used_fonts = array();
            $defaults = array_keys(rox_get_standard_fonts());

            foreach ($fonts as $key => $value) {
                if (rox_string_ends_with($key, '_family') && !empty($value) && !in_array($value, $defaults)) {
                    $variant = rox_get_default_mod(str_replace('_family', '_variant', $key), $fonts);
                    $used_fonts[$value] = array_key_exists($value, $used_fonts) ? (strpos($used_fonts[$value], $variant) !== false) ? $used_fonts[$value] : "$used_fonts[$value],$variant" : "$value:$variant";
                }
            }

            $protocol = is_ssl() ? 'https' : 'http';

            $query_args = array(
                'family' => str_replace(" ", "+", implode('|', array_values($used_fonts))),
                'subset' => implode(',', rox_get_mod('typography_options_subsets'))
            );

            wp_enqueue_style('roxtheme_google-fonts', add_query_arg($query_args, "$protocol://fonts.googleapis.com/css"), array(), null);

        }

        public static function print_css()
        {
            global $post;

            $accent_color = rox_get_mod('colors_global_accent');
            $accent_shade_color = rox_get_mod('colors_global_accent_shade');
            $border_color = rox_get_mod('colors_global_border');

            $title_text = rox_get_mod('colors_title_text');

            $footer_text = rox_get_mod('colors_footer_text');
            $footer_link = rox_get_mod('colors_footer_link');
            $footer_link_hover = rox_get_mod('colors_footer_link_hover');
            ?>

            .logo{
            height: <?php echo rox_get_mod('layout_header_height'); ?>px;
            }

            .logo{
            padding-right: <?php echo rox_get_mod('layout_header_logo_right_space'); ?>px;
            }

            .is-sticky.is-compact .logo{
            height: <?php echo rox_get_mod('layout_header_sticky_height'); ?>px;
            }

            .post.sticky,a.tag:hover,.button:hover, #submit:hover, .wpcf7-submit:hover,.button, #submit,
            input[type="submit"] {
            background: <?php echo rox_get_mod('colors_global_sticky_bg'); ?>
            }

            /* Theme/Text Colors */
            .pagination a,span a:hover,h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover, h6 a:hover, p a:hover,a:hover,a.tag:hover,.pagination.post-pagination a:hover{
                color : <?php echo esc_attr($accent_color) ?>
            }

            .entry-content blockquote, .action{
                border-left: 2px solid <?php echo esc_attr($border_color) ?>;
            }

            .hover-icon a.fa:hover{
                background: <?php echo esc_attr($accent_color) ?>;
                -webkit-box-shadow: 0 0 0 8px <?php echo esc_attr($accent_color) ?>;
                box-shadow: 0 0 0 8px <?php echo esc_attr($accent_color) ?>;
            }
            .entry-content blockquote,.action-icon.normal,.action, .pagination>.active>a, .pagination .current, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus, .main-navigation .nav > li.current-menu-item, .main-navigation .nav > li.current-menu-parent { border-color: <?php
            echo esc_attr($accent_color); ?> ; }
            .button, input[type="submit"],#submit,.wpcf7-submit,.action-icon.normal:after,.action-icon.normal:hover,.social-icon-container .social-icon:hover,.pagination .current,.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus, .roxtheme-gallery .roxtheme-gallery-thumb .fa,.cd-top  { background-color: <?php
            echo esc_attr($accent_color); ?> ; }
            .dokan-dashboard-wrap .dokan-btn, .dokan-btn-theme, .dokan-store-support-btn, .dokan-share-btn,.dokan-dashboard .dokan-dash-sidebar ul.dokan-dashboard-menu li.active, .dokan-dashboard .dokan-dash-sidebar ul.dokan-dashboard-menu li:hover, .dokan-dashboard .dokan-dash-sidebar ul.dokan-dashboard-menu li.dokan-common-links a:hover{ background-color: <?php echo esc_attr($accent_color); ?> !important; }
            .dokan-dashboard-wrap .dokan-btn, .dokan-btn-theme, .dokan-store-support-btn, .dokan-share-btn{ border-color: <?php echo esc_attr($accent_color); ?> !important; }
            span a, p a,a,a.tag,.pagination a,.action-icon.normal, .pagination>li>a, .pagination>li>span, .main-navigation .nav > li.current-menu-item > a, .main-navigation .nav > li.current-menu-parent > a { color: <?php
            echo esc_attr($accent_color); ?> ; }
            span a:hover,h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover,p a:hover,a:hover,a.tag:hover,.pagination a,.pagination.post-pagination a:hover,.pagination.post-pagination a:hover h4,.action-icon.normal, .pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { color: <?php
            echo esc_attr($accent_shade_color); ?> ; }
            .button:hover, input[type="submit"]:hover, input[type="submit"]:active, #submit:hover, .wpcf7-submit:hover, #submit:active, .wpcf7-submit:active, .button-:active  { -webkit-box-shadow: 0 0 5px <?php
            echo esc_attr($accent_shade_color); ?>; box-shadow: 0 0 5px <?php
            echo esc_attr($accent_shade_color); ?>; background: <?php
            echo esc_attr($accent_shade_color); ?> ; }

            #content textarea, .wpcf7 textarea, #content select, .wpcf7 select, #content input[type="text"], .wpcf7 input[type="text"], #content input[type="password"], .wpcf7 input[type="password"], #content input[type="datetime"], .wpcf7 input[type="datetime"], #content input[type="datetime-local"], .wpcf7 input[type="datetime-local"], #content input[type="date"], .wpcf7 input[type="date"], #content input[type="month"], .wpcf7 input[type="month"], #content input[type="time"], .wpcf7 input[type="time"], #content input[type="week"], .wpcf7 input[type="week"], #content input[type="number"], .wpcf7 input[type="number"], #content input[type="email"], .wpcf7 input[type="email"], #content input[type="url"], .wpcf7 input[type="url"], #content input[type="search"], .wpcf7 input[type="search"], #content input[type="tel"], .wpcf7 input[type="tel"], #content input[type="color"], .wpcf7 input[type="color"], .entry-content blockquote, .action, a .action-icon, .action-icon, .post-grid, .recent-post, #comments .post-comments-form textarea, #comments .post-comments-form input[type=text], #comments #post-comments-form textarea, #comments #post-comments-form input[type=text], #content article.error404 .search input, #menu-item-search form input, .main-sidebar .search input {  background-color: <?php
            echo rox_get_mod('colors_global_alt'); ?> ;  }
            #content textarea, .wpcf7 textarea, #content select, .wpcf7 select, #content input[type="text"], .wpcf7 input[type="text"], #content input[type="password"], .wpcf7 input[type="password"], #content input[type="datetime"], .wpcf7 input[type="datetime"], #content input[type="datetime-local"], .wpcf7 input[type="datetime-local"], #content input[type="date"], .wpcf7 input[type="date"], #content input[type="month"], .wpcf7 input[type="month"], #content input[type="time"], .wpcf7 input[type="time"], #content input[type="week"], .wpcf7 input[type="week"], #content input[type="number"], .wpcf7 input[type="number"], #content input[type="email"], .wpcf7 input[type="email"], #content input[type="url"], .wpcf7 input[type="url"], #content input[type="search"], .wpcf7 input[type="search"], #content input[type="tel"], .wpcf7 input[type="tel"], #content input[type="color"], .wpcf7 input[type="color"], .entry-content blockquote, .action, a .action-icon, .action-icon, .post-grid, .recent-post, #comments .post-comments-form textarea, #comments .post-comments-form input[type=text], #comments #post-comments-form textarea, #comments #post-comments-form input[type=text], #content article.error404 .search input, #menu-item-search form input, .main-sidebar .search input {  color: <?php
            echo rox_get_mod('colors_global_alt_text'); ?> ;  }
            #content textarea, .wpcf7 textarea, #content select, .wpcf7 select, #content input[type="text"], .wpcf7 input[type="text"], #content input[type="password"], .wpcf7 input[type="password"], #content input[type="datetime"], .wpcf7 input[type="datetime"], #content input[type="datetime-local"], .wpcf7 input[type="datetime-local"], #content input[type="date"], .wpcf7 input[type="date"], #content input[type="month"], .wpcf7 input[type="month"], #content input[type="time"], .wpcf7 input[type="time"], #content input[type="week"], .wpcf7 input[type="week"], #content input[type="number"], .wpcf7 input[type="number"], #content input[type="email"], .wpcf7 input[type="email"], #content input[type="url"], .wpcf7 input[type="url"], #content input[type="search"], .wpcf7 input[type="search"], #content input[type="tel"], .wpcf7 input[type="tel"], #content input[type="color"], .wpcf7 input[type="color"],article.post-normal .post-image-dummy, article.page .post-image-dummy, .post .post-image-dummy, .post-half .post-image-dummy,.post-grid, .recent-post,#comments .post-comments-form textarea, #comments .post-comments-form input[type=text], #comments #post-comments-form textarea, #comments #post-comments-form input[type=text],.entry-content table,h2.section-head,article.post-normal,hr.fancy,#content article.error404 .search input,.main-header,.main-header.mobile .main-navigation .nav li:hover a,.main-header.mobile .main-navigation .nav a,.main-header.mobile .main-navigation .navbar-collapse.collapse,.main-navigation ul > li ul,#menu-item-search .dropdown-menu,#title-container,.post-image .empty-image,.pagination.post-pagination,#comments #reply-title,#comments li,#comments li li,#comments .post-comments-heading h3,#about-author,.main-sidebar .widget_nav_menu li,.main-sidebar .widget_nav_menu li ul.children,.main-sidebar .widget_categories li,.main-sidebar .widget_archive li,.main-sidebar .widget_archive li ul.children,.main-sidebar .widget_pages li,.main-sidebar .widget_pages li ul.children,.main-sidebar .widget_meta li,.main-sidebar .widget_meta li ul.children,.main-sidebar .widget_recent_comments li,.main-sidebar .widget_recent_comments li ul.children,.main-sidebar .widget_rss li,.main-sidebar .widget_rss li ul.children,.main-sidebar .widget_recent_entries li,.main-sidebar .widget_recent_entries li ul.children,.portfolio-grid-alt-bg,.pagination.post-pagination .previous,.gallery-container .gallery-item, #menu-item-search form input{  border-color: <?php
            echo esc_attr($border_color); ?> ;}
            #menu-item-search form .arrow-up:before { border-bottom-color: <?php
            echo esc_attr($border_color); ?> }
            .fancy{ background-image: linear-gradient(left, white, <?php
            echo esc_attr($border_color); ?> , white); }
            @media (max-width: 767px) { .main-navigation .nav{    border-color: <?php
            echo esc_attr($accent_color); ?> ;  }}

            .main-sidebar .sidebar-widget .widget-title:after{
                background : <?php echo esc_attr($accent_color); ?>
            }

            h1,h2,h3,h4,h5,h6, h1 a,h2 a,h3 a,h4 a,h5 a,h6 a, .pagination.post-pagination a{ color: <?php
            echo rox_get_mod('colors_global_heading'); ?> ; }
            body {color: <?php
            echo rox_get_mod('colors_global_text'); ?> ; }
            .post-categories:before, .post-tags:before, article.post-normal .entry-meta, article.page .entry-meta, .post .entry-meta, .post-half .entry-meta, .post-date, .main-sidebar .widget_nav_menu li:before, .main-sidebar .widget_categories li:before, .main-sidebar .widget_archive li:before, .main-sidebar .widget_pages li:before, .main-sidebar .widget_meta li:before, .main-sidebar .widget_recent_comments li:before, .main-sidebar .widget_rss li:before, .main-sidebar .widget_recent_entries li:before, .comment-meta .fa { color: <?php
            echo rox_get_mod('colors_global_text_alt'); ?> ; }

            p{line-height:<?php echo rox_get_mod('typography_global_line_height') ?>em}

            .boxed { background-color: <?php
            echo rox_get_mod('colors_global_site_bg'); ?> ; }
            #content { background-color: <?php
            echo rox_get_mod('colors_global_content_bg'); ?> ; }

            .main-header{
            background-color: <?php echo rox_get_mod('colors_header_bg'); ?> ;
            border-color: <?php echo rox_get_mod('colors_header_border'); ?> ;
            }

            <?php if (rox_get_mod('layout_header_menu_alignment') == 'right') { ?>
            .main-navigation{
            float:right
            }
        <?php } ?>

            /** Secondary Header **/

            .secondary-header{
            color: <?php echo rox_get_mod('colors_header2_text') ?>;
            background-color: <?php echo rox_get_mod('colors_header2_bg') ?>;
            border-top-color: <?php echo rox_get_mod('colors_header2_border_top') ?>;
            border-bottom-color: <?php echo rox_get_mod('colors_header2_border_bottom') ?>;
            }
            .secondary-header .social-icon-container .social-icon { color: <?php
            echo rox_get_mod('colors_header2_sc_si') ?>; }
            .secondary-header .social-icon-container .social-icon:hover { color: <?php
            echo rox_get_mod('colors_header2_sc_si_hover'); ?>; background-color: <?php
            echo rox_get_mod('colors_header2_sc_si_hover_bg'); ?>;}

            /** Main Navigation **/

            #site-nav{
            padding-top: <?php echo rox_get_mod('layout_header_menu_top_padding'); ?>px;
            }

            #site-nav ul li ul{
            width: <?php echo rox_get_mod('layout_header_submenu_width'); ?>px;
            }

            #site-nav ul li ul.sub-menu li{
            text-align: <?php echo rox_get_mod('layout_header_submenu_alignment'); ?>
            }

            #site-nav > ul > li{
            line-height: <?php echo rox_get_mod('layout_header_menu_height'); ?>px;
            }

            #site-nav > ul.main-navigation > li > ul.sub-menu{
            border-top: 1px solid <?php
            echo rox_get_mod('colors_menu_hover'); ?> ;
            }

            .main-header, .main-header a{
            color:<?php echo rox_get_mod('colors_menu_text'); ?>;
            }

            .main-header a.btn{
                background : <?php echo rox_get_mod('colors_menu_button_bg'); ?>;
                color : <?php echo rox_get_mod('colors_menu_button_text'); ?>;
            }

            .main-header a.btn:hover{
                background: <?php echo rox_get_mod('colors_menu_button_bg_hover'); ?>;
                color: <?php echo rox_get_mod('colors_menu_button_text_hover'); ?>;
            }

            #site-nav .current-menu-ancestor > .rox-link,
            #site-nav .current-menu-item > .rox-link,
            #site-nav > ul > li > .rox-link:hover ,
            .main-header a:hover{ color: <?php
            echo rox_get_mod('colors_menu_hover'); ?> ; }

            #site-nav ul li ul.sub-menu li .rox-link{
            padding:<?php echo rox_get_mod('layout_header_submenu_tb_padding'); ?>px <?php echo rox_get_mod('layout_header_submenu_lr_padding'); ?>px;
            color:<?php echo rox_get_mod('colors_menu_sub_text'); ?>;
            border-color:<?php echo rox_get_mod('colors_menu_sub_border'); ?>;
            }

            #site-nav .current-menu-ancestor .current-menu-item > .rox-link,
            #site-nav ul li ul.sub-menu li .rox-link:hover{
            color:<?php echo rox_get_mod('colors_menu_sub_hover'); ?>;
            background:<?php echo rox_get_mod('colors_menu_sub_hover_bg'); ?>;
            }

            #site-nav ul li ul.sub-menu li,#site-nav > ul > li > ul, #site-nav ul li ul.sub-menu{
            background:<?php echo rox_get_mod('colors_menu_sub_bg'); ?>;
            }

            .is-sticky.is-compact #site-nav{
            padding-top: <?php echo rox_get_mod('layout_header_sticky_menu_top_padding'); ?>px;
            }

            .is-sticky.is-compact #site-nav > ul > li{
            line-height: <?php echo rox_get_mod('layout_header_sticky_menu_height'); ?>px;
            }

            #site-nav ul li.rox-depth-0 > ul.sub-menu:after {
                border-bottom: 8px solid <?php echo rox_get_mod( 'colors_menu_sub_hover_bg' );  ?>;
            }

            ul.sub-menu:after{
                background: <?php echo esc_attr(rox_get_mod( 'colors_menu_sub_hover_bg' )) ?>;
            }

            .main-navigation .nav > li > a, .main-navigation .navbar-toggle { color: <?php
            echo rox_get_mod('colors_menu_text'); ?> ; }
            .main-navigation .nav > li:hover > a { color: <?php
            echo rox_get_mod('colors_menu_hover'); ?> ; }
            .main-navigation .nav .dropdown-menu a { color: <?php
            echo rox_get_mod('colors_menu_sub_text'); ?> ; }
            .main-navigation .nav .dropdown-menu li:hover > a { color: <?php
            echo rox_get_mod('colors_menu_sub_hover'); ?> ; }
            .main-navigation .nav .dropdown-menu { border-color: <?php
            echo rox_get_mod('colors_menu_sub_border'); ?>  ; background-color: <?php
            echo rox_get_mod('colors_menu_sub_bg'); ?> ; }
            .main-navigation .nav .dropdown-menu li:hover > a, .main-navigation .nav .dropdown-menu li:focus > a, .main-navigation .nav .dropdown-menu li.current-menu-item a, .main-navigation .nav .dropdown-menu li.current-menu-ancestor > a { background-color: <?php
            echo rox_get_mod('colors_menu_sub_hover_bg'); ?> ; color: <?php
            echo rox_get_mod('colors_menu_sub_hover'); ?> ; }

            @media (max-width: 767px) {
            .main-header .main-navigation .navbar-collapse{
            background-color: <?php echo rox_get_mod('colors_menu_mob_bg'); ?> !important;
            }
            .main-header .main-navigation .nav li a {
            color: <?php echo rox_get_mod('colors_menu_mob'); ?> !important;
            }
            .main-header .main-navigation .nav li a:hover, .main-navigation .nav .dropdown-menu li:hover > a, .main-navigation .nav .dropdown-menu li:focus > a, .main-navigation .nav .dropdown-menu li.current-menu-item a, .main-navigation .nav .dropdown-menu li.current-menu-ancestor > a {
            color: <?php echo rox_get_mod('colors_menu_mob_hover'); ?> !important;
            background-color: transparent !important;
            }
            .main-navigation .nav > li.current-menu-item, .main-navigation .nav > li.current-menu-parent{
            border-color: transparent !important;
            }
            .main-navigation .nav .dropdown-menu{
            background-color: transparent !important;
            }
            }

            /** Mobile Navigation **/
            #navigation-mobile{background-color: <?php echo rox_get_mod('colors_menu_mob_bg'); ?>;}

            #navigation-mobile ul li a,
            #navigation-mobile .rox-dropdown-plus {
            color: <?php echo rox_get_mod('colors_menu_color'); ?>;
            }

            #navigation-mobile ul li a:hover,
            #navigation-mobile .current-menu-ancestor > a,
            #navigation-mobile .current-menu-item > a{
            color: <?php echo rox_get_mod('colors_menu_mob_hover'); ?>;
            background-color: <?php echo rox_get_mod('colors_menu_mob_hover_bg'); ?>;
            }

            #navigation-mobile ul ul.sub-menu{
            background-color: <?php echo rox_get_mod('colors_menu_mob_sub_bg'); ?>;
            }

            #navigation-mobile ul li, #navigation-mobile ul li:last-child{
            border-color: <?php echo rox_get_mod('colors_menu_mob_border'); ?>;
            }

            #navigation-mobile ul ul li:first-child{
            border-color: <?php echo rox_get_mod('colors_menu_mob_border'); ?>;
            }

            #navigation-mobile ul ul::before{
            border-top-color: <?php echo rox_get_mod('colors_menu_mob_border'); ?>;
            }

            #mobile-search input{
            background-color: <?php echo rox_get_mod('colors_menu_mob_bg'); ?>;
            border: 1px solid <?php echo rox_get_mod('colors_menu_mob_border'); ?>;
            color: <?php echo rox_get_mod('colors_menu_color'); ?>;
            }

            #mobile-search input:focus,#mobile-search input:hover{
            background-color: <?php echo rox_get_mod('colors_menu_mob_hover_bg'); ?>;
            color: <?php echo rox_get_mod('colors_menu_mob_hover'); ?>;
            }


            .main-sidebar .sidebar-widget,.post-half,.pagination>li>a, .pagination>li>span,table td,table th,.main-sidebar .sidebar-widget .widget-title,.woocommerce-cart .woocommerce table.shop_table th{
                border-color : <?php echo esc_url($border_color) ?>
            }

            #title-container { background-color: <?php
            echo rox_get_mod('colors_title_bg'); ?> ; color: <?php
            echo esc_attr($title_text); ?> ; border-color: <?php
            echo rox_get_mod('colors_title_border'); ?> ; }
            #title-container h3 { color: <?php
            echo esc_attr($title_text); ?> ;}

            #title-container ul li a { color: <?php
            echo esc_attr($title_text); ?> ; }

            .rox-services .service-icon {color: <?php
            echo rox_get_mod('colors_footer_top_icon'); ?> ;}
            .rox-services .service-description h3 {color: <?php
            echo rox_get_mod('colors_footer_top_title'); ?> ;}
            .rox-services .service-description p {color: <?php
            echo rox_get_mod('colors_footer_top_desc'); ?> ;}


            .main-footer{ background-color: <?php
            echo rox_get_mod('colors_footer_bg'); ?> ; color: <?php
            echo esc_attr($footer_text); ?> ; border-color: <?php
            echo rox_get_mod('colors_footer_top_border'); ?> ;}
            .main-footer h1, .main-footer h2, .main-footer h3, .main-footer h6 { color: <?php
            echo rox_get_mod('colors_footer_heading'); ?> ;}
            .main-footer p, .main-footer li { color: <?php
            echo esc_attr($footer_text); ?> ; }
            .main-footer a, .main-footer li a{ color: <?php
            echo esc_attr($footer_link); ?> ; }
            .main-footer a:hover, .main-footer li a:hover{ color: <?php
            echo esc_attr($footer_link_hover); ?> ; }
            .main-footer li, .main-footer li:last-child { border-color: <?php
            echo rox_get_mod('colors_footer_border'); ?> ; }
            .copyright{ background-color: <?php
            echo rox_get_mod('colors_footer_sc_bg'); ?> ; color: <?php
            echo rox_get_mod('colors_footer_sc_text'); ?> ; }
            .copyright a{ color: <?php echo rox_get_mod('colors_footer_sc_link'); ?> ; }
            .copyright a:hover{ color: <?php echo rox_get_mod('colors_footer_sc_link_hover'); ?> ; }
            .copyright .social-icon-container .social-icon { color: <?php
            echo rox_get_mod('colors_footer_sc_si') ?>; }
            .copyright .social-icon-container .social-icon:hover { color: <?php
            echo rox_get_mod('colors_footer_sc_si_hover'); ?>; background-color: <?php
            echo rox_get_mod('colors_footer_sc_si_hover_bg'); ?>;}


            /* Typography */
            body, .tooltip { <?php
            rox_font_settings('typography_global') ?> }
            h1 { <?php
            rox_font_settings('typography_heading_h1') ?> }
            h2 {  <?php
            rox_font_settings('typography_heading_h2') ?> }
            h3 { <?php
            rox_font_settings('typography_heading_h3') ?> }
            h4 {  <?php
            rox_font_settings('typography_heading_h4') ?> }
            h5 { <?php
            rox_font_settings('typography_heading_h5') ?> }
            h6 {  <?php
            rox_font_settings('typography_heading_h6') ?> }

            #site-nav > ul > li > .rox-link {  <?php
            rox_font_settings('typography_menu') ?> }

            #site-nav ul li ul li .rox-link {  <?php
            rox_font_settings('typography_menu_sub') ?> }

            .site-title { <?php
            rox_font_settings('typography_site_title') ?> }
            .site-description { <?php
            rox_font_settings('typography_site_tagline') ?> }
            #title-container ul li{ line-height: <?php
            echo rox_get_mod('typography_heading_h3_font_size') * rox_get_mod('typography_heading_h3_line_height') ?>px; }
            .main-sidebar .sidebar-widget { <?php
            rox_font_settings('typography_sidebar_body') ?>
            }
            .main-sidebar .sidebar-widget .widget-title { <?php
            rox_font_settings('typography_sidebar_title') ?> }
            .main-sidebar { <?php
            rox_font_settings('typography_footer_body') ?> }
            .main-footer h1, .main-footer h2, .main-footer h3 { <?php
            rox_font_settings('typography_footer_title') ?> }
            .copyright { <?php
            rox_font_settings('typography_footer_text') ?> }

            .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,.woocommerce nav.woocommerce-pagination ul li span.current,
            .product-thumb .product-actions .yith-wcqv-button:hover .rox-tooltip, .product-thumb .product-actions .compare-button:hover .rox-tooltip, .woocommerce .yith-wcwl-add-to-wishlist a:hover .sr-only, .woocommerce .yith-wcwl-add-to-wishlist a:hover .rox-tooltip, .rox-products .product-thumb .product-actions .cart-btn:hover > span{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }

            .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,.woocommerce nav.woocommerce-pagination ul li a:hover,
            .product-thumb .product-actions .yith-wcqv-button:hover .rox-tooltip:hover, .product-thumb .product-actions .compare-button:hover .rox-tooltip:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .rox-tooltip:before, .rox-products a.cart-btn.button>span:before{
                border-left-color: <?php echo esc_attr($accent_color); ?>
            }

            .rox-products a.cart-btn.button>span:hover:before,.rox-tooltip:hover:before{
                border-left-color: <?php echo esc_attr($accent_shade_color); ?>
            }

            .woocommerce .rox-products > li > .product:hover .product-actions a.cart-btn span,.yith_woocompare_colorbox table.compare-list .add-to-cart td a,yith_woocompare_colorbox table.compare-list .add-to-cart td a,
            .select2-container--default .select2-results__option--highlighted[aria-selected],
            .select2-container--default .select2-results__option--highlighted[data-selected],.entry-footer .edit-link a,.social-icon-container .social-icon:hover,.cd-top,input#rememberme[type="checkbox"]:checked:before,
            .yith_woocompare_colorbox table.compare-list .add-to-cart td a,{
                background-color: <?php echo esc_attr($accent_color); ?>
            }


            .woocommerce a.button:hover,.rox-products .product-thumb .product-actions .yith-wcwl-add-to-wishlist:hover,.yith_woocompare_colorbox table.compare-list .remove td a .remove:hover,.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,{
                background-color : <?php echo esc_attr($accent_shade_color); ?>
            }

            .rox-products .product-thumb .product-actions .yith-wcqv-button:hover,
            .rox-products .product-thumb .product-actions .compare-button .button:hover,
            .woocommerce .rox-product-item .cart-btn:hover,.rox-products .product-thumb .product-actions .yith-wcwl-add-to-wishlist:hover,
            #content input[type="number"]:focus,
            .wpcf7 input[type="number"]:focus,#content input[type="tel"]:focus, .wpcf7 input[type="tel"]:focus,#content textarea:focus, .wpcf7 textarea:focus,
            #content input[type="email"]:focus,
            .wpcf7 input[type="email"]:focus,p.woocommerce-form-row input:focus{

                border-color : <?php echo esc_attr($accent_shade_color); ?>

            }

            .woocommerce table.shop_table,.woocommerce table.shop_table td,.woocommerce #content table.cart td.actions .input-text, .woocommerce table.cart td.actions .input-text, .woocommerce-page #content table.cart td.actions .input-text, .woocommerce-page table.cart td.actions .input-text,.woocommerce-cart .cart-collaterals .cart_totals tr td,span.select2-selection.select2-selection--single,.single-product .summary .share-product > ul > li > a,.single-product .summary .compare.button,.single-product div.product .woocommerce-tabs ul.tabs,.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover,
            .woocommerce-MyAccount-content,nav.woocommerce-MyAccount-navigation ul,.woocommerce nav.woocommerce-pagination ul{
                border-color: <?php echo esc_attr($border_color)?>
            }

            .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected],.woocommerce nav.woocommerce-pagination ul li a:focus,
            .woocommerce nav.woocommerce-pagination ul li a:hover,
            .woocommerce nav.woocommerce-pagination ul li span.current{
                background-color : <?php echo esc_attr($accent_color) ?>
            }


            .woocommerce .rox-products > li > .product:hover .product-actions a.cart-btn:hover,
            .woocommerce .rox-products > li > .product:hover .product-actions a.cart-btn:hover span:hover{
                background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .woocommerce .comment-form-rating p.stars a:focus,#yith-quick-view-modal #yith-quick-view-close:hover,.yith_woocompare_colorbox table.compare-list .remove td a .remove,#yith-quick-view-close,a.shipping-calculator-button:focus, a.shipping-calculator-button:hover,
            .yith_woocompare_colorbox table.compare-list .remove td a .remove,
            .yith_woocompare_colorbox table.compare-list .remove td a .remove:hover,.woocommerce table.shop_table td.product-name:hover a{
                color : <?php echo esc_attr($accent_shade_color); ?>
            }

            .woocommerce-cart .woocommerce-cart-form tr.woocommerce-cart-form__cart-item{
            border-bottom: 1px solid <?php echo esc_attr($border_color)?>;
            }

            .qty-btn{
                border: 1px solid  <?php echo esc_attr($border_color)?>;
            }

            .cart_totals{
                border: 1px solid  <?php echo esc_attr($border_color)?>;
            }

            .woocommerce table.shop_table tfoot th,.woocommerce table.shop_table tfoot td{
                border-top: 1px solid <?php  echo esc_attr($border_color)?>;
            }

            .woocommerce-info{
                border-top-color : <?php  echo esc_attr($accent_color)?>;
            }

            .woocommerce-info::before,.woocommerce-cart .product-subtotal .woocommerce-Price-amount{
                color: <?php  echo esc_attr($accent_color)?>;
            }


            input#ship-to-different-address-checkbox[type="checkbox"]:checked:before{
                background : <?php echo esc_attr($accent_color)  ?>
            }

            #content input[type="text"]:focus, .wpcf7 input[type="text"]:focus{
            border-color: <?php echo esc_attr($accent_color)?>
            }

            .woocommerce-cart-tab{
                border-color : <?php echo esc_attr($border_color) ?>
            }


            .woocommerce #respond input#submit.alt.disabled,
            .woocommerce #respond input#submit.alt.disabled:hover,
            .woocommerce #respond input#submit.alt:disabled,
            .woocommerce #respond input#submit.alt:disabled:hover,
            .woocommerce #respond input#submit.alt:disabled[disabled],
            .woocommerce #respond input#submit.alt:disabled[disabled]:hover,
            .woocommerce a.button.alt.disabled, .woocommerce a.button.alt.disabled:hover,
            .woocommerce a.button.alt:disabled,
            .woocommerce a.button.alt:disabled:hover,
            .woocommerce a.button.alt:disabled[disabled],
            .woocommerce a.button.alt:disabled[disabled]:hover,
            .woocommerce button.button.alt.disabled,
            .woocommerce button.button.alt.disabled:hover,
            .woocommerce button.button.alt:disabled,
            .woocommerce button.button.alt:disabled:hover,
            .woocommerce button.button.alt:disabled[disabled],
            .woocommerce button.button.alt:disabled[disabled]:hover,
            .woocommerce input.button.alt.disabled,
            .woocommerce input.button.alt.disabled:hover,
            .woocommerce input.button.alt:disabled,
            .woocommerce input.button.alt:disabled:hover,
            .woocommerce input.button.alt:disabled[disabled],
            .woocommerce input.button.alt:disabled[disabled]:hover,.woocommerce div.product .woocommerce-tabs ul.tabs li.active,.woocommerce-cart-tab,
            .single-product .summary .yith-wcwl-wishlistexistsbrowse a:hover,
            .single-product .summary .yith-wcwl-wishlistaddedbrowse a:hover,
            .single-product .summary .share-product > ul > li > a:hover,
            .single-product .summary .compare.button:hover,
            .single-product .summary .yith-wcwl-add-button a.add_to_wishlist:hover,
            .woocommerce .widget_price_filter .ui-slider .ui-slider-handle,
            .woocommerce .widget_price_filter .ui-slider .ui-slider-range,
            .woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content,
            .woocommerce-store-notice, p.demo_store{
                background-color: <?php echo esc_attr($accent_color) ?> !important;
            }


            .woocommerce nav.woocommerce-pagination ul{
                border-color : <?php echo esc_attr($accent_color); ?>
            }

            #menu-main-menu .btn, .header-cart span.bage, .btn.header-login, .cta-btn-2{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }

            .single-club-pricing .popular, .popular, h3.featured:after, .dwqa-ask-question a, .woocommerce-cart-form input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }

            .cta-btn-1{
            border: 1px solid <?php echo esc_attr($accent_color); ?>;
            }
            .cta-btn-list .cta-btn-1:hover{
            background: <?php echo esc_attr($accent_shade_color); ?>;
            border: 1px solid <?php echo esc_attr($accent_shade_color); ?>;
            }
            #menu-main-menu .btn:hover, .btn.header-myaccount:hover, .btn.header-login:hover, button.single_add_to_cart_button:hover, .pricing-section-cart-btn button.single_add_to_cart_button:hover, .woocommerce button.button.alt:hover, .dwqa-ask-question a:hover, .woocommerce-cart-form input.button:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .cta-btn-2:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .pricing-club-tab>li.active>a, .pricing-club-tab>li.active>a:focus, .pricing-club-tab>li.active>a:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>;
            border: 1px solid <?php echo esc_attr($accent_shade_color); ?>
            }
            .pricing-club-tab>li>a , .right-cart-bar .cart-btn a{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }
            .nav.pricing-club-tab>li>a:hover,.right-cart-bar .cart-btn a:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>

            }

            .doc-box-wrap .documentation-btn:hover{
            border-color: <?php echo esc_attr($accent_shade_color); ?>;
            }
            .doc-box-wrap .btn:hover,.woocommerce a.remove:hover,.woocommerce .rox-products .add_to_wishlist:hover,.woocommerce .rox-product-item .star-rating span,
            .woocommerce .rox-product-item .star-rating::before{
            color:<?php echo esc_attr($accent_shade_color); ?>;
            }

            .pricing-section .popular-package .single-pricing-section{
            border: 1px solid <?php echo esc_attr($accent_color); ?>;
            }

            .section-header h3.header-title span, .highlight-text-one{
            color:<?php echo esc_attr($accent_color); ?>;
            }

            .faq-heading h3 i, .icolor-2 i, .item-color-2{
            color: <?php echo esc_attr($accent_color); ?>;
            }

            .right-cart-bar h4{
            border-bottom: 1px dashed <?php echo esc_attr($accent_color); ?>;
            }

            .right-cart-bar h4.cart-total{
            border-top: 1px dashed <?php echo esc_attr($accent_color); ?>;
            }
            .single-club-pricing.popular-package ul{
            border: 1px solid <?php echo esc_attr($accent_color); ?>;
            }

            .price-slider .btn.month, .price-slider .btn.term{
            border: 1px solid <?php echo esc_attr($accent_color); ?>;
            }

            .price-slider .btn.month.active-month, .price-slider .btn.term.active-term, .order-submit-btn .btn.proceed-btn{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }

            .order-submit-btn .btn.proceed-btn:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .swal-overlay .swal-footer .swal-button{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }
            .swal-overlay .swal-footer .swal-button:hover{
            background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .swal-overlay .swal-footer .swal-button--cancel, .order-submit-btn-two .reset-btn{
            background-color:<?php echo esc_attr($accent_shade_color); ?>
            }

            .swal-overlay .swal-footer .swal-button--cancel:hover, .order-submit-btn-two .reset-btn:hover{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }

            input[type=checkbox]:checked:before{
            color:<?php echo esc_attr($accent_color); ?>;
            }
            input[type=radio]:checked{
            background-color:<?php echo esc_attr($accent_color); ?>;
            }


            .product-addon-totals dd:last-child{
            border: 1px dashed <?php echo esc_attr($accent_color); ?>;
            border-width: 1px 0;
            }

            /* Common Style */

            .owl-theme .owl-dots .owl-dot.active span,
            .owl-theme .owl-dots .owl-dot:hover span {
              background: <?php echo esc_attr($accent_color); ?>;
            }

            .owl-theme .owl-dots .owl-dot span{
                border : 1px solid <?php echo esc_attr($accent_color); ?>;
            }

            .sidebar-widget a{
                color : <?php echo rox_get_mod('colors_global_text') ?>
            }

            .sidebar-widget a:hover{
                color: <?php echo esc_attr($accent_color); ?>;
            }

            /* Container Fluid Width */

            <?php if (rox_get_mod('layout_global_content_layout_max_width')) { ?>
                .container-fluid{
                max-width: <?php echo esc_attr(rox_get_mod('layout_global_content_layout_max_width')) ?>px
                }
            <?php } ?>

            <?php if (rox_get_mod('layout_global_content_layout_min_width')) { ?>
                .container{
                min-width: <?php echo esc_attr(rox_get_mod('layout_global_content_layout_min_width')) ?>px
                }
            <?php } ?>


            /* Footer */
            .main-footer .widget_rox_widget_social_share ul li i{
                background: <?php echo esc_attr($footer_link_hover) ?>;
                border : 1px solid <?php echo esc_attr($footer_link_hover) ?>;
            }

            .main-footer .widget_rox_widget_social_share ul li:hover i{
                background: <?php echo esc_attr($footer_link) ?>;
                border : 1px solid <?php echo esc_attr($footer_link) ?>;
            }

            /* Background Images */
            <?php
            $site_bg = esc_url(rox_get_mod('bgimages_global_site'));
            $title_bg = esc_url(rox_get_mod('title_bar_title_container'));
            $footer_top_bg = esc_url(rox_get_mod('footer_top_bg_img'));

            if ($site_bg !== ''): ?>
                .boxed{ background-image: url(<?php
                echo esc_url($site_bg); ?>); }
                <?php
            endif; ?>

            <?php
            if ($title_bg !== ''): ?>
                #title-container{ background-image: url(<?php
                echo esc_url($title_bg); ?>); }
                <?php
            endif; ?>

            <?php
            if ($footer_top_bg !== ''): ?>
                .rox-footer-top { background-image: url(<?php
                echo esc_url($footer_top_bg); ?>); }
                <?php
            endif;

            $single_post_align = rox_get_mod('layout_post_content_align');

            if ($single_post_align === 'center') : ?>

                .single-post .post-normal,.single-post .post-normal h1,.single-post .post-normal h2,.single-post .post-normal h3,.single-post .post-normal h4,.single-post .post-normal h5,.single-post .post-normal h6{
                text-align: center;
                }
                .single-post .post-normal .post-image{
                margin-left: auto;
                margin-right: auto;
                }
                .single-post .post-normal #about-author .avatar{
                float: none;
                }
            <?php elseif ($single_post_align === 'right') : ?>

                .single-post .post-normal,.single-post .post-normal h1,.single-post .post-normal h2,.single-post .post-normal h3,.single-post .post-normal h4,.single-post .post-normal h5,.single-post .post-normal h6{
                text-align: right;
                }

                .single-post .post-normal .entry-header:after{
                content: "";
                display: table;
                clear: both;
                }
                .single-post .post-normal .entry-header > *{
                float: right;
                clear: both;
                }
                .single-post .post-normal #about-author .avatar{
                float: right;
                }
                .single-post .post-normal #about-author  .author-content{
                margin-left: 0;
                margin-right: 85px;
                }
                <?php
            endif;

            $single_page_align = rox_get_mod('layout_page_content_align');

            if ($single_page_align === 'center') : ?>

                .page .type-page,.page .type-page h1,.page .type-page h2,.page .type-page h3,.page .type-page h4,.page .type-page h5,.page .type-page h6{
                text-align: center;
                }
                .page .type-page .post-image{
                margin-left: auto;
                margin-right: auto;
                }

            <?php elseif ($single_page_align === 'right') : ?>
                .page .type-page,.page .type-page h1,.page .type-page h2,.page .type-page h3,.page .type-page h4,.page .type-page h5,.page .type-page h6{
                text-align: right;
                }
                .page .type-page .post-image{
                margin-left: auto;
                margin-right: auto;
                }

                <?php
            endif;
        }
    }
endif;

Rox_Customize::get_instance();