/* ------------------------------------------------
  Project:   Hectolab - Medical & Health Multipurpose HTML5 Template
  Author:    ThemeHt

  NOTE: This is Color customizer stylesheet of template.
------------------------------------------------ */

:root {
	--min-color: #de8c3c;
	--main-dark: #4e391e;
	--main-border: #503629;
	--main-red: #DB0032;
	--main-light: #F6DFA4;
	--main-gray: #e9e8e4;
	--main-dark-gray: #8d8d8b;
}

/* ------------------------
    General
------------------------*/
::-moz-selection { background: #ff7810; color: #fff; text-shadow: none; }
::-moz-selection { background: #ff7810; color: #fff; text-shadow: none; }
::selection { background: #ff7810; color: #fff; text-shadow: none; }

 
/* ------------------------
    Background Color
------------------------*/
.theme-bg,
div.color-customizer a.opener,
.btn:hover,
.btn::after,
.btn.btn-theme,
.nav-item.dropdown .dropdown-menu a:hover,
.section-title h6::before,
.banner-slider h5,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-dots .owl-dot:hover span, .owl-carousel .owl-dots .owl-dot.active span,
.rounded-skill .rotate,
.portfolio-filter button.is-checked, .portfolio-filter button:hover,
.post-meta ul li::before,
.form-btn,
.footer-2 .secondary-footer,
.ht-progress-bar .progress .progress-bar,
.accordion.style-2 .accordion-item,
.widget .widget-tags li a:hover,
.pagination > li.active .page-link, .page-link:hover, .page-link:focus,
.about-2 h3
{ background-color: var(--main-red);}

.widget .theme-bg,
.widget .btn:hover,
.widget .btn::after,
.widget .btn.btn-theme,
.featured-item:hover .featured-icon i,
.featured-step.style-3 span::before,
.featured-item .featured-icon::before,
.featured-item .featured-icon::after,
.service-item h4,
.service-icon i,
.banner-slider .h3,
.banner-slider .h5,
.banner-slider .btn:hover,
.banner-slider .btn::after,
.banner-slider .btn.btn-theme,
.dark-bg .btn.btn-theme,
.sidebar-links li.active a, .sidebar-links li a:hover,
.tab .nav-tabs .nav-link.active, .tab .nav-tabs .nav-link:hover, .tab .nav-tabs.active > a:focus, .tab .nav-tabs > a:hover,
.scroll-top a
{ background-color: var(--main-light);}

.light-bg .featured-item:hover .featured-icon i,
.light-bg .featured-step.style-3 span::before,
.light-bg .featured-item .featured-icon::before,
.light-bg .featured-item .featured-icon::after,
.btn-light:hover
{ background-color: var(--main-dark);}

.widget .btn-link:hover {
	background-color: transparent;
}

.grey-bg
{ background-color: var(--main-gray);}

.header-3 #header-wrap
{ background-color: rgba(233, 232, 228, 0.8);}

/* ------------------------
    Color
------------------------*/
h1,
a, button, input, 
a:focus, a:hover,
.text-theme,
.topbar-link li a i,
.topbar-link li a:hover, .top-bar .top-social-list li a:hover,
.navbar-form[role="search"] button:hover,
.navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus, .navbar-nav .nav-item .nav-link.active,
.header-3 #header-wrap.fixed-header .navbar-nav .nav-item .nav-link.active,
h1 span,
.title span,
.btn-simple:hover,
.btn.btn-white:hover,
.btn.btn-white.btn-border:hover,
.btn:focus, .btn.focus,
.breadcrumb-item.active, .breadcrumb-item a:hover,
.featured-step > span,
.theme-bg .video-btn .btn-play, .dark-bg .video-btn .btn-play,
.testimonial .testimonial-content span,
.testimonial h6,
.post .post-desc h5 a:hover,
.media-icon li i,
.accordion-button:not(.collapsed),
.price-title,
.price-value h2 span.price-dollar,
.contact-info li i,
.pricing-list li,
.widget-searchbox .search-btn,
.widget .widget-categories li a:hover,
.pagination > li > a, .pagination > li > span,
.post-queto .item span,
.comment-date,
.reply a:hover,
a.popup,
.theme-bg .owl-carousel .owl-nav button.owl-prev,
.theme-bg .owl-carousel .owl-nav button.owl-next,
.dark-bg .title span,
.dark-bg .owl-carousel .owl-nav button.owl-prev:hover,
.dark-bg .owl-carousel .owl-nav button.owl-next:hover,
.media-icon li a:hover,
.footer-list li a:hover,
.header-3 .btn.btn-theme:hover,
.skill-num,
.dark-service .service-item .service-description a:hover, 
.service-description a:hover,
.dark-post .post .post-desc .post-btn
{color: var(--main-red);}

.banner-slider .h2 span,
.banner-slider .btn:hover,
.banner-slider .btn::after,
.banner-slider .btn.btn-theme,
.scroll-top a:hover
{color: var(--main-red);}

.featured-item .featured-icon i,
.light-bg .featured-item:hover .featured-icon i,
.btn-light:hover,
.header-3 #header-wrap.fixed-header .navbar-nav .nav-link:hover, 
.header-3 #header-wrap.fixed-header .navbar-nav .nav-link:focus, 
.header-3 #header-wrap.fixed-header .navbar-nav .nav-item.active .nav-link
{color: var(--main-light);}

.text-dark,
.widget .theme-bg,
.widget .btn:hover,
.widget .btn::after,
.widget .btn.btn-theme,
.banner-slider .btn:hover,
.banner-slider .btn::after,
.banner-slider .btn.btn-theme,
.dark-bg .btn.btn-theme,
.team-member .team-social-icon ul li a,
.team-member .team-description h5,
.service-item h4,
.service-icon i,
.featured-item:hover .featured-icon i,
.header-3 .navbar-nav .nav-link,
.team-member .team-about p,
.sidebar-links li.active a, .sidebar-links li a:hover,
.light-bg .featured-item .featured-icon i
{color: var(--main-dark);}


/* ------------------------
    Border Color
------------------------*/
.btn.btn-border,
.btn.btn-theme:hover,
.owl-carousel.owl-theme .owl-dots .owl-dot span::before,
.form-control:focus,
.reply a:hover,
.featured-step,
.price-table:hover,
.pagination > li.active .page-link, .page-link:hover, .page-link:focus,
.about-2,
.nice-select:active, .nice-select.open, .nice-select:focus,
.skill-spinner
{border-color: var(--main-red);}

.light-bg :where(.form-control),
.btn-light
{border-color: var(--main-dark);}


/* ------------------------
    Gradient Background
------------------------*/
.team-images:before {
  background: -webkit-linear-gradient(top, rgba(255,120,16,0) 0%, rgba(246,223,164,0.9) 55%);
  background: linear-gradient(to bottom, rgba(255,120,16,0) 0%, rgba(246,223,164,0.9) 55%);
}

.gallery-item .gallery-hover {
background: -webkit-linear-gradient(top, rgba(255,120,16,0) 0%, rgba(246,223,164,0.9) 35%);
background: linear-gradient(to bottom, rgba(255,120,16,0) 0%, rgba(246,223,164,0.9) 35%);}


[data-overlay].grediant-overlay:before{background: rgb(2,0,36); /* Old browsers */
background: -moz-linear-gradient(-90deg, rgba(2,0,36,1) 0%, var(--main-dark) 59%); /* FF3.6-15 */
background: -webkit-linear-gradient(-90deg, rgba(2,0,36,1) 0%, var(--main-dark) 59%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(-90deg, rgba(2,0,36,1) 0%, var(--main-dark) 59%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020024', endColorstr='#ff7810',GradientType=1 ); /* IE6-9 */}

[data-overlay].light-bg.grediant-overlay:before{background: #E9D7B3; /* Old browsers */
background: -moz-linear-gradient(-90deg, rgba(255,255,255,1) 0%, #E9D7B3 59%); /* FF3.6-15 */
background: -webkit-linear-gradient(-90deg, rgba(255,255,255,1) 0%, #E9D7B3 59%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(-90deg, rgba(255,255,255,1) 0%, #E9D7B3 59%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#E9D7B3',GradientType=1 ); /* IE6-9 */}

@media (max-width: 992px){

/* ------------------------
    Background Color
------------------------*/
.navbar-collapse{ background-color: #ff7810;}
.navbar-toggler{background: #ff7810;}


/* ------------------------
    Color
------------------------*/
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active, .navbar-nav .nav-link:focus,
#header-wrap.fixed-header .navbar-nav .nav-link:hover,
#header-wrap.fixed-header .navbar-nav .nav-link.active
{color: #ff7810 !important;}

}