
/* Change #22aba6 with your favorite color */
@color: #22aba6;



/* Do not change anything here */
@color5: fade(@color,50%);
@color7: fade(@color,70%);
@color8: fade(@color,80%);
@color9: fade(@color,90%);



.irs-from, .irs-to, .irs-single {
background: @color;
}
.irs-from:after, .irs-to:after, .irs-single:after {
border-top-color: @color;
}
.owl-theme .owl-controls.clickable .owl-buttons div:hover, 
.owl-theme .owl-controls.clickable .owl-buttons div:focus {
background-color:@color;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
background: @color;
}


mark {
	background:@color;
}

a {
	color:@color;
}
.anchor-1:hover {
	color:@color;
}

::-moz-selection {
	background:@color8;
}
::selection {
	background:@color8;
}

.back-to-top .fa:hover {
	background: @color;
}

.br-bottom:after {
	border-top:2px solid @color;
}
.br-bottom-center::after {
	border-top:2px solid @color;
}

.br-bottom-center.large:after {
	border-top:5px solid @color;
}

.color-main { color: @color !important; }

.bg-main { background-color:@color !important; }

.menu > li > a:hover,
.menu > li > a:focus,
.menu > li:hover > a {
	color:@color;
}
.submenu {
    border-top:1px solid @color;
}
.megamenu {
	border-top:1px solid @color;
}

.vertical-menu-list > li > a:hover,
.vertical-menu-list > li > a:focus {
	color:@color;
}

.megamenu-list > .title:after,
.vertical-menu-list > .title:after {
	border-top:2px solid @color;
}
.vertical-menu-list > .title:after {
	margin:5px auto;
}

@media (max-width: 767px) {
	.menu > li > a:hover,
	.menu > li > a:focus {
		color:@color;
	}
}
@media (min-width:992px) {
	.header-transparent .menu > li > a:hover,
	.header-transparent .menu > li > a:focus,
	.header-transparent .menu > li:hover > a {
		color:@color;
		-webkit-transition: all .3s ease-out; transition: all .3s ease-out;
	}
}

.top-menu > li > a:hover,
.top-menu > li > a:focus,
.top-menu > li > a:active {
	color:@color;
}
.topbar .social-icon > li > a:hover .fa {
	color:@color;
}


#menu-trigger {
	color:@color;
}

.vertical-menu .panel-title:hover a,
.vertical-menu .panel-title:focus a { color:@color; }

.btn-slider:hover, .btn-slider:focus, .btn-slider:active {
	background-color: @color;
	border-color:@color;
}

.btn-slider.reversed {
	background-color:@color;
	border-color:@color;
}

.page-nav-tabs .nav-tabs > li.active > a, 
.page-nav-tabs .nav-tabs > li.active > a:hover, 
.page-nav-tabs .nav-tabs > li.active > a:focus, 
.page-nav-tabs .nav-tabs > li > a:hover, 
.page-nav-tabs .nav-tabs > li > a:focus {
	color: @color;
}

.section-main { background-color: @color; }

.intro-title::after {
	background-color:@color;
}

.box-services-a .fa.fa-bg {
	background-color: @color;
}
.box-services-a:hover .title-small {
	color:@color;
}
.box-services-b:hover .title-small {
	color:@color;
}
.box-services-a .title-uppercased .link-read-more {
	color:@color;
}

.box-services-b:hover .box-left .fa-style1,
.box-services-c:hover .fa-style1 {
	background-color:@color;
}

.box-services-b .box-left .fa-style2,
.box-services-c .fa-style2 {
	color:@color;
}
.box-services-b .box-left .fa-style3,
.box-services-c .fa-style3 {
	background-color:@color;
}

.box-services-b:hover .fa-style4,
.box-services-c:hover .fa-style4 {
	color:@color;
}

.box-services-a:hover .fa-style5 {
	color:@color;
}

.box-services-d:hover .title-uppercased,
.box-services-d:hover .title-medium {
	color:@color;
}

.box-services-d .link-read-more:hover,
.box-services-d .link-read-more:focus {
	color:@color;
}
.box-services-e {
	background-color:@color;
}

.box-services-f .link-read-more:hover,
.box-services-f .link-read-more:focus {
	color:@color;
}

.title-border:after {
	background-color: @color;
}

.team-section .project-title > a:hover {
	color:@color;
}

.team-section-2 .social-icon.simple > li > a:hover .fa { color:@color; }

.section-testimonials blockquote span {
	color:@color;
}

.plan {
	border-top:2px solid @color;
}
.plan-price {
	color: @color;
}
.plan-register a:hover,
.plan-register a:focus {
	background-color:@color;
}
.portfolio-filter li a:hover,
.portfolio-filter li a:focus,
.portfolio-filter li a:active,
.portfolio-filter li a.active {
	color:@color;
}

.portfolio-text .mask .fa:hover {
    background-color:@color8;
}
.portfolio-text .portfolio-el:hover .portfolio-text-p {
	color:@color;
}
.project-details li .fa {
	color:@color;
}

.blog-item .sub-post-title a:hover {
	color:@color;
}
.read-more {
	color:@color;
}
.blog-item .media .blog-author:after {
	background-color:@color;
}
.sidebar-categories li:hover a {
	color:@color;
}
.sidebar-post h5 a:hover {
	color: @color;
}
.sidebar-socials a:hover,
.sidebar-socials a:focus {
	color:@color;
}

.shop-price {
	color: @color;
}
.shop-sidebar .top-rated-products h5 a:hover {
	color:@color;
} 
.faq-list > li > a:hover,
.faq-list > li > a:focus {
	color:@color;
}
.progress-bar {
	background-color: @color;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
    color: @color;
}

.btn-a:before {
	background: @color;
}
.btn-c {
	color:@color;
	border:1px solid @color;
}
.btn-d:hover, .btn-d:focus, .btn-d:active, .btn-d.active {
	background-color:@color;
}

.btn-e {
	color:@color;
	border:1px solid @color;
}
.btn-e:hover, .btn-e:focus, .btn-e:active, .btn-e.active {
	background-color:@color;
}

.popover-title::after {
	border-top:2px solid @color;
}

.modal-title:after {
	border-top:2px solid @color;
}
.pagination > li > a {
	color: @color;
}

.pagination > li > a > .fa { font-size:10px; }

.pagination > .active > a {
	background-color: @color;
}
.pagination > li a:hover {
	background-color: @color;
}
.pagination.pagination-2 > .active a,
.pagination.pagination-2.dark > .active a { background-color: @color; }

.pagination.pagination-2 > li a:hover {
	background-color: @color;
}
.mfp-close:hover {
	color:@color;
}
.media-heading > .user:hover,
.media-heading > .user:focus,
.media-heading > .user:active {
	color:@color;
}
.blockquote {
	border-left:2px solid @color;
}
.blockquote cite {
	color:@color;
}
.box-icon {
	background-color:@color;
}
.divider.d3:after {
	background-color:@color;
}
.footer-title:after {
	border-top:2px solid @color;
}
.footer-social > li > a:hover > .fa,
.footer-social > li > a:focus > .fa {
	color:@color;
}
.footer-subscribe input {
	border-bottom: 2px solid @color;
}
.footer-subscribe input:focus {
	border-bottom: 2px solid @color;
}
.footer-links > li > a:hover,
.footer-links > li > a:focus,
.footer-links > li > a:active {
	color: @color;
}

.social-icon.main .fa {background-color:@color; }
.social-icon.simple > li > a:hover .fa {
	color:@color;
}
