@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,700,300,600,800,400);

body, html{
	font-family: 'Lato', sans-serif;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	color: #5a5a5a;
	/* scroll-behavior: smooth; */
}

h1{
	text-transform: uppercase;
}
h1 strong{
	font-weight: 900;
	text-transform: none;
}
h2{
	text-transform: uppercase;
	line-height: 20px;
	margin:  0;
}
h3{
font-size: 18px;
font-weight: 900;
}
h4{
	text-transform: uppercase;
}
h5{
	text-transform: uppercase;
	font-weight: 700;
	line-height: 20px;
}
p{
	font-family: 'Open Sans', sans-serif;
}
p.intro{
	font-size: 16px;
	margin: 12px 0 0;
	line-height: 24px;
	font-family: 'Open Sans', sans-serif;
}
a{
	 color: #FCAC45;
}
a:hover,
a:focus{
	text-decoration: none;
	color: #FCAC45;
}

.section-title hr{
	border-color: #fcac45;
	border-width: 4px;
	width: 60px;
	float: left;
	clear: both;
}
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
ul, ol{
	padding: 0;

}

/* Date range picker custom range items */
.drp-range-item:hover {
  background: #08c !important;
  border-color: #08c !important;
  color: #fff !important;
}

/* Resizer on Analyst chart */
.Resizer {
  background: #000;
  opacity: .2;
  z-index: 1;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-background-clip: padding;
  -webkit-background-clip: padding;
  background-clip: padding-box;
}

.Resizer:hover {
  -webkit-transition: all 2s ease;
  transition: all 2s ease;
}

.Resizer.horizontal {
  height: 11px;
  margin: -5px 0;
  border-top: 5px solid rgba(255, 255, 255, 0);
  border-bottom: 5px solid rgba(255, 255, 255, 0);
  cursor: row-resize;
  width: 100%;
}

.Resizer.horizontal:hover {
  border-top: 5px solid rgba(0, 0, 0, 0.5);
  border-bottom: 5px solid rgba(0, 0, 0, 0.5);
}

.Resizer.vertical {
  width: 11px;
  margin: 0 -5px;
  border-left: 5px solid rgba(255, 255, 255, 0);
  border-right: 5px solid rgba(255, 255, 255, 0);
  cursor: col-resize;
}

.Resizer.vertical:hover {
  border-left: 5px solid rgba(0, 0, 0, 0.5);
  border-right: 5px solid rgba(0, 0, 0, 0.5);
}

.Pane2 {
	height: 100px;
}

.Resizer.disabled {
	cursor: not-allowed;
}

.Resizer.disabled:hover {
	border-color: transparent;
}

/* YouTube */
.youtube {
    position: relative;
    display: inline-block;
}
.youtube:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
		background-size: 20%;
    background: transparent url('../img/play-mq.png') center center no-repeat;
}

/* Navigation */
#tf-menu {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	padding: 0;
	margin-bottom: 0;
	background: #222 !important;
	transition: background 0.5s;
}
#tf-menu.navbar-dark {
	background-color: #222 !important;
	border-color: #222 !important;
}
#tf-menu a.navbar-brand {
	/*text-transform: uppercase;*/
	font-size: 22px;
	/*color: #fff;*/
	color: #fcac45;
	font-weight: 900;
}

#tf-menu.navbar-dark .navbar-nav > li > a {
	text-transform: uppercase;
	color: #FFF;
	font-size: 12px;
	letter-spacing: 1px;
}
.on {
	background-color: #222222 !important;
	padding: 0 !important;
}
.navbar-dark .navbar-nav > .active > a,
.navbar-dark .navbar-nav > .active > a:hover,
.navbar-dark .navbar-nav > .active > a:focus {
	color: #FCAC45 !important;
	background-color: transparent;
	font-weight: 700;
}

.navbar-toggler {
	border-radius: 10px;
  padding: 3px;
}
.navbar-dark .navbar-toggler:hover,
.navbar-dark .navbar-toggler:focus {
	background-color: #FCAC45;
	border-color: #FCAC45;
}


