/** Blue	 var(--mycolor4)
 **************************************************************** **/
	::selection {
		background: var(--mycolor9);
	}
	::-moz-selection {
		background: var(--mycolor9) /* Firefox */
	}
	::-webkit-selection {
		background: var(--mycolor9) /* Safari */
	}

	@media (min-width: 1900px) {
		.container, .container-lg, .container-md, .container-sm, .container-xl {
			max-width: 1600px;
		}
	}
	
	a,
	a:focus:not(.btn),
	.dark a,
	#slidetop a:hover,
	h1 > span,
	h2 > span,
	h3 > span,
	h4 > span,
	h5 > span,
	h6 > span,
	.pagination>li>a, 
	.pagination>li>a:hover, 
	.pagination>li>span,
	ul.list-links>li>a:hover,
	#sidepanel ul li a[data-toggle="collapse"],
	#sidepanel ul li a[data-toggle="collapse"]:hover,
	#sidepanel ul li a:hover,
	.menu-list ul li a:hover, 		/* header-0.css */
	.menu-list ul li.active a, 		/* header-0.css */
	#menu_overlay_close:hover, 	/* header-0.css */
	#topMain.nav-pills>li.active>a>span.topMain-icon,
	#page-menu.page-menu-light ul>li:hover>a>i,
	#page-menu.page-menu-dark ul>li:hover>a>i,
	#page-menu.page-menu-transparent ul>li:hover>a>i,
	#page-menu.page-menu-light ul>li.active>a>i,
	#page-menu.page-menu-dark ul>li.active>a>i,
	#page-menu.page-menu-transparent ul>li.active>a>i,
	.tp-caption.block_white,
	 span.container, 
	 em.container, 
	 i.container, 
	 b.container, 
	 div.container, 
	 p.container,
	.owl-carousel.featured a.figure>span>i,
	.owl-carousel.featured a:hover,
	figure.zoom>a.lightbox:hover,
	#portfolio h2>a:hover,
	#portfolio h3>a:hover,
	#portfolio h4>a:hover,
	#portfolio h5>a:hover,
	#portfolio h6>a:hover,
	.tab-post a:hover,
	.tag:hover>span.txt,
	.dark .tag:hover>span.txt,
	ul.widget-twitter li>small>a:hover,
	.blog-post-item h2>a:hover,
	.blog-post-item h3>a:hover,
	.blog-post-item h4>a:hover,
	.blog-post-item h5>a:hover,
	.item-box .item-hover .inner .ico-rounded:hover>span,
	ul.side-nav>li:hover>a,
	ul.side-nav>li a:hover,
	ul.side-nav>li.active>a,
	a.href-reset:hover,
	a.href-reset.active,
	.href-reset a.active,
	.href-reset a:hover,
	.href-reset a.active,
	.price-clean-popular h4,
	.box-icon.box-icon-color i,
	.switch-primary.switch-round > input:checked + .switch-label:after,
	.dark .nav-tabs.nav-clean>li.active>a { 
		color: var(--mycolor5); 
	}
	
	#sidepanel.sidepanel-container,
	div.alert.alert-container,
	div.alert.alert-primary,
	span.badge-default,
	span.label-default,
	.list-group-item.active>.badge.badge-default,
	.nav-tabs.nav-alternate>li.active>a,
	.datepicker table tr td.active.active,
	.callout-container,
	.progress-bar-primary,
	.toast-primary,
	.owl-theme .owl-controls .owl-page span,
	.open>.dropdown-toggle.btn-primary,
	.btn-primary,
	.btn-primary:hover,
	.btn-primary:active,
	.btn-primary:focus,
	.pagination>.active>a,
	.pagination>.active>a:hover,
	#header li.quick-cart .quick-cart-box a.btn,
	#header li.quick-cart .quick-cart-box a.btn:hover, /* used by dark & transparent header */
	#topMain.nav-pills>li.active>a>span.container ,
	.ei-slider-thumbs li.ei-slider-element,			/* elastic slider active indicator */
	.flex-control-paging li a.flex-active,				/* flex slider bullets */
	.tp-caption.block_theme_color,
	.tp-bullets.simplebullets.round .bullet.selected,
	i.ico-color,
	.caption-primary,
	.shop-list-options .btn.active,
	.box-static.box-color,
	.switch.switch-primary > input:checked + .switch-label,
	.fancy-file-upload.fancy-file-primary>span.button,
	.primary-slider .ui-slider .ui-slider-handle:before,
	.primary-slider .ui-slider .ui-slider-range,
	.ribbon-inner,
	.info-bar.info-bar-color,
	.music-album-title:hover,
	.inews-item .inews-thumbnail .inews-sticky,
	.btn>.new-primary,
	#progressBar #bar,								/* OWL */
	#page-menu,
	#page-menu ul {
		background-color: var(--mycolor5) !important;
	}
	.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
		background-color: var(--mycolor5) !important;
		border-color: var(--mycolor3) !important;
	}
	.border-primary {
		border-color: var(--mycolor5) !important;
	}
	.text-primary {
		color: var(--mycolor8) !important;
	}
	a.text-primary :focus {
		color: var(--mycolor5) !important;
	}
	a.text-primary :hover {
		color: var(--mycolor5) !important;
	}
	/* !important required */
	#music-player .mejs-controls .mejs-time-rail .mejs-time-current,
	#music-player .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current,
	 .theme-background,
	.swiper-pagination-bullet-active {
		background-color: var(--mycolor5) !important;
	}
	.inews-content-inner h3>a,
	div.side-nav ul>li:hover>a, 
	div.side-nav ul>li.active>a,
	.pagination.pagination-simple>li.active>a,
	div.side-nav ul.list-group-bordered>li>a:hover,
	 .container {
		color: var(--mycolor7) !important;
	}

	.primary-slider .ui-slider .ui-slider-handle,
	.switch.switch-primary > input:checked + .switch-label,
	.timeline_center li h3:before, 
	.timeline_center:after,
	a.thumbnail.active,
	a.thumbnail:hover,
	.btn-primary,
	.btn-primary:hover,
	.btn-primary:active,
	.btn-primary:focus {
		border-color: var(--mycolor5);
	}

	.open>.dropdown-toggle.btn-primary,
	.btn-primary,
	.btn-primary:active,
	.btn-primary:focus,
	.btn-primary:hover
	.pagination>.active>a,
	.pagination>.active>a:hover {
		border-color: var(--mycolor3);
	}

	#topNav ul.dropdown-menu { /* submenu border top color */
		border-top-color: var(--mycolor4);
	}
	.featured-grid div.row>div .ribbon:before,
	.modal-content {
		border-top-color: var(--mycolor4);
	}

	#topNav ul.dropdown-menu {
		border-color: var(--mycolor4) var(--mycolor9) var(--mycolor9);
	}
	#topNav div.submenu-dark ul.dropdown-menu {
		border-color: var(--mycolor4) var(--mycolor6)  var(--mycolor6);
	}
	#topNav div.submenu-color ul.dropdown-menu {
		border-color: var(--mycolor4)  var(--mycolor6)  var(--mycolor6);
	}
	#topMain li.search .search-box {
		border-top: var(--mycolor4) 2px solid;
	}


	/* COLOR DROP DOWN MENU */
	#topNav div.submenu-color ul.dropdown-menu {
		background-color: var(--mycolor3);
	}
	#topNav div.submenu-color ul.dropdown-menu {
		border-color: #888 var(--mycolor4) var(--mycolor4);
	}

	#topNav div.submenu-color ul.dropdown-menu a.dropdown-toggle {
		background-image: url('../../images/_smarty/submenu_light.png');
	}
	#topNav div.submenu-color ul.dropdown-menu li.active>a, 
	#topNav div.submenu-color ul.dropdown-menu li.active:hover>a, 
	#topNav div.submenu-color ul.dropdown-menu li.active:focus>a, 
	#topNav div.submenu-color ul.dropdown-menu li:hover>a, 
	#topNav div.submenu-color ul.dropdown-menu li:focus>a, 
	#topNav div.submenu-color ul.dropdown-menu li:focus>a {
		color:var(--mycolor9);
		background-color:rgba(0,0,0,0.15);
	}
	#topNav div.submenu-color ul.dropdown-menu li.divider {
		background-color:rgba(255,255,255,0.3);
	}
	#topNav div.submenu-color ul.dropdown-menu>li a {
		color:var(--mycolor9);
	}
	#topNav div.submenu-color #topMain>li.mega-menu div.row div>ul>li>span {
		color:var(--mycolor9);
	}
	#topNav div.submenu-color #topMain>li.mega-menu div.row div { 
		border-left: rgba(0,0,0,0.2) 1px solid;
	}

	
	/* Theme Color  */
	.container,
	.container h1,
	.container h2,
	.container h3,
	.container h4,
	.container h5,
	.container h6 {
		color: var(--mycolor8);
	}
	.container div.heading-title h1, 
	.container div.heading-title h2, 
	.container div.heading-title h3, 
	.container div.heading-title h4, 
	.container div.heading-title h5, 
	.container div.heading-title h6 {
		color: var(--mycolor5);
	}
	.container div.heading-title h1 span, 
	.container div.heading-title h2 span, 
	.container div.heading-title h3 span, 
	.container div.heading-title h4 span, 
	.container div.heading-title h5 span, 
	.container div.heading-title h6 span {
		color: var(--mycolor5);
	}
	.container a {
		color: var(--mycolor6);
		text-decoration:none;
	}
	.container a:hover {
		color: var(--mycolor5);
	}
	.container a.btn {
		color: var(--mycolor9);
		text-decoration:none;
	}
	.container a.btn:hover {
		color: var(--mycolor9);
	}
	.container pre {
		background-color:rgba(0,0,0,0.1);
	}
	.container div.heading-border-bottom.heading-color {
	 border-bottom-color:rgba(255,255,255,0.5);
	}




