@font-face {
    font-family: 'familiar_probold';
    src: url('familiar_pro-bold-webfont.eot');
    src: url('familiar_pro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('familiar_pro-bold-webfont.svg#familiar_probold') format('svg'),
         url('familiar_pro-bold-webfont.woff') format('woff'),
         url('familiar_pro-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*
 *	
 *	kauneushoitola karosvuo
 *  DIEGO DALLA PALMA PROFESSIONAL RVB SKINLAB RESELLER
 *
 *	by MXR
 *	www.mxr.fi
 *
*/




/* -------------------- basic -------------------- */
body {
	color: #000000;
  	background-color: #ffffff;
  	padding-top: 150px;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 300;
}

body {
	line-height: 0;
}

body .container {
	line-height: 20px;
}

.featurette {
	text-align: center;
}

.stripe {
	padding: 50px 0 50px 0;
	background: #f3f2f4;
}

.note {
	font-style: italic;
}

ul {
	list-style-type: none;
}

.heading {
	font-weight: bold;
}

a {
	color: #000000;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
	color: #000000;
}

.btn-link, .button {
	line-height: 120%;
	border: 1px solid #efeeee;
	background: #efeeee;
	color: #000000;
	font-size: 22px;
	cursor: pointer;
	padding: 20px 0;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	width: 350px;
	overflow: hidden;
	text-decoration: none;
	text-align: center;
	font-family: 'familiar_probold', arial, helvetica, sans-serif;
	display: block;
	margin-left:auto;
	margin-right:auto;
}

.btn-link:hover {
    border: 1px solid #000000;
    background: #000000;
    color: #ffffff;
	text-decoration: none;
}

.clear {
	clear: both;
}

/* -------------------- fonts -------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family:  'familiar_probold', arial, helvetica, sans-serif;
	font-weight : normal;
	margin-top: 0px;
}

h1, h2 {
	font-size: 31.5px;
}

.navbar-inverse .navbar-inner {
  background-color: #130f10;
  background-image: none;
  border-color: #130f10;
  filter: none;
}


/* -------------------- nav -------------------- */
.navbar .brand img {
	padding-bottom: 5px;
}

.navbar {
	background-color: #130f10;
}

.navbar .nav {
	margin: 9px 10px 0 0;
}

.navbar ul.nav li {
	text-transform: uppercase;
}

.navbar ul.nav li.facebook {
	text-transform: lowercase;
}

.navbar ul li a {
	font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-size: 13px;
}

.navbar .nav > li > a {
	font-size: 12px;
	padding: 15px;
}

/*
.navbar .nav > li.facebook > a,
.navbar .nav > li.instagram > a {
    padding: 15px 8px 15px 0;
    margin-left: 8px;
}

.navbar .nav > li.facebook > a {
    background: url(/images/content/facebook-grey.png) no-repeat left center !important;
}

.navbar .nav > li.facebook > a:hover {
    background: url(/images/content/facebook-white.png) no-repeat left center !important;
}

.navbar .nav > li.instagram > a {
    background: url(/images/content/instagram-grey.png) no-repeat left center !important;
}

.navbar .nav > li.instagram > a:hover {
    background: url(/images/content/instagram-white.png) no-repeat left center !important;
}
*/

.nav-collapse .nav > li > a, 
.nav-collapse .dropdown-menu a {
	font-weight: normal;
}

.navbar-inverse .nav-collapse .nav > li > a:hover, 
.navbar-inverse .nav-collapse .dropdown-menu a:hover {
	color: #ffffff;
}

.navbar-inner {
	padding-top: 5px;
}

body.index .navbar .nav .home a {color: #ffffff;}
body.treatments .navbar .nav .treatments a {color: #ffffff;}
body.products .navbar .nav .products a {color: #ffffff;}
body.giftcard .navbar .nav .giftcard a {color: #ffffff;}
body.prices .navbar .nav .prices a {color: #ffffff;}
body.company .navbar .nav .company a {color: #ffffff;}
body.news .navbar .nav .news a {color: #ffffff;}
body.book .navbar .nav .book a {color: #ffffff;}
body.contact .navbar .nav .contact a {color: #ffffff;}


/* -------------------- marketing -------------------- */
.container.marketing {
	padding: 80px 0 40px 0;
}

.container.marketing .featurette h2 {
	padding-top: 50px;
}

.container.marketing .featurette-image.pull-left {
	padding-right: 50px;
} 

.container.marketing .featurette-image.pull-right {
	padding-left: 50px;
} 


/* -------------------- index -------------------- */
body.index {
  padding-top: 40px;
}

body.index .billboard {
  background: #130f10;
}

body.index .btn-link.billboard {
	width: auto;
	margin-bottom: 15px;
    border: 1px solid #343032;
	background: #343032;
	color: #efeeee;
	display: inline;
	padding: 10px 50px;
}

body.index .btn-link.billboard:hover {
    border: none;
    border: 1px solid #130f10;
	background: #343032;
	color: #efeeee;
}

body.index .billboard p.book {
  padding-top: 10px;
}

body.index .billboard .featurette-heading {
  color: #ffffff;
  padding-top: 150px;
}

body.index .billboard .lead {
  color: #ffffff;
}

body.index .btn-link.index {
	font-size: 16px;
	margin-bottom: 15px;
	padding: 10px 0;
	width: 50%;
	background: #000;
    border: 1px solid #000;
	color: #fff;
}

body.index .btn-link.index:hover {
	background: #ffffff;
    border: 1px solid #ffffff;
	color: #000;
}

body.index #cff .cff-post-text {
	font-size: 14px;
	line-height: 20px;
}

body.index #cff .cff-item {
    border-bottom: 0;
    padding: 0;
}

body.index  #cff .cff-item p {
    padding: 0 20px;
    margin: 0 0 10px 0;
}

body.index #cff.thumb-layout .cff-text-wrapper {
	float: none;
	width: 100%;
}


body.index  #cff a:hover {
    text-decoration: none;
}

body.index .span4 p {
/*	width: 100%;*/
}


/* -------------------- info -------------------- */
.container.info {
	padding: 40px 0 40px 0;
	text-align: center;
}

.container.info h2,
.container.info p {
	padding: 0 20px;
}


/* -------------------- treatments -------------------- */
body.treatments .stripe {
	padding: 0;
}

.lang {
	float: right;
}

body.treatments .stripe.footer {
	padding: 50px 0 50px 0;
}

.container.treatments table {
	width: 90%;
}

.container.treatments {
	text-align: left;
	padding: 40px 0 40px 0;
}

.container.treatments.first {
	padding-top: 0;
}

.container.treatments tr.heading {
	background: #eee;
	font-family: 'familiar_probold', arial, helvetica, sans-serif;
	font-weight : normal;
	text-transform: uppercase;
	font-size: 16px;
}

.container.treatments tr.heading td {
	padding: 6px 8px;
} 

.stripe .container.treatments tr.heading {
	background: #fff;
}

.container.treatments td.price {
	text-align: right;
	white-space: nowrap;
}

.container.treatments td.description {
	padding: 6px 50px 20px 6px;
}

body.treatments .sidebar {
	width: 90%;
	float: right;
}

body.treatments .sidebar div {
	overflow: hidden;
	margin-bottom: 10px;
}

body.treatments .sidebar p {
	font-style: italic;
	font-size: 12px;
	width: 95%;
}

body.treatments .btn-link.treatments {
    border: 1px solid #130f10;
    background: #130f10;
    color: #efeeee;
	font-size: 16px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	width: 95%;
	margin-left: 0;
}

body.treatments .btn-link.treatments:hover {
	border: 1px solid #ffffff;
	background: #130f10;
	color: #efeeee;
}

body.treatments .book {
	margin: 0;
	padding-bottom: 20px;
	overflow: hidden;
}

body.treatments .book li {
	float: left;
	padding: 2px 20px 2px 30px;
}

body.treatments .book li.online {
	background: url(/images/icons/nettiajanvaraus_3.png) center left no-repeat;
}

body.treatments .book li.phone {
	background: url(/images/icons/puhelinajanvaraus_3.png) center left no-repeat;
}


/* -------------------- news -------------------- */
body.news #cff {
	width: 80%;
}

body.news #cff .cff-post-text {
	font-size: 14px;
	line-height: 120%;
	margin-bottom: 20px;
}

body.news .container.fb {
	padding: 0 0 40px 0;
}

body.news .container.fb h2 {
	padding-top: 0;
}

body.news .more-fb {
	padding-top: 20px;
}

body.news #cff .cff-viewpost {
	display: none;
}


/* -------------------- products -------------------- */
.foo-products {
	overflow: hidden;
	padding: 100px 100px 50px 100px;
}

body.products .container.marketing.first {
	padding-top: 0;
}

body.products .container.marketing.first .featurette {
	margin-top: 50px;
}

.container.products p {
	font-size: 18px;
	line-height: 120%;
	margin-bottom: 20px;
}

body.products .container.marketing h2.anti-age {
	padding-top: 150px;
}

body.products .container.marketing h2.hydrating {
	padding-top: 50px;
}

body.products .container.marketing h2.sensitive,
body.products .container.marketing h2.purifying {
	padding-top: 100px;
}

body.products .container.products .span6 {
	text-align: center;
}

body.products .container.products .span6 p {
	padding: 0 15px;
}

body.products .btn-link.products {
    border: 1px solid #130f10;
    background: #130f10;
    color: #efeeee;
    display: inline;
    padding: 20px 50px;
}

body.products .btn-link.products:hover {
	border: 1px solid #ffffff;
	background: #130f10;
	color: #efeeee;
}

body.products div.button {
	overflow: hidden;
	padding: 25px 0;
}


/* -------------------- company -------------------- */
.container.company {
	margin-bottom: 40px;
}

.container.company .span6 p {
	font-size: 18px;
	line-height: 120%;
	margin-bottom: 20px;
}

.container.company .span6 {
	margin-bottom: 40px;
}

.container.company .company-img img {
	float: right;
}

body.company .span6.staff {
	margin-top: 80px;
}

body.company .container .span6 li {
	font-size: 18px;
	line-height: 150%;
}

body.company .container .span6 ul {
	margin-left: 0;
}


/* -------------------- contact -------------------- */
.container.contact ul {
	margin: 0 0 20px 0;
}

.map {
	margin-bottom: 20px;
	width: 500px;
	height: 420px;
 	-webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);	
}

.container.contact {
	margin-bottom: 40px;
}

.container.staff .span4 {
	text-align: center;
}

.container.staff h3 {
	margin-bottom: 0;
}

.container.staff .row.first {
	margin-bottom: 40px;
}

.container.staff img {
	margin-bottom: 10px;
}

body.contact .container .span6 li {
	font-size: 18px;
	line-height: 150%;
}

body.contact .container .span6 ul {
	margin-left: 0;
}

body.contact .span6.text {
	margin-top: 80px;
}



/* -------------------- footer -------------------- */
.stripe.footer {
	padding: 50px 0 50px 0;
	background: #130f10;
}

.stripe.footer .logos img {
	padding-bottom: 20px;
}

.stripe.footer li,
.stripe.footer a {
	color: #a9a6a8;
}

.stripe.footer li.heading {
	color: #ddd;
}

.stripe.footer ul {
	list-style-type: none;
}

.stripe.footer a:hover {
	text-decoration: none;
	color: #ffffff;
}

.stripe.footer {
	padding: 80px 0 40px 0;
}

.stripe.footer .copy p {
	margin-left: 25px;
	color: #444!important;
}

.stripe.footer .copy a {
	color: #444!important;
}

.stripe.footer .copy a:hover {
	color: #fff!important;
}

.stripe.footer .btn-link, 
.stripe.footer .button {
	line-height: 120%;
	border: 1px solid #fff;
	background: #fff;
	color: #000000;
	font-size: 14px;
	padding: 10px 25px;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	width: auto;
	display: inline-block !important;
	margin-top: 15px;
}

.stripe.footer .btn-link:hover, 
.stripe.footer .button:hover {
	color: #000 !important;
}

/* -------------------- responsive -------------------- */
@media (max-width: 979px) {
	body {
    	padding: 100px 0 0 0;
  	}

	body.index {
    	padding: 40px 0 0 0;
  	}

	.navbar-fixed-top {
	    position: fixed;
	    margin-bottom: 40px;
	}

	.navbar .nav > li > a {
		padding: 8px;
	}

	.navbar ul.nav li {
		padding-left: 10px;
		padding-right: 10px;
	}

	.nav-collapse .nav > li.facebook > a { 
		padding: 8px;
	}

  	.navbar,
  	.container.marketing,
  	.container.treatments {
		padding-right: 20px;
    	padding-left: 20px;
  	}

	.navbar-inverse .nav-collapse .nav > li > a:hover, 
	.navbar-inverse .nav-collapse .dropdown-menu a:hover {
		background: #2c282a;
	}

	.featurette .lead {
		font-size: 16px;
	}

	.navbar-inverse .nav-collapse .nav > li > a, 
	.navbar-inverse .nav-collapse .dropdown-menu a {
		/*border-bottom: 1px solid #2c282a;*/
	}

	.featurette-image.pull-left, .featurette-image.pull-right {
		float: none;
	}

	.container.marketing h2 {
		padding-top: 0;
	}

	.container.info {
		padding: 20px 0 20px 0;
	}

	.container.info h2 {
		padding: 0 20px 0 20px;
	}

	/* index */
	body.index .billboard .featurette-heading {
		padding-top: 40px;
	}

	body.index p.book {
		margin-bottom: 40px;
	}

	body.index .span4 {
		margin-bottom: 30px;
	}

	.billboard .featurette {
		padding: 0 20px;
	}

	.billboard .featurette-heading {
		padding-top: 25px;
	}

	.container.treatments table {
		width: 100%;
	}

	body.treatments .sidebar {
		width: 100%;
		float: left;
	}

	.btn-link.treatments {
		float: left;
	}

	.container.info p {
		/*margin: 0 20px 20px 20px;*/
		float: left;
	}

	.container.prices {
		padding: 20px;
	}

	.foo-products {
		overflow: hidden;
		padding: 0 50px 50px 50px;
	}

	body.products .container.marketing h2.anti-age,
	body.products .container.marketing h2.hydrating,
	body.products .container.marketing h2.sensitive,
	body.products .container.marketing h2.purifying {
		padding-top: 0;
	}

	.container.contact,
	.container.company {
		margin: 0 25px;
	}

	.container.staff .row.first {
		margin-bottom: 0;
	}

	.container.staff p {
		margin-bottom: 25px;
	}

	.container.treatments table {
		width: 100%;
	}

	.map {
		width: 400px;
		height: 250px;
	}

	body.news #cff {
		width: 100%;
	}

	body.news .container.fb {
		padding: 0 20px 40px 20px;
	}

	#cff .cff-post-text {
		font-size: 16px;
	}

	.container.company .span6 p {
		font-size: 16px;
		line-height: 120%;
	}

	.container.company .company-img img {
		float: none;
	}

	body.company .span6.staff {
		margin-top: 0;
	}

	body.contact .span6.text {
		margin-top: 0;
	}

	body.company .container .span6 li {
		font-size: 14px;
	}

	body.contact .container .span6 li {
		font-size: 14px;
	}

	body.index .stripe h2 {
		font-size: 28px;
	}



}

@media (max-width: 480px) {
	.navbar .brand img {
		max-width: 80%;
	}

	.navbar .nav > li > a {
		font-size: 12px;
		padding: 4px;
	}

	h1, h2 {
		font-size: 28px;
	}

	.container.staff {
		text-align: center;
	}

	.nav-collapse .nav > li.facebook > a { 
		font-weight: bold;
		font-size: 15px;
		padding: 4px;
	}

	.container.marketing .featurette-image.pull-left {
		padding-right: 0;
	} 

	.container.marketing .featurette-image.pull-right {
		padding-left: 0;
	} 

	.btn-link {
		margin-top: 20px;
		font-size: 16px;
		padding: 14px 0px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		width: 250px;
	}

	body.products .btn-link.products {
	    padding: 10px 20px;
	}

	.stripe {
		padding: 20px 0;
	}

	.map {
		width: 270px;
		height: 200px;
	}

	.foo-products {
		overflow: hidden;
		padding: 0 20px 20px 20px;
	}

	.container.staff img {
		max-width: 80%;
	}

	#cff.half-layout .cff-text-wrapper {
		float: left;
		width: 100%;
	}

	#cff.half-layout .cff-photo, #cff.half-layout iframe, #cff.half-layout .cff-vidLink {
		width: 100%;
		clear: none;
	}

	.container.company .span6, 
	body.contact .span6 {
		text-align: center;
	}

}


/* -------------------- misc -------------------- */
.foo {
	border: 1px solid #00ffff;
}