/* Home Style */
#tf-home{
	background: url(../img/01.jpg) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-home{
		background-attachment: scroll;
	}
}

#tf-home .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 750px;
	background-attachment: fixed;
}
#tf-home p.lead{
	color: #e3e3e3;
}

.content{
	position: relative;
	padding: 20% 0 0;
}

.color{
	color: #fcac45;
	font-size: 48px;
}

a.fa.fa-angle-down {
	padding: 10px 15px;
	color: #fff;
	border: 0px solid #b4b4b4;
	border-radius: 50%;
	font-size: 24px;
	margin-top: 200px;
	transition: all 0.5s;
}
/*
a.fa.fa-angle-down:hover{
	background: #fcac45;
	color: #ffffff;
	border: 2px solid #fcac45;
}
*/

a.fa.fa-learn-more {
	padding: 10px 15px;
	/*color: #fff;*/
	border: 0px solid #b4b4b4;
	border-radius: 50%;
	font-size: 24px;
	margin-top: 40px;
	transition: all 0.5s;
}
/* About Section */
#tf-about{
	padding: 80px 0;
}
ul.about-list{ margin: 30px 0 0 ;}
ul.about-list li{
	display: block;
	font-size: 16px;
	line-height: 30px;
	font-family: 'Open Sans', sans-serif;
}
ul.about-list li span{
	margin-right: 10px;
}

/* Team Section */
#tf-team{
	background: url(../img/03.jpg);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #ffffff;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-team{
		background-attachment: scroll;
	}
}

#tf-team .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: auto;
	background-attachment: fixed;
	padding: 80px 0;
}
.section-title.center{
	padding: 30px 0;
}
.section-title h2,
.section-title.center h2{
	font-weight: 300;
}
.section-title.center .line{
	border-top: 4px solid #fcac45;
	height: 10px;
	width: 60px;
	text-align: center;
	margin: 0 auto;
	margin-top: 20px;
}

.section-title.center hr {
	border-top: 4px solid rgba(252, 172, 69, 0.34);
	width: 40px;
	text-align: center;
	margin-top: 10px;
	position: relative;
	left: 17%;
}
#team{ margin: 0 auto}
#team .item{
    padding: 0;
    margin: 15px;
    color: #FFF;
    text-align: center;
}

img.rounded-circle.team-img {
	width: 120px !important;
	height: 120px !important;
	border: 4px solid transparent;
	transition: all 0.5s;
}
#tf-team .item .thumbnail:hover>img.rounded-circle.team-img{
	border: 4px solid #FCAC45;
}
#tf-team .thumbnail {
	background: transparent;
	border: 0;
}

#tf-team .thumbnail .caption {
	padding: 9px;
	color: #F2F2F2;
}

.owl-theme .owl-controls .owl-page span {
	display: block;
	width: 10px;
	height: 10px;
	margin: 5px 7px;
	filter: Alpha(Opacity=1);
	opacity: 1;
	-webkit-border-radius: 0;
	-moz-border-radius: 20px;
	border-radius: 0;
	background: #FFFFFF;
	transition: all 0.5s;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
	filter: Alpha(Opacity=100);
	opacity: 1;
	background: #FCAC45;
}
.owl-theme .owl-controls .owl-page.active span{
	background: #FCAC45;
}


/* Services Section */
#tf-services{
	padding: 80px 0;
}

.space{
	margin-top: 40px;
}

#tf-services i.fa {
	font-size: 40px;
	border: 4px solid #FCAC45;
	width: 100px;
	height: 100px;
	padding: 27px 25px;
	margin-bottom: 10px;
	border-radius: 50%;
	transition: all 0.5s;
}

#tf-services i.fa.fa-mobile{
	font-size: 50px;
	padding: 20px 25px;
}

#tf-services .service:hover>i.fa{
	background: #FCAC45;
	color: #ffffff;
}

/* Industries Section */
#tf-industries{
	padding: 80px 0;
}

.space{
	margin-top: 40px;
}