/**	Vertical Menu
*************************************************** **/
body.menu-vertical #mainMenu.sidebar-vertical .sidebar-nav .navbar li:hover>a,
body.menu-vertical #mainMenu.sidebar-vertical .dropdown-menu>.active>a, 
body.menu-vertical #mainMenu.sidebar-vertical .dropdown-menu>.active>a:focus, 
body.menu-vertical #mainMenu.sidebar-vertical .dropdown-menu>.active>a:hover,
body.menu-vertical #mainMenu.sidebar-vertical .navbar-default .navbar-nav>.active>a,
body.menu-vertical #mainMenu.sidebar-vertical .sidebar-nav .navbar li:hover>a {
	color: var(--mycolor8) !important;
}





/**	[Shortcode] Buttons
*************************************************** **/
.dark .btn-default:hover {
	color: var(--mycolor4);
	background-color:rgba(0,0,0,0.3);
}


/**	[Shortcode] Page Header
*************************************************** **/
	.page-header .breadcrumb a:hover {
		color: var(--mycolor5) !important; 
		text-decoration:none;
	}
	
	
/**	[Shortcode] Dividers
*************************************************** **/
	div.divider.divider-color i {
		color:var(--mycolor9);
	}
	div.divider.divider-color:before,
	div.divider.divider-color:after {
		border-top: var(--mycolor4) 1px solid;
	}
	div.divider.divider-color i {
		color: var(--mycolor4);
	}
	div.divider.divider-circle.divider-color i {
		color:var(--mycolor9);
		background-color: var(--mycolor3);
	}
	div.divider.divider-border>a:hover>i {
		color: var(--mycolor5);
	}


