/* === color === */

a, a:hover, a:focus, a:active, footer a.text-link:hover, strike, footer ul.link-list li a:hover, .post-meta span a:hover, footer a.text-link, ul.meta-post li a:hover, ul.cat li a:hover, ul.recent li h6 a:hover, ul.portfolio-categ li.active a, ul.portfolio-categ li.active a:hover, ul.portfolio-categ li a:hover, ul.related-post li h4 a:hover, span.highlight, article .post-heading h3 a:hover, .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > li > a:hover, .navbar .nav > li > a:focus, .navbar .nav > .active > a:focus, .validation
{
	color: #333333;
}

.navbar .nav > li > a, .navbar .nav > li > a:hover {color:#01b0f0;}
/* === background color === */
.navbar .nav > .active.dropdown > a.dropdown-toggle,
.navbar .nav > .active.dropdown > a.dropdown-toggle:hover,
.navbar .nav > .active.dropdown > a.dropdown-toggle:focus,
.custom-carousel-nav.right:hover, .custom-carousel-nav.left:hover, 
.dropdown-menu li:hover,
.dropdown-menu li a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a, 
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover,
.pagination ul > .active > a:hover,
.pagination ul > .active > a,
.pagination ul > .active > span,
.flex-control-nav li a:hover, 
.flex-control-nav li a.active {
  background-color: #01b0f0;
}

/* === border color === */
.pagination ul > li.active > a,
.pagination ul > li.active > span, a.thumbnail:hover, input[type="text"].search-form:focus {
	border:1px solid #01b0f0;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-color: #01b0f0;
}

input:focus {
	border-color: #01b0f0;
}


#sendmessage {
	color: #01b0f0;
}

.pullquote-left {
	border-left:10px solid #777979;
}

.pullquote-right {
	border-right:5px solid #01b0f0;
}


/* === Header === */
/* --- toggle top area --- */
 .hidden-top {	
	background:#01b0f0;
}
#header-hidden-link a.toggle-link,
#header-hidden-link a.top-link {
	background:#01b0f0;
}


/* carousel */
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover, 
.jcarousel-skin-tango .jcarousel-prev-horizontal:focus,
.jcarousel-skin-tango .jcarousel-next-horizontal:hover, 
.jcarousel-skin-tango .jcarousel-next-horizontal:focus
 {
	background:#01b0f0;
}

ul.clients li:hover {
	border:4px solid #01b0f0;
}

/* buttons */
.btn-dark:hover,.btn-dark:focus,.btn-dark:active  {
  background: #01b0f0;
  border:1px solid #01b0f0;
}

.btn-theme {
  border:1px solid #01b0f0;
  background: #01b0f0;
}

/* modal styled */
.modal.styled .modal-header {
  background-color: #01b0f0;
}


/* blog */
.post-meta {
	border-top:4px solid #01b0f0;
}

.post-meta .comments a:hover  {
	color:#01b0f0;
}

.widget ul.tags li a:hover {
	background: #01b0f0;
}

.recent-post .text h5 a:hover{
	color:#01b0f0;
}

/* pricing box */

.pricing-box-alt.special .pricing-heading {
	background: #01b0f0;
}


/* portfolio */
.item-thumbs .hover-wrap .overlay-img {
	background: #01b0f0;	
}


/* pagination */
#pagination a:hover {
    background: #01b0f0;
}

/* pricing box */
.pricing-box.special .pricing-offer{
	background: #01b0f0;
}


/* fontawesome icons */
.icon-square:hover,
.icon-rounded:hover,
.icon-circled:hover {
    background-color: #01b0f0;
}
[class^="icon-"].active,
[class*=" icon-"].active {
    background-color: #01b0f0;
}

/* fancybox */
.fancybox-close:hover {
	background-color:#01b0f0;
}
.fancybox-nav:hover span {
	background-color:#01b0f0;
}

/* parallax c slider */
.da-slide .da-link:hover{
	background: #ff7300;
	border: 4px solid #ff7300;
}

.da-dots span{
	background: #ff7300;
}

/* flexslider */
#featured .flexslider .slide-caption {
	border-left:5px solid #01b0f0;
}

/* Nivo slider */
.nivo-directionNav a:hover {
    background-color: #01b0f0;
}
.nivo-caption, .caption {
	border-bottom: #01b0f0 5px solid;
}

/* footer */

.profilecard
{
	border-width: 5px;
	border-color: #000000;
	box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);
	max-width: 100%; /*margin: inherit;*/
	text-align: center;
	background-color: #FFFFFF;
}
.profilecard .header
{
	border: none;
	outline: 0;
	display: inline-block;
	color: white;
	background-color: #333333;
	text-align: center;
	width: 100%;
	font-size: 18px;
	padding-top: 8px;
	padding-bottom: 8px;
}
.profilecard .footer
{
	border: none;
	outline: 0;
	display: inline-block;
	color: #FF9900;
	background-color: #333333;
	text-align: center;
	width: 100%;
	font-size: 14px;
	padding-top: 4px;
	padding-bottom: 4px;
}
.profilecard a
{
	text-decoration: none;
	font-size: 22px;
	color: #FF9900;
}

.cutout-image-container {
  /*background-image: url("img_nature.jpg"); /* The image used - important! */
  background-size: cover; 
  position: relative; /* Needed to position the cutout text in the middle of the image */
  height: 200px; /* Some height */
}
.cutout-image-container-col3 {
  /*background-image: url("img_nature.jpg"); /* The image used - important! */
  background-size: cover; 
  position: relative; /* Needed to position the cutout text in the middle of the image */
  height: 150px; /* Some height */
}
.floating-text {
  background-color:#000000c2;
  color: #FFC107;
  font-size: 2vw; /* Responsive font size */
  font-weight: bold;
  margin: 0 auto; /* Center the text container */
  padding: 10px 0px 10px 0px;
  width: 100%;
  text-align: center; /* Center text */
  position: absolute; /* Position text */
  top: 90%; /* Position text in the middle */
  left: 50%; /* Position text in the middle */
  transform: translate(-50%, -50%); /* Position text in the middle */
 /* mix-blend-mode: screen; /* This makes the cutout text possible */
}
.floating-text-medium
{
	background-color: #42423dc7;
	color: #FFFFFF;
	font-size: 10; /* Responsive font size */ /*font-weight: bold;*/
	margin: 0 auto; /* Center the text container */
	padding: 10px 0px 10px 0px;
	width: 100%;
	text-align: center; /* Center text */
	position: absolute; /* Position text */
	top: 86%; /* Position text in the middle */
	left: 50%; /* Position text in the middle */
	transform: translate(-50%, -50%); /* Position text in the middle */ /* mix-blend-mode: screen; /* This makes the cutout text possible */
}
.cutout-text {
  background-color: #ff9b00;
  color: black;
  font-size: 3vw; /* Responsive font size */
  font-weight: bold;
  margin: 0 auto; /* Center the text container */
  padding: 10px 0px 10px 0px;
  width: 100%;
  text-align: center; /* Center text */
  position: absolute; /* Position text */
  bottom: -5%; /* Position text in the middle */
  left: 50%; /* Position text in the middle */
  transform: translate(-50%, -50%); /* Position text in the middle */
  mix-blend-mode: screen; /* This makes the cutout text possible */
}