#tf-industries i.fa {
	font-size: 40px;
	border: 4px solid #FCAC45;
	width: 100px;
	height: 100px;
	padding: 27px 25px;
	margin-bottom: 10px;
	border-radius: 50%;
	transition: all 0.5s;
}

#tf-industries i.fa.fa-mobile{
	font-size: 50px;
	padding: 20px 25px;
}

#tf-industries .service:hover>i.fa{
	background: #FCAC45;
	color: #ffffff;
}


/* Clients Section */
#tf-clients{
	background: url(../img/04.jpg);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #ffffff;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-clients{
		background-attachment: scroll;
	}
}

#tf-clients .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	padding: 80px 0;
	background-attachment: fixed;
}

#clients .item{
    padding: 0;
    margin: 35px;
    color: #FFF;
    text-align: center;
}

/* Gallery Section
==============================*/
#tf-works{
	padding: 80px 0;
}
.categories{
	padding: 10px 0;
}
ul.cat li{
	display: inline-block;
}
#tf-works li.pull-right {
	margin-top: 10px;
}
ol.type li{
	display: inline-block;
	margin-left: 20px;
}
ol.type li:after{
	content: ' | ';
	margin-left: 20px;
}
ol.type li:last-child:after { content: ''; }
ol.type li a{ color: #222222}
ol.type li a.active { font-weight: 700; }

.portfolio-item{
	margin-bottom: 30px;
}
.portfolio-item .hover-bg{
	height: 260px;
	overflow: hidden;
	position: relative;
}

.hover-bg .hover-text {
	position: absolute;
	text-align: center;
	margin: 0 auto;
	color: #ffffff;
	background: rgba(0, 0, 0, 0.66);
	padding: 25% 0;
	height: 100%;
	width: 100%;
	opacity: 0;
  transition: all 0.5s;
}
.hover-bg .hover-text>h4{
	opacity: 0;
	-webkit-transform: translateY(100%);
  transform: translateY(100%);
  transition: all 0.3s;
}
.hover-bg:hover .hover-text>h4{
	opacity: 1;
  backface-visibility: hidden;
  -webkit-backface-visibility:hidden;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.hover-bg .hover-text>i{
	opacity: 0;
	-webkit-transform: translateY(0);
  transform: translateY(0);
  transition: all 0.3s;
}
.hover-bg:hover .hover-text>i{
	opacity: 1;
  backface-visibility: hidden;
  -webkit-backface-visibility:hidden;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
.hover-bg:hover .hover-text{
	opacity: 1;
}
a .img-responsive {
	max-height: 100%;
}
#tf-works i.fa {
	height: 30px;
	width: 30px;
	border: 1px solid #FCAC45;
	font-size: 20px;
	padding: 5px;
	border-radius: 50%;
	color: #FCAC45;
}

/* Testimonials Section */
#tf-testimonials{
	background: url(../img/05.jpg);
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #ffffff;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-testimonials{
		background-attachment: scroll;
	}
}

#tf-testimonials .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	padding: 80px 0;
	background-attachment: fixed;
}
#testimonial,
#team,
#clients {
  --swiper-pagination-color: #f0a500;
  --swiper-pagination-bullet-inactive-color: #fff;
  --swiper-pagination-bullet-inactive-opacity: 0.6;
  --swiper-pagination-bullet-width: 14px;
  --swiper-pagination-bullet-height: 14px;
  --swiper-pagination-bullet-border-radius: 2px;
}

#clients {
  padding-bottom: 50px;
  --swiper-pagination-bottom: 0px;
}

#team {
  padding-bottom: 40px;
}

#testimonial {
  padding: 30px 0;
}
#testimonial .item{
  display: block;
  width: 100%;
  height: auto;
}

#testimonial .item p {
	font-weight: 400;
	margin: 30px 0;
	color: #d1d1d1;
}


/* Contact Section */
#tf-contact{
	padding: 80px 0;
}

label {
	float: left;
	font-size: 12px;
	font-weight: 400;
	font-family: 'Open Sans', sans-serif;
}
#tf-contact .form-control {
	display: block;
	width: 100%;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 2px;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}