/**	[Shortcode] Headings
*************************************************** **/
	div.heading-title.heading-line-single.heading-color:before,
	div.heading-title.heading-line-double.heading-color:before {
		border-color: var(--mycolor4);
	}
	div.heading-border-bottom.heading-color {
		border-bottom-color: var(--mycolor4);
	}
	div.heading-title.heading-border.heading-color,
	div.heading-title.heading-border.heading-inverse.heading-color {
		border-color: var(--mycolor4);
	}
	.dark div.heading-title.heading-border-bottom {
		border-bottom-color: var(--mycolor4);
	}

/**	[Shortcode] Icon Boxes
*************************************************** **/
.box-icon a.box-icon-title:hover>h2 {
	color: var(--mycolor5);
}
.box-icon a.box-icon-title:hover>i {
	color: var(--mycolor9);
	background-color: var(--mycolor3);
}
.box-icon a.box-icon-more {
	color: var(--mycolor8);
}
.box-icon a.box-icon-more:hover,
.dark .box-icon a.box-icon-more:hover {
	color: var(--mycolor5);
}

.box-video a.box-video-title:hover h2,
.box-video a.box-image-title:hover h2 {
	color: var(--mycolor5);
}

.box-flip .box2 {
	color: var(--mycolor9);
	background-color: var(--mycolor3);
}

