var customStyle = `
/* Scoll Track*/
::-webkit-scrollbar-thumb {
  background-color: CustomBackgroundColor;
}

a, a:link, a:visited {
    // color: CustomBackgroundColor;
}

.skAboutus a, .skAboutus a:link, .skAboutus a:visited {
    color: CustomBackgroundColor;
}


.dark-theme .skArea {
    background-color: CustomBackgroundColor0;
}

/* Top Bar CSS */
/*******************************************************************/

.skTopBar a img:hover {
  filter: drop-shadow(0 0 5px CustomBackgroundColor);
}

.skAction .skLogin,
.skNav {
	background: CustomBackgroundColor;
}

.skAction .skLogin a.skBtn{
	color: CustomFontColor;
}

.skLinks a.skLink:hover {
	background: CustomBackgroundColor;
}

.skSection .skColumnContent {
	background: CustomBackgroundColor;
}

.skSection .skColumnContent:after {
    -webkit-box-shadow: inset 0px -73px 88px -10px CustomBackgroundRGBA(0.85);
	box-shadow: inset 0px -73px 88px -10px CustomBackgroundRGBA(0.85);
}

.skSection .viewall:hover, .skSection .viewall:focus {
    background-color: CustomFontColor;
}

.skNav #dnnStandardMenu .root .txt {
	color: CustomFontColor;
}

.skNav #dnnStandardMenu .root .mi1 .txt {
	color: CustomFontColor;
}

.skNav #dnnStandardMenu .root .mi2 .txt:hover {
	color: CustomBackgroundColor;
} 

#slider805500 .skReadMore:hover,
#slider805500 .skReadMore:focus,
#slider1080500 .skReadMore:hover,
#slider1080500 .skReadMore:focus {
	color: CustomBackgroundColor;
}

.sWebTheme_ActionsArea a.sWebTheme_ActionsLinks:active span,
.sWebTheme_ActionsArea a.sWebTheme_ActionsLinks:hover span,
.sWebTheme_ActionsArea a.sWebTheme_ActionsLinks:focus span {
	background: CustomBackgroundColor;
	color: CustomFontColor;
}


.skSocialTab li a.skHead {
	background: CustomBackgroundColor;
}

.skNews a.skLink:hover,
.skNews a.skLink:focus,
ul.skField p.skName:hover,
.skEventHead a.skEventLink:hover {
	color: CustomFontColor;
}

.skFooter {
	background:  CustomBackgroundColor;
}

.skContact .skClubAddress a.skClubPhone:hover,
.skContact .skClubAddress a.skClubPhone:focus,
.skContact .skClubAddress a.skClubEmail:hover,
.skContact .skClubAddress a.skClubEmail:focus {
	color: CustomFontColor;
}

.skFooter .skSiteLink li.skSiteItem:hover:before,
.skFooter .skSiteLink li.skSiteItem:hover a.skSiteItemLink {
	color: CustomFontColor;
}

.skBottomBar .skInfo .SkinObject:hover,
.skBottomBar .skInfo .skHiddenLogin:hover{
	color: CustomFontColor;
}

.skInner .default-header {
	background: CustomBackgroundColor;
}


.sWebTheme_ActionsArea a.sWebTheme_showSettings:hover {
  background-color: CustomBackgroundColor;
  color: CustomFontColor;
}


/* responsive CSS */
/********************************************************************/
@media screen and (max-width: 768px) {
	 /* Mobile menu CSS */
    #Body #mobNav .navBar {
        background: CustomBackgroundColor;
    }
    #Body #mobNav .navDropDown {
        background: CustomBackgroundColor;
    }
    #Body #mobNav .navTabs .activeTab {
        border-bottom-color: CustomBackgroundColor;
    }
    #Body #mobNav .navChild .navLink, 
    #Body #mobNav .navChild .navLink:link, 
    #Body #mobNav .navChild .navLink:visited {
        color: CustomBackgroundColor;
    }
    #Body #mobNav.hot-pink .navChild .navIcon {
        fill: CustomBackgroundColor;
    }
    #Body #mobNav .navChild .navIcon,
	#Body #navMenu .navExpand navIcon	{
        fill: CustomBackgroundColor !important;
    }
	
	#slider805500 .skPager a span {
		background: CustomBackgroundColor;
	}
	
	#Body .skAction .skLogin a.skBtn	{
		background-color: CustomBackgroundColor;
	}
	
	.skFooter .skSiteLink li.skSiteItem:hover:before,
	.skSection .skNews .readmore a	{
		color: CustomFontColor;
	}

	.skSection .skColumnContent.expanded {
		background: CustomBackgroundColor;
	}
}

`

$(document).ready(function () {
    var customStyleSheet = $("<style type='text/css'></style>");
    var currentBackgroundColor = window.selectedBaseColor !== '' ? window.selectedBaseColor : window.currentBaseColor;
    var currentTextColor = window.selectedTextColor !== '' ? window.selectedTextColor : window.currentTextColor;

    $("body").append(customStyleSheet);
    $("#themecolor")
        .val(currentBackgroundColor)
        .change(function (event) {
            applyCustomColor();
        });

    $("#textcolor")
        .val(currentTextColor)
        .change(function (event) {
            applyCustomColor();
        });

    
    function applyCustomColor(){
        var baseRe = new RegExp("CustomBackgroundColor", "g");
        var textRe = new RegExp("CustomFontColor", "g");
        var rgbaRe = new RegExp("CustomBackgroundRGBA\(([^)]+)\)", "g")
        var css = customStyle
        .replace(baseRe, currentBackgroundColor)
        .replace(textRe, currentTextColor);
        customStyleSheet.html(css);
    }
});