#tf-contact .form-control:focus {
	border-color: inherit;
	outline: 0;
	-webkit-box-shadow: transparent;
	box-shadow: transparent;
}

button.btn.tf-btn.btn-default {
	float: right;
	background: #FCAC45;
	border: 0;
	border-radius: 0;
	padding: 10px 40px;
	color: #ffffff;
	text-transform: uppercase;
}

.btn:active, .btn.active {
	background-image: none;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline: thin dotted;
	outline: none;
	outline-offset: none;
}

/* SMP Style */
#tf-smphome{
	background: url(../img/collector.png) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-smphome{
		background-attachment: scroll;
	}
}

#tf-smphome .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 750px;
	background-attachment: fixed;
}
#tf-smphome p.lead{
	color: #e3e3e3;
}

/* SMP about Section */
#tf-smpabout{
	padding: 80px 0;
}

/* MM Style */
#tf-mmhome{
	background: url(../img/hvac.jpg) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-mmhome{
		background-attachment: scroll;
	}
}

#tf-mmhome .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 750px;
	background-attachment: fixed;
}
#tf-mmhome p.lead{
	color: #e3e3e3;
}

/* MM about Section */
#tf-mmabout{
	padding: 80px 0;
}

/* Analisys Style */
#tf-analhome{
	background: url(../img/ai.jpg) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-analhome{
		background-attachment: scroll;
	}
}

#tf-analhome .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 750px;
	background-attachment: fixed;
}
#tf-analhome p.lead{
	color: #e3e3e3;
}

/* Analysis about Section */
#tf-analabout{
	padding: 80px 0;
}

/* Inside Style */
#tf-inhome{
	background: url(../img/inside.png) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-inhome{
		background-attachment: scroll;
	}
}

#tf-inhome .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 750px;
	background-attachment: fixed;
}
#tf-inhome p.lead{
	color: #e3e3e3;
}

/* Inside about Section */
#tf-inabout{
	padding: 80px 0;
}


/* WEBAPP */

.usage-page {
	padding: 43px 0;
}


/* Wunderbaum tree container */
#treetable {
  width: 100%;
  height: calc(100vh - 150px);
  border: none !important;
  border-radius: 0 !important;
  --wb-header-color: #ffffff;
  --wb-active-color-grayscale: #337ab7;
  --wb-active-border-color-grayscale: #2e6da4;
  --wb-active-hover-color-grayscale: #286090;
  --wb-active-cell-color-grayscale: #337ab7;
  --wb-border-color: transparent;
  --wb-focus-border-color: transparent;
  font-family: Lato, 'Open Sans', sans-serif;
  font-size: 14px;
}
/* Header: height must match rowHeightPx (36px) so Wunderbaum measures correctly */
#treetable .wb-header {
  height: 36px !important;
  border-bottom: 1px solid #ddd !important;
}
#treetable .wb-header .wb-row {
  height: 36px;
}
#treetable .wb-header .wb-col {
  line-height: 36px;
  border-bottom: none !important;
}
/* Kill the active-column highlight Wunderbaum adds to header */
#treetable .wb-header .wb-col.wb-active {
  background-color: transparent !important;
  border-bottom: none !important;
}
/* Bold header titles */
#treetable .wb-header .wb-col-title { font-weight: bold; }
/* All non-icon header cols: uniform 5px left padding to match original */
#treetable .wb-header .wb-col:not(:first-child) {
  padding-left: 10px !important;
}
/* KWh/Previous headers: left-align, override wb-helper-end right-alignment */
#treetable .wb-header .wb-col.wb-helper-end {
  text-align: left !important;
}
/* Indent elements: must be 16px wide (matches original FancyTree 16px/level) and
   must not shrink in the flex channel column */