.box-flip .box2 h1,
.box-flip .box2 h2,
.box-flip .box2 h3,
.box-flip .box2 h4,
.box-flip .box2 h5,
.box-flip .box2 h6 {
	color: var(--mycolor9);
}

.box-static.box-border-top {
	border-color: var(--mycolor4);
}



/**	[Shortcode] Navigations
*************************************************** **/
.navbar-primary {
	border-color: var(--mycolor5) !important;
	background-color: var(--mycolor5) !important;
}

/**	[Shortcode] Paginations
*************************************************** **/
.dark .pagination > li.active>a,
.pagination > li.active>a {
	border-color: var(--mycolor4);
	background-color: var(--mycolor3);
}


/** [Shortcode] Process Steps
*************************************************** **/
.process-wizard-primary > .process-wizard-step > .process-wizard-dot,
.process-wizard-primary > .process-wizard-step > .progress > .progress-bar {
	background: var(--mycolor5);
}
.process-wizard-primary > .process-wizard-step > .process-wizard-dot:after {
	background-color:rgba(0,0,0,0.4);
}

ul.process-steps li.active a,
ul.process-steps li.active a:focus,
ul.process-steps li.active:hover>a {
	background-color: var(--mycolor4) !important;
	border-color: var(--mycolor4) !important;
}

ul.process-steps li.active h1,
ul.process-steps li.active h2,
ul.process-steps li.active h3,
ul.process-steps li.active h4,
ul.process-steps li.active h5,
ul.process-steps li.active h6 {
	color: var(--mycolor8);
}



/** [Shortcode] Process Steps
*************************************************** **/
div.mega-price-table .pricing-title, 
div.mega-price-table .pricing-head, 
div.mega-price-table .pricing.popular {
	background-color: var(--mycolor3);
}


div.mega-price-table .pricing:hover h4, 
div.mega-price-table .pricing-table i.fa {
	color: var(--mycolor5);
}



/** Styled Icons
 **************************************************************** **/
.dark i.ico-hover:hover,
i.ico-hover:hover {
	background-color: var(--mycolor3);
	border-color: var(--mycolor5);
}


/** [Shortcode] Tabs
 **************************************************************** **/
.nav-tabs.nav-top-border>li.active>a,
.nav-tabs.nav-top-border>li.active>a:hover {
	border-top-color: var(--mycolor4) !important;
}
.nav-tabs.nav-bottom-border>li.active>a,
.nav-tabs.nav-bottom-border>li.active>a:hover {
	border-bottom-color: var(--mycolor4) !important;
}
.nav-tabs.nav-alternate>li.active>a {
	background-color: var(--mycolor4) !important;
}
.nav-tabs>li.active>a {
	color: var(--mycolor5) !important;
}



/** Sky Forms
 **************************************************************** **/
/**/
/* normal state */
/**/
.sky-form .toggle i:before {
	background-color: var(--mycolor3);	
}
.sky-form .button {
	background-color: var(--mycolor3);
}


