/* Elements that uses the brand color as text color */
h1, h2.colored, .text-primary, .nav-tabs li a:hover, .nav-tabs li.active a, .nav-tabs li.active a:focus, .nav-tabs li.active a:hover, .nav-tabs li.active a::after, .nav-tabs li:hover a::after {
	color: #187a7a !important;
}

/* Elements that uses the brand color as background color */
.sidebar, .sidebar ul li a:focus, .table > thead > tr > th, #contacts-tbody td.colored, .ui-datepicker .ui-state-active {
	background-color: #187a7a !important;
}

.fill-svg svg {
	fill: #187a7a;
}
.stroke-svg svg {
	stroke: #187a7a;
}

/* Change hover elements darker than your brand color */
.sidebar ul li a:hover, .sidebar ul li a:active {
	background-color: #2fc5cd;
}

/* Buttons */
.btn-primary, .btn-primary:active:focus {
	border-color: #187a7a;
	background: #187a7a;
}
.btn-primary:hover, .btn-primary:focus {
	background: #2fc5cd;
	border-color: #2fc5cd;
}

/* Panels  */
.panel .panel-heading {
	background-color: #2fc5cd; /* change */ ;
}
.panel .panel-heading h2 small {
	color: #fff; /* change to a lighter color if your panel-heading is dark */ ;
}
.panel .panel-heading .fill-svg svg {
	fill: #2fc5cd;/* change to a lighter color if your panel-heading is dark */ ;
}
.panel .panel-heading .stroke-svg svg {
	stroke: #2fc5cd; /* change to a lighter color if your panel-heading is dark */ ;
}