#treetable .wb-list-container .wb-row .wb-col i.wb-indent {
  width: 12px;
  flex-shrink: 0;
  display: inline-block;
}
/* Header col 0: bar chart icon, centred in 44px column */
#treetable .wb-header .wb-col:first-child { text-align: center; }
#treetable .wb-header .wb-col:first-child .wb-col-title { font-size: 0; }
#treetable .wb-header .wb-col:first-child .wb-col-title::before {
  font-family: 'bootstrap-icons';
  content: '\f17a';
  font-size: 14px;
}
/* Checkbox column (wb-node): hide everything except checkbox, center it */
/* NOTE: Do NOT override position — Wunderbaum sets position:sticky on the first col via
   span.wb-col:first-of-type, which also acts as a containing block for absolute children.
   Overriding to position:relative breaks the channel col's top:auto → 0px resolution. */
#treetable .wb-node .wb-expander,
#treetable .wb-node .wb-icon { display: none; }
/* Channel column in DATA rows only — flex for spacing; exclude header to preserve column resizer */
#treetable .wb-list-container .wb-row .wb-col:not(.wb-node):not(.wb-helper-end) {
  display: flex;
  align-items: center;
  gap: 4px;
  padding-left: 12px !important;
}

#treetable .wb-list-container .wb-row .wb-col.wb-helper-end {
  padding-right: 5px;
}

/* Channel expander state */
#treetable .wb-node + .wb-col .wb-expander-open { display: none; }
#treetable .wb-row.wb-expanded .wb-node + .wb-col .wb-expander { display: none; }
#treetable .wb-row.wb-expanded .wb-node + .wb-col .wb-expander-open { display: inline; }
/* Leaf node placeholder — invisible but preserves horizontal space for alignment */
#treetable .wb-col .wb-expander-placeholder { visibility: hidden; }

/* (restored: expander display rules kept as originally intended) */
/* Selected rows — Bootstrap success green, including when tree loses focus */
#treetable .wb-row.wb-selected,
#treetable:not(:focus-within) .wb-row.wb-selected,
#treetable:not(:focus) .wb-row.wb-selected {
  background-color: #5cb85c !important;
  border-color: #4cae4c !important;
  color: #fff !important;
}
#treetable .wb-row.wb-selected span.wb-col,
#treetable:not(:focus-within) .wb-row.wb-selected span.wb-col,
#treetable:not(:focus) .wb-row.wb-selected span.wb-col {
  background-color: #5cb85c !important;
  border-color: #4cae4c !important;
  color: #fff !important;
}
/* Active row — Bootstrap primary blue, including when tree loses focus */
#treetable .wb-row.wb-active,
#treetable:not(:focus-within) .wb-row.wb-active,
#treetable:not(:focus) .wb-row.wb-active {
  background-color: #337ab7 !important;
  border-color: #2e6da4 !important;
  color: #fff !important;
}
#treetable .wb-row.wb-active span.wb-col,
#treetable:not(:focus-within) .wb-row.wb-active span.wb-col,
#treetable:not(:focus) .wb-row.wb-active span.wb-col {
  background-color: #337ab7 !important;
  border-color: #2e6da4 !important;
  color: #fff !important;
}
/* Active takes precedence over selected */
#treetable .wb-row.wb-active.wb-selected,
#treetable:not(:focus-within) .wb-row.wb-active.wb-selected,
#treetable:not(:focus) .wb-row.wb-active.wb-selected {
  background-color: #337ab7 !important;
  border-color: #2e6da4 !important;
}
#treetable .wb-row.wb-active.wb-selected span.wb-col,
#treetable:not(:focus-within) .wb-row.wb-active.wb-selected span.wb-col,
#treetable:not(:focus) .wb-row.wb-active.wb-selected span.wb-col {
  background-color: #337ab7 !important;
  border-color: #2e6da4 !important;
}
/* White column dividers on coloured rows */
#treetable .wb-row.wb-selected .wb-col,
#treetable .wb-row.wb-active .wb-col {
  border-right-color: rgba(255,255,255,0.3) !important;
}
/* Icons white on coloured rows */
#treetable .wb-row.wb-selected .wb-col i,
#treetable .wb-row.wb-active .wb-col i {
  color: rgba(255,255,255,0.9);
}
/* Checkbox icon — always plain square, absolutely centred in the column cell */
#treetable .wb-node i.wb-checkbox {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  font-family: 'bootstrap-icons' !important;
  font-style: normal;
  font-size: 16px;
  line-height: 1 !important;
  height: auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: visible !important;
}
#treetable .wb-node i.wb-checkbox::before {
  content: '\f584' !important; /* bi-square — unchecked */
}
#treetable .wb-row.wb-selected .wb-node i.wb-checkbox::before {
  content: '\f26c' !important; /* bi-check-square-fill — checked */
}