/**/
/* checked state */
/**/
.sky-form .radio input + i:after {
	background-color: var(--mycolor3);	
}
.sky-form .checkbox input + i:after {
	color: var(--mycolor5);
}
.sky-form .radio input:checked + i,
.sky-form .checkbox input:checked + i,
.sky-form .toggle input:checked + i {
	border-color: var(--mycolor4);	
}
.sky-form .rating input:checked ~ label {
	color: var(--mycolor5);	
}


/** Hover Buttons
 **************************************************************** **/
.hvr-border-fade:hover, .hvr-border-fade:focus, .hvr-border-fade:active {
  box-shadow: inset 0 0 0 4px var(--mycolor4), 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-fade:hover, .hvr-fade:focus, .hvr-fade:active,
.hvr-back-pulse:hover, .hvr-back-pulse:focus, .hvr-back-pulse:active,
.hvr-sweep-to-right:before,
.hvr-sweep-to-left:before,
.hvr-sweep-to-bottom:before,
.hvr-sweep-to-top:before,
.hvr-bounce-to-right:before,
.hvr-bounce-to-left:before,
.hvr-bounce-to-bottom:before,
.hvr-bounce-to-top:before ,
.hvr-radial-out:before,
.hvr-radial-in,
.hvr-rectangle-inm
.hvr-rectangle-out:before,
.hvr-shutter-in-horizontal,
.hvr-shutter-out-horizontal:before,
.hvr-shutter-in-vertical,
.hvr-shutter-out-vertical:before,
.hvr-underline-from-left:before,b
.hvr-underline-from-center:before,
.hvr-underline-from-right:before,
.hvr-overline-from-left:before,
.hvr-overline-from-center:before,
.hvr-overline-from-right:before,
.hvr-underline-reveal:before,
.hvr-overline-reveal:before {
	background-color: var(--mycolor3);
}

.prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item.active:not(.prefix-icon-ignore):before, .prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item.active>a:not(.prefix-icon-ignore):before, .prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item.show:not(.prefix-icon-ignore):before, .prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item.show>a:not(.prefix-icon-ignore):before, .prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item:hover:not(.prefix-icon-ignore):before, .prefix-link-icon:not(.prefix-icon-arrow) .dropdown-item:hover>a:not(.prefix-icon-ignore):before {
    background-color: var(--mycolor5) !important;
}

.bg-gradient-primary {
    background: var(--mycolor5);
	background: -webkit-linear-gradient(var(--mycolor5), var(--mycolor3)) !important;
	background: -o-linear-gradient(var(--mycolor5), var(--mycolor3)) !important;
	background: linear-gradient(var(--mycolor5), var(--mycolor3)) !important;
}

.h3 {
	font-size:36px;
}
.h4 {
	font-size:22px;
}
@media only screen and (max-width: 991px) {
	ul ul .dropdown-menu a {
		color: var(--mycolor4) !important;
	}
	.h3 {
		font-size:24px;
	}
	.h4 {
		font-size:18px;
	}
}
.bg-red-select {
	background-color: red;
}
li {
	color: var(--mycolor8) !important;
}
p, p.h1, p.h2, p.h3, p.h4, p.h5, p.h6 {
	color: var(--mycolor8) !important;
}
.text-mycolor1 {color:var(--mycolor1) !important;}
.text-mycolor2 {color:var(--mycolor2) !important;}
.text-mycolor3 {color:var(--mycolor3) !important;}
.text-mycolor4 {color:var(--mycolor4) !important;}
.text-mycolor5 {color:var(--mycolor5) !important;}
.text-mycolor6 {color:var(--mycolor6) !important;}
.text-mycolor7 {color:var(--mycolor7) !important;}
.text-mycolor8 {color:var(--mycolor8) !important;}
.text-mycolor9 {color:var(--mycolor9) !important;}

.btn-primary:not(.btn-noshadow):hover, .btn-primary:not(.btn-noshadow):not(.btn-soft):active, .btn-primary:not(.btn-noshadow):not(.btn-soft):focus {
    box-shadow: 0 4px 11px rgba(0,0,0,.35);
}