.swiper-slide {
  /* Center slide content */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* The legacy usage screen mounted into #content2 and expected slide content
   to start at the top, not be vertically centered like the marketing carousels. */
.usage-page .swiper-slide {
  justify-content: flex-start;
  align-items: stretch;
}

/* Footer */
nav#footer{
	background: #222222;
	color: #ffffff;
	padding: 10px 0 5px 0;
}
nav#footer .fnav{ vertical-align: middle;}
ul.footer-social li{
	display: inline-block;
	margin-right: 10px;
}
nav#footer p{
	font-size: 12px;
	margin-top: 10px;
}
#footer i.fa {
	height: 30px;
	width: 30px;
	border: 2px solid #8c8c8c;
	font-size: 20px;
	padding: 4px 5px;
	border-radius: 50%;
	color: #8c8c8c;
	transition: all 0.5s;
}
#footer i.fa:hover{
	background: #FCAC45;
	border-color: #FCAC45;
	color: #ffffff;
}

/* login */

.wrap {
  width: 100%;
  height: 65vh;
	/*min-height: 100%;*/
  position: relative;
  top: 0;
  left: 0;
  z-index: 99;
}

#tf-signin{
	background: url(../img/01.jpg) ;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	color: #cfcfcf;
}
/* Fix for ios not supporting fixed background images */
@media only screen and (max-device-width: 1024px) {
	#tf-signin{
		background-attachment: scroll;
	}
}

#tf-signin .overlay{
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.73) 17%, rgba(0,0,0,0.66) 35%, rgba(0,0,0,0.55) 62%, rgba(0,0,0,0.4) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.8)), color-stop(17%,rgba(0,0,0,0.73)), color-stop(35%,rgba(0,0,0,0.66)), color-stop(62%,rgba(0,0,0,0.55)), color-stop(100%,rgba(0,0,0,0.4))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.73) 17%,rgba(0,0,0,0.66) 35%,rgba(0,0,0,0.55) 62%,rgba(0,0,0,0.4) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.63) 17%,rgba(0,0,0,0.56) 35%,rgba(0,0,0,0.45) 62%,rgba(0,0,0,0.3) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000',GradientType=0 ); /* IE6-9 */
	height: 100%;
	background-attachment: fixed;
}

p.form-title {
  font-family: 'Open Sans' , sans-serif;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  color: #FFFFFF;
  margin-top: 30%;
  text-transform: uppercase;
  letter-spacing: 4px;
}

form {
  width: 250px;
  margin: 0 auto;
}

form.login input[type="text"], form.login input[type="password"] {
  width: 100%;
  margin: 0;
  padding: 5px 10px;
  background: 0;
  border: 0;
  border-bottom: 1px solid #FFFFFF;
  outline: 0;
  font-style: italic;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  margin-bottom: 5px;
  color: #FFFFFF;
  outline: 0;
}

form.login input[type="submit"] {
  width: 100%;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 500;
  margin-top: 16px;
  outline: 0;
  cursor: pointer;
  letter-spacing: 1px;
}

form.login input[type="submit"]:hover {
  transition: background-color 0.5s ease;
}

form.login .remember-forgot {
  width: 100%;
  margin: 10px 0 0 0;
}

form.login .remember-content {
  text-align: center;
  margin-top: 5px;
}

form.login .forgot-pass-content {
  text-align: center;
}

form.login label, form.login a {
  font-size: 12px;
  font-weight: 400;
  color: #FFFFFF;
}

form.login a {
  transition: color 0.5s ease;
}

form.login a:hover {
  color: #2ecc71;
}

.pr-wrap {
  width: 100%;
  height: 100%;
  min-height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  display: none;
}

.show-pass-reset {
  display: block !important;
}

.pass-reset {
  margin: 0 auto;
  width: 250px;
  position: relative;
  margin-top: 22%;
  z-index: 999;
  background: #FFFFFF;
  padding: 20px 15px;
}

.pass-reset label {
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 15px;
}

.pass-reset input[type="email"] {
  width: 100%;
  margin: 5px 0 0 0;
  padding: 5px 10px;
  background: 0;
  border: 0;
  border-bottom: 1px solid #000000;
  outline: 0;
  font-style: italic;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  margin-bottom: 5px;
  color: #000000;
  outline: 0;
}

.pass-reset input[type="submit"] {
  width: 100%;
  border: 0;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 500;
  margin-top: 10px;
  outline: 0;
  cursor: pointer;
  letter-spacing: 1px;
}

.pass-reset input[type="submit"]:hover {
  transition: background-color 0.5s ease;
}

/* for the learn page */
.react-bs-container-header  {
	background-color: #d0e9c6;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-topright: 3px;
   border-top-left-radius: 3px;
   border-top-right-radius: 3px;
}

.react-bs-container-header > table > thead > tr > th {
	height: 40px;
	font-weight: normal;
}

.react-bs-table-container {
  margin-top: 20px
}

/* Date Range Picker Styles */
.selected-date-range-btn {
	background: #fff !important;
	border: 0px solid #ccc !important;
	border-radius: 0 !important;
	border-bottom: 1px solid #ccc !important;
	padding: 6px 12px !important;
	font-size: 14px !important;
	line-height: 1.428571 !important;
	color: #333 !important;
	cursor: pointer !important;
	width: 100% !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	box-shadow: none !important;
}

.selected-date-range-btn:hover,
.selected-date-range-btn:focus {
  background: #f5f5f5 !important;
  outline: none !important;
  box-shadow: none !important;
}

.selected-date-range-btn .bi {
  color: #666 !important;
  font-size: 16px;
}

/* Ensure Bootstrap Icons render correctly site-wide (fallback if overwritten) */
.bi {
	font-family: 'bootstrap-icons' !important;
	font-style: normal !important;
	font-weight: normal !important;
	font-variation-settings: normal !important;
	font-feature-settings: normal !important;
	speak: none !important;
	line-height: 1 !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

/* Dropdown panel */
.selected-date-range-btn + div[style*="position:absolute"] {
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15) !important;
}

/* Preset list */
.selected-date-range-btn + div[style*="position:absolute"] > div[style*="borderRight"] div {
  color: #337ab7 !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
  margin: 0 !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="borderRight"] div:hover {
  background: #f5f5f5 !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="borderRight"] div:active,
.selected-date-range-btn + div[style*="position:absolute"] > div[style*="borderRight"] div.active {
  background: #337ab7 !important;
  color: #fff !important;
}

/* Datetime inputs */
.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .form-control {
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  line-height: 1.428571 !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .form-control:focus {
  border-color: #66afe9 !important;
  outline: none !important;
  box-shadow: 0 0 5px rgba(102,175,233,0.5) !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] label {
  font-weight: 600 !important;
  font-size: 13px !important;
  margin-bottom: 4px !important;
  color: #333 !important;
}

/* Apply/Cancel buttons */
.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .btn-success {
  background-color: #5cb85c !important;
  border-color: #4cae4c !important;
  border-radius: 4px !important;
  padding: 5px 10px !important;
  font-size: 13px !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .btn-success:hover {
  background-color: #449d44 !important;
  border-color: #398439 !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .btn-secondary {
  background-color: #fff !important;
  border-color: #ccc !important;
  border-radius: 4px !important;
  padding: 5px 10px !important;
  font-size: 13px !important;
  color: #333 !important;
}

.selected-date-range-btn + div[style*="position:absolute"] > div[style*="padding"] .btn-secondary:hover {
  background-color: #f5f5f5 !important;
  border-color: #adadad !important;
}