/*
Theme Name: Oliv
Theme URI: http://tanshcreative.com/oliv-st-preview/index.html
Description: Oliv template is designed and developed by Tansh.
Author: Tansh
*/

/*
Searching for particular element?
Here is CSS structure...

	1. TEMPLATE SETUP
			1.1 Reset 
			1.2 General styles
			1.3 Typography - paragraph, headings, common heading styles, text styles used in pages, dropcaps, text highlight, deafault link styles 
			1.4 Button and link styles 
			1.5 Image styles
			1.6 List styles
			1.7 Dividers and spacers
			1.8 Basic layout divs
                        1.9 Tabs (no longer in skeleton.css & new format)
	
	2. TEMPLATE STRUCTURE
			2.1  header
			2.2  slider
			2.3  header_bottom
			2.4  CSS for pages and Misc
			                2.4.0 main page
					2.4.1 about 
					2.4.2 services (replaced with treatments)
					2.4.3 product gallery
					2.4.4 packages 
					2.4.5 faq page
					2.4.6 contact and appointment
					2.4.7 blog
					2.4.8 Misc
					2.4.9 About CACI
					2.4.10 CACI in the news
			2.5  footer
					- copyright
			2.6  footer_bottom
			2.7  forms 
					- subscribe form
					- contact form
					- appointment form
	
	3. MEDIA QUERIES
	
	4. BROWSER FIXES



/*============================================================*/
/*---------- 1. TEMPLATE SETUP ----------*/
/*============================================================*/

/*----------------------------------------*/
/*----- 1.1 Reset -----*/
/*----------------------------------------*/
/* From - http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
        border-collapse: collapse;
	border-spacing: 0;
}
/*----------------------------------------*/
/*----- 1.2 General styles -----*/
/*----------------------------------------*/
body {
/*	background: #f4eef0; */
	background: #FCF7F9; /* BeauSkin */
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 13px;
	color: #404040;
	font-weight: 400;
	line-height: 1.6em;
}
img, embed, object, video {
	max-width: 100%;
	height: auto;
}
video {
	width: 100% !important;
	height: auto !important;
}
strong {
	font-weight: bold;
}
italic {
        font-style: italic;
}
/*----------------------------------------*/
/*----- 1.3 Typography -----*/
/*----------------------------------------*/
/*Here only common typography styles are given, 
page specific styles are in respective section*/

/*----- paragraph ----- */
p {
	padding-bottom: 10px;
/*	text-align: justify;*/
}
/* ----- headings ----- */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	color: #2d2d2d;
	font-weight: 300;
	line-height: 1.3em;
	font-style: normal;
	word-spacing: 1px;
}
h1 {
	font-size: 24px;
	margin-bottom: 15px;
}
h2 {
	font-size: 20px;
	margin-bottom: 15px;
	line-height: 1em;
}
h2 span {
	font-size: 11px;
	color: #656565 !important;
	display: block;
}
h3 {
	font-size: 18px;
	margin-bottom: 15px;
}
h4 {
	font-size: 16px;
	margin-bottom: 15px;
}
h5 {
	font-size: 13px;
	margin-bottom: 10px;
	font-weight: 600;
}
h6 {
	font-size: 12px;
	margin-bottom: 3px;
	font-weight: 700;
}
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong {
	font-weight: 600 !important;
}
sup {
	vertical-align: super;
	font-size: smaller;
}
#footer h5 {
	font-weight: 300;
	margin-bottom: 15px;
}
/* ----- text styles ----- */
.text_big {
	font-size: 17px;
	font-weight: 400;
	line-height: 1.4em;
	padding-bottom: 20px;
}
.text_medium {
	font-size: 10px;
	font-weight: 400;
}
.text_small {
	font-size: 8px;
	font-weight: 400;
}
.text_size_h4 {
        font-size: 16px;
}
/*----- dropcaps -----*/
.dropcap1 {
	font-size:35px;
	color:#525252;
	line-height:25px;
	margin:5px 10px 0px 0px;
	display:block;
	float:left;
}
.dropcap2 {
	font-size:35px;
	color:#525252;
	line-height:25px;
	font-style: italic;
	margin:5px 15px 0px 0px;
	display:block;
	float:left;
}
/*----- text highlight -----*/
.highlight_pink {
	background:#ffc9c9;
	color: #525252;
}
.highlight_blue {
	background:#bdeefe;
	color: #525252;
}
.highlight_yellow {
	background:#fee9bd;
	color: #525252;
}
.highlight_black {
	background:#353535;
	color:#fff
}
.highlight_gray {
	background:#dbdbdb;
	color: #525252;
}
/*----- text color -----*/
.green_text_zone {
        color: #4ca514 !important;
}
.red_text_zone {
        color: #ff3a14 !important;
}
.blue_text_zone {
        color: #555df5 !important;
}
.beauskin_pink_text_zone {
        color: #dd395f !important;
}
.beauskin_offer_green_text_zone {
        color: #84fe42 !important;
}
/*----- char space -----*/
.wide_char_spacing {
        letter-spacing: 2px;
}
/*----- some padding on left -----*/
.pad_left_10px {
        padding-left: 10px;
}
/*----- blockquote -----*/
blockquote {
	margin: 10px 0px 10px 30px;
	border-left: 3px solid #dbdbdb;
	padding-left: 10px;
	font-style: italic;
}
/* ----- default links ----- */
a {
	color: #dd395f;
	text-decoration: none;
	cursor: pointer;
	font-style: normal;
	outline: none;
}
a:hover {
/*        color: #404040;*/
        color: #a0092b;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	color: #2d2d2d;
}
/*----------------------------------------*/
/*----- 1.4 Button and link styles -----*/
/*----------------------------------------*/

/*----- button with arrow -----*/
.button_yellow {
	background: #f2cb55; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fef291', endColorstr='#f2cb55'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#fef291), to(#f2cb55)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #fef291, #f2cb55); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #fef291, #f2cb55);
	padding: 11px 20px 10px 20px;
	margin-top: 10px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 14px;
	color: #d18314 !important;
	line-height: 14px;
	font-weight: 700;
	text-transform: uppercase;
	border: 1px solid #c46e1a;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-border-radius: 5px;
	display: inline-block;
}
.button_yellow:hover {
	background: #fef291; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2cb55', endColorstr='#fef291'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#f2cb55), to(#fef291)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #f2cb55, #fef291); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #f2cb55, #fef291);
}
/*----- button (grey) -----*/
.button {
	background: #626262; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7d7d', endColorstr='#626262'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#7d7d7d), to(#626262)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #7d7d7d, #626262); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #7d7d7d, #626262);
	padding: 7px 10px;
	margin-top: 10px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 10px;
	color: #ffffff;
	line-height: 10px;
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
	border: none;
	display: inline-block;
	border: 1px solid #535353;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
	-webkit-box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
	box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
}
.button:hover {
	background: #7d7d7d; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#626262', endColorstr='#7d7d7d'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#626262), to(#7d7d7d)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #626262, #7d7d7d); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #626262, #7d7d7d);
	color: #ffffff;
}
/*----- link with arrow sign (used in slider caption) -----*/
a.link_arrow {
	background: url(../images/slider-caption-arrow.png) no-repeat right 2px;
	width: 20px;
	height: 20px;
	padding-left: 5px;
	text-indent: -9999px;
	display: inline-block;
}
a.link_arrow:hover {
	background: url(../images/slider-caption-arrow.png) no-repeat right -18px;
}
/*----- upparcase and colored link -----*/
a.link_style {
	font-size: 14px;
	color: #dd395f;
	font-weight: 700;
	text-transform: uppercase;
}
a.link_style:hover {
	color: #404040;
}
/*----------------------------------------*/
/*----- 1.5 Image styles -----*/
/*----------------------------------------*/
.image_border {
	background: #ffffff;
	padding: 4px;
	margin: 0px 0px 10px 0px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	display: block;
	float: none;
}
.image_left {
	background: #ffffff;
	padding: 4px;
	margin: 0px 10px 0px 0px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float: left;
}
.image_right {
	background: #ffffff;
	padding: 4px;
	margin: 0px 0px 0px 10px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float: right;
}
.image_left_noborder {
	margin: 0px 10px 0px 0px;
	float: left;
}
.image_right_noborder {
	margin: 0px 0px 0px 10px;
	float: right;
}
.image_center {
        display: block;
        margin-left: auto;
	margin-right: auto;
}
img.supplier_logo {
        width: 150px;
	opacity:0.7;
	filter:alpha(opacity=40); /* For IE8 and earlier */
}
img.supplier_logo:hover {
        width: 150px;
	opacity:1.0;
	filter:alpha(opacity=100); /* For IE8 and earlier */
}
/*----- Zoom icon -----*/
.thumb {
	position:relative;
	overflow:hidden;
}
.thumb .zoom {
	background: url(../images/zoom.png) 0 0 no-repeat transparent;
	width: 48px;
	height: 48px;
	position:absolute;
	/*left:-60px;*/
	left:0;
	right:0;
	margin-left:auto;
	margin-right:auto;
	top:50%;
	margin-top: -24px;
	outline: none;
	opacity: 0;
}
.thumb .zoom:hover {
	background: url(../images/zoom.png) 0 -48px no-repeat transparent;
}
/*----------------------------------------*/
/*----- 1.6 List styles -----*/
/*----------------------------------------*/
ul.list_arrow li {
	background: url(../images/bullet-circled-arrow.png) no-repeat 0 0 !important;
	padding-left:30px;
	margin-bottom: 10px !important;
	line-height: 1.7em;
	display: block;
	list-style-type: none;
}
ul.list_circle li {
	background: url(../images/bullet-circles.png) no-repeat 0 5px !important;
	padding-left: 20px;
	margin-bottom: 10px !important;
	line-height: 1.7em;
	display: block;
	list-style-type: none;
}
ul.list_bullet li {
	background: url(../images/bullet-circles.png) no-repeat 0 5px !important;
	padding-left: 20px;
	margin-bottom: 10px;
	font-size: 14px;
	list-style-type: none;
}
ul.list_numberbg li {
	background: none;
	margin-bottom: 10px !important;
	list-style-type: none;
	display: block;
}
ul.list_nobg li {
	background: none;
	list-style-type: none;
	margin-bottom: 10px;
}
ul.list_circle_features li {
	background: url(../images/bullet-circles.png) no-repeat 0 5px !important;
	padding-left: 20px;
	line-height: 1.7em;
	display: block;
	list-style-type: none;
}
/*----------------------------------------*/
/*----- 1.7 Dividers and spacers -----*/
/*----------------------------------------*/
.divider {
	width: 100%;
	margin: 20px 0px;
	border-top: 1px dashed #e5e5e5;
	display: inline-block;
}
/* divider with line */
.divider_line {
	border-top: 1px solid #e5e5e5;
	width: 100%;
	margin: 10px 0px;
	display: inline-block;
}
/*divider for footer*/
.divider_footer {
	background: url(../images/footer-divider.png) repeat-x;
	width: 100%;
	height: 2px;
	margin: 10px 0px;
	display: inline-block;
}
/*divider for treatment description*/
.divider_treatment {
	width: 100%;
	margin: 0px 0px;
	border-top: 1px dashed #e5e5e5;
	display: inline-block;
}
/*spacer*/
.spacer_10px {
	width: 100%;
	height: 10px;
	background: none;
	display: inline-block;
}
.spacer_20px {
	width: 100%;
	height: 20px;
	background: none;
	display: inline-block;
}
.spacer_30px {
	width: 100%;
	height: 30px;
	background: none;
	display: inline-block;
}
/*----------------------------------------*/
/*----- 1.8 Basic layout divs -----*/
/*----------------------------------------*/
/*columns system has separate CSS - skeleton.css*/
#wrapper_outer {
	width: 980px;
	margin: 0 auto;
}
#wrapper {
	background: #ffffff;
	width: 980px;
	-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
}
#content {
	padding: 20px 0px 20px 0px;
	display: block;
}
#content_withsidebar {
	float: left;
}
#sidebar {
	width: 95%;
	padding-left: 5%;
	display: inline-block;
}
#sidebar_left {
	width: 95%;
	padding-right: 5%;
	float: left;
}
/*----------------------------------------*/
/*----- 1.9 TABS -----*/
/*----------------------------------------*/
#tabs ul {
    display: block;
    margin-bottom: 20px;
    clear: both;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: url(../images/icon-tab.png) no-repeat 0 0;
    padding-left: 32px;
    overflow: hidden;
}
#tabs ul li {
    display: block;
    width: auto;
    padding: 0;
    float: left;
    margin-bottom: 0;
}
#tabs ul li a {
    font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
    font-size: 12px;
    color: #2d2d2d;
    font-weight: 700;
    line-height: 1em;
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
    padding-right: 20px;
    border: none;
    margin: 0px 0px 10px 0px;
}		
#tabs ul li.active a {
    color:#dd395f !important;
}				
#panels {
    background: transparent;
    margin: 0;
    display: block;
    border: none;
    padding: 0;
}
#panels .panel-wrapper {
}
#panels .panel {
}
#tabs:before, #tabs:after
{
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
#tabs:after {
    clear: both;
}
#tabs {
    zoom: 1;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */		
/*============================================================*/
/*---------- 2. TEMPLATE STRUCTRE ----------*/
/*============================================================*/

/*----------------------------------------*/
/*----- 2.1 header -----*/
/*----------------------------------------*/
#header {
	background: url(../images/header-bg.png) no-repeat center top #450000; /* BeauSkin colour */
/*	padding: 20px 10px 20px 10px;*/
	padding: 20px 10px 0px 10px;
	margin: 0px 0px 20px 0px;
	line-height: 1em;
	-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	display: block;
}
.header-logo img {
    display: block;
    margin-left:auto;
    margin-right:auto;
    margin-top: 10px;
}
.header-slogan h3 {
    padding-left: 35px;
    padding-top:38px;
    margin-bottom: 15px;
    line-height: 1em;
    font-size: 20px;
    color:white;
    text-align:center;
    font-style: italic;
    font-weight: 400;
}
.header-contact img {
/*    padding-top: 32px;*/
    padding-top: 45px;
    display:inline;
    float:right;
}
.header-contact a {
    color: white;
}
.header-contact p {
    float:right;
/*    padding-top: 41px;*/
    padding-top: 56px;
    display:inline;
    font-weight: 400;
    font-size: 20px;
    text-align: right;
    text-transform: uppercase;
    color: white;
    letter-spacing:2px;
}
.header-contact a span {
    color: #FE9DC1;
    position: absolute;
    width: 20%;
    right: 10px;
    margin-top: 10px;
    display: block;
    font-size: 10px;
    font-style: italic;
}
.header-contact a:hover span {
    color: #a0092b;
}
/*----- navigation -----*/
#menu-wrapper {
    margin:10px 0 0 0;
    padding: 0;
}
/*----- page header -----*/
#page_header {
	background: url(../images/widgetised-footer-bg.jpg) repeat #fbfbfb;
	padding: 20px 10px;
	border-bottom: 1px solid #efefef;
	display: block;
}
#page_header h1 {
	font-size: 30px;
	color: #656565;
	margin-bottom: 0px;
	line-height: 1em;
}
#page_header h1 span {
	font-size: 16px;
	font-weight: bold;
	color: #a0092b !important;
	display: block;
	margin-top: 10px;
	font-style: italic;
}
/*----------------------------------------*/
/*----- 2.2 slider -----*/
/*----------------------------------------*/
/*--Typography and other properties for sliders are in their respective stylesheets--*/
#slider_wrapper {
	width: 100%;
	background: #f4eef0;
	padding: 0;
	border: none;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
/*----------------------------------------*/
/*----- 2.3 header_bottom -----*/
/*----------------------------------------*/
#header_bottom {
	background: url(../images/pattern-wood.jpg) repeat;
	padding: 20px 10px;
	margin: 0;
	color: #ffffff;
	font-weight: 400;
	display: block;
}
#header_bottom h1 {
	font-size: 32px;
	color: #ffffff;
	font-weight: 300;
	line-height: 1em;
	margin-bottom: 5px;
}
#header_bottom h3 {
	color: #ffffff;
	font-weight: 400;
}
#header_bottom h4 {
	font-size: 16px;
	color: #ffe095;
	font-weight: 700;
}
#header_bottom a {
	font-size: 13px;
	color: #ffffff;
	font-weight: bold;
	text-transform: uppercase;
}
#header_bottom a:hover {
	color: #ffe095;
}
#header_bottom p {
	padding-bottom: 5px;
}
/*----------------------------------------*/
/*----- 2.4 CSS for pages and Misc -----*/
/*----------------------------------------*/
/*----- box -----*/
.full_width_box {
    background: #ffffff;
    width: 180px;
    padding: 19px;
    margin: 0px;
    border: 1px solid #e6e6e6;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -moz-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    -webkit-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    float: left;
}
.box, .widebox {
    background: #ffffff;
    width: 260px;
    padding: 19px;
    margin: 0px;
    border: 1px solid #e6e6e6;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -moz-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    -webkit-box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.05) inset;
    float: left;
}
.widebox {
    width: 396px;
}
/*===== ----- =====*/
/*----- 2.4.0 main page -----*/
/*===== ----- =====*/
.mainpage_box {
    padding: 2px;
    width: 296px; /* -4px */
    margin-bottom: 10px;
    background: #a0092b;
    float: left;
    display: inline;
    border-top-left-radius: 20px;
    -moz-border-top-left-radius: 20px;
    -webkit-border-top-left-radius: 20px;
    -o-border-top-left-radius: 20px;
}
.mainpage_box .contents {
    padding: 18px;
    background: white;
    overflow: auto;
}
.mainpage_box h3 {
    padding: 6px;
    color: white;
    letter-spacing: 2px;
    text-align: center;
    margin-bottom: 2px;
}
.mainpage_box h4 {
    /* Similar to h5 style */
    font-size: 13px;
    margin-bottom: 10px;
}
.mainpage_box img {
    background: #ffffff;
    padding: 4px;
    display: block;
}
.mainpage_box a {
    color: #dd395f;
    text-decoration: none;
    cursor: pointer;
    font-style: normal;
    outline: none;
}
.mainpage_box a:hover {
    color: #a0092b;
    text-decoration: underline;
}
.mainpage h3 {
    font-weight: 600;
    color: #656565;
}
.mainpage h3 span {
    display: block;
    font-size: 11px;
    font-weight: 600;
}
.mainpage iframe {
    width: 450px; /* -10px */
    height: 283px;
}
.mainpage .text_with_scroll {
    overflow:auto;
    height:338px;
}
/*===== ----- =====*/
/*----- 2.4.1 about page -----*/
/*===== ----- =====*/

/*----- owner list -----*/
ul.list_owner li {
	margin-bottom:  20px;
	background: none;
	list-style-type: none;
	display: block;
}
ul.list_owner li h6 {
	font-size: 11px;
	text-transform: uppercase;
	margin-bottom: 0px;
	padding-top: 13px;
}
ul.list_owner li h6 span {
	font-size: 10px;
	color: #404040;
	font-weight: 400;
	text-transform: none;
	padding-top: 3px;
	display: block;
}
ul.list_owner li img {
	background: #ffffff;
	padding: 4px;
	margin-right: 10px;
	margin-bottom: 10px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float: left;
}
ul.list_owner li p {
	text-align: justify;
}
/*----- non-slider testimonial -----*/
ul.about-us li p {
    color: #a0092b;
}
ul.about-us li span {
    display: block;
    font-weight: 600;
}
/*----- testimonial slider -----*/
.testimonial-slider {
	font-size: 14px;
	color:#656565;
	font-style: italic;
	font-weight: 400;
	line-height: 1.5em;
	padding-top: 20px !important;
}
.testimonial-slider span {
	font-size: 12px;
	font-weight: 600;
}
.circle_color {
	margin-right: 30px;
	margin-bottom: 50px;
	background: #dd395f;
	width: 60px;
	height: 60px;
	border-radius: 60px;
	-moz-border-radius: 60px;
	-webkit-border-radius: 60px;
	float: left;
}
.circle_color img {
	margin-left: 16px;
	margin-top: 20px;
	float: left;
}
/*----- features -----*/
.features {
	font-size: 16px;
	color: #2d2d2d;
	text-align:center;
	font-weight: 600;
	padding: 10px 50px 0px 50px;
}
.features img {
	margin-bottom: 10px;
}
/*===== ----- =====*/
/*----- 2.4.2 treatments page -----*/
/*===== ----- =====*/
.treatment_name {
    display: inline-block;
    vertical-align: top;
    width: 63%;
}
.treatment_price {
    display: inline-block;
    vertical-align: top;
    width: 36%;
}
.treatment h3 {
    margin-top:15px;
    font-weight: 600;
    color: #a0092b;
}
.treatment_name h3 span {
    display: block;
    margin-bottom: -10px;
}
.treatment_name h3 span span {
    display: inline-block;
    font-size: 11px;
    text-transform: uppercase;
    color: #aaaaaa;
}
.treatment_price h3 {
    text-align:right;
}
.treatment_price h3 span {
    display: block;
    font-size: 11px;
    margin-bottom: -15px;
}
.treatment_price.special h3 {
    color: #03e903;
    text-align:right;
    font-style: italic;
}
.treatment p {
    /*letter-spacing: 0.2px;*/
    font-size:13px;
    text-align:justify;
}
.treatment li {
    list-style-type: square;
    margin-left: 16px;
    font-size: 13px;
}
.treatment ul {
    margin-bottom: 10px;
}
.treatment .ingredients, .treatment .details {
    margin-left: 16px;
}
.treatment .ingredients p span{
    display: block;
}
.infoblock {
    background: #fff0fc;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
}
.infoblock.jcarousel_wrapper {
    background: none;
    padding-top: 0px;
    padding-bottom: 0px;
}
.infocentre h3 {
    font-weight: 600;
    color: #656565;
}
.infocentre h4 {
    font-size: 14px;
    margin-bottom: 2px;
    color: #a0092b;
}
.infocentre li {
    list-style-type: square;
    margin-left: 16px;
}
.thumbs img {
    border: 1px solid #aaaaaa;
    height: 70px;
}
.thumbs li {
    display: inline-block;
}
p.divider_with_text {
    overflow: hidden;
    text-align: center;
    color: #aaaaaa;
    font-size: 20px;
    font-weight: 300;
}
p.divider_with_text:before, p.divider_with_text:after {
    background-color: #aaaaaa;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 50%;
}
p.divider_with_text:before {
    right: 0.5em;
    margin-left: -50%;
}
p.divider_with_text:after {
    left: 0.5em;
    margin-right: -50%;
}
.button_contact {
    background: #fff0fc; /* for non-css3 browsers */
    padding: 20px 20px 20px 20px;
    font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
    font-size: 14px;
/*    font-weight: 700;*/
    color: #a0092b !important;
    line-height: 16px;
/*    text-transform: uppercase;*/
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    display: block;
}
.button_contact:hover {
    border: 1px solid #a0092b;
    padding: 19px;
}
.infocentre a.button_contact img {
    display: block;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}
.infocentre a.button_contact span {
    display: block;
    margin: 0px;
    font-size: 11px;
    text-transform: uppercase;
}
.infocentre a.button_contact span.disclaimer {
    margin-top: 10px;
    font-size: 10px;
    text-transform: none;
}
.infocentre a.button_contact img.top {
    width: 38px;
    margin-bottom: 20px;
}
.infocentre a.button_contact img.bottom {
    width: 70%;
    margin-top: 20px;
}
.widebox .caci_video iframe {
    width: 396px; /* widebox is 396 px */
    height: 260px;
}
.box h4 {
    font-weight: 600;
}
.box h4 span {
    display: block;
    font-size: 11px;
    font-weight: 600;
}
.box img.image_border {
    max-width: 250px;
}
/*===== ----- =====*/
/*----- 2.4.3 product gallery page -----*/
/*===== ----- =====*/
#portfolio_nav {
	margin: 0px 0px 10px 10px;
	font-size: 12px;
	color: #2d2d2d;
	font-weight: 700;
	display: inline-block;
}
#portfolio_nav li {
	padding:0;
	margin: 0;
	display:inline;
	float: left;
	list-style:none;
}
#portfolio_nav li a {
	color: #2d2d2d;
	font-size: 11px;
	text-transform: uppercase;
	margin-right: 20px;
}
#portfolio_nav li a:hover {
	text-decoration:none;
}
#portfolio_nav a.active {
	color:#dd395f !important;
}
.allimage {
	background: url(../images/filter-all.png) no-repeat 0 0;
	width: 12px;
	height: 12px;
	float: left;
	margin-top: 6px;
}
.allimage:hover {
	background: url(../images/filter-all.png) no-repeat 0 -12px;
}
/*3 column portfolio*/
ul#portfolio_3column li {
	background: #ffffff;
	width: 300px;
	height: auto;
	margin:0 10px 30px 10px;
	list-style-type: none;
	float: left;
	text-align:center;
}
ul#portfolio_3column li img {
	width: 290px;
	/*height: 170px;*/
	padding: 4px;
	margin-bottom: 10px;
	/*border: 1px solid #dbdbdb;*/
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	list-style-type: none;
	float: left;
}
/*4 column portfolio*/
ul#portfolio_4column li {
	background: #ffffff;
	width: 220px;
	height: auto;
	margin:0 10px 30px 10px;
	list-style-type: none;
	float: left;
}
ul#portfolio_4column li img {
	width: 210px;
	height: 140px;
	padding: 4px;
	margin-bottom: 10px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	list-style-type: none;
	float: left;
}
ul#portfolio_4column a, ul#portfolio_3column a {
    display: inline-block;
    background: #c2c2c2;
    color: #ffffff;
    padding: 8px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}
ul#portfolio_4column li a:hover, ul#portfolio_3column li a:hover {
    color: #a0092b;
}
ul#portfolio_4column li h6, ul#portfolio_3column h6 {
	margin-bottom: 5px;
}
ul#portfolio_4column li p, ul#portfolio_3column p {
	padding-bottom: 0px;
}
.isotope-item {
	z-index: 2;
}
.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1;
}
/*===== ----- =====*/
/*----- 2.4.4 packages page -----*/
/*===== ----- =====*/
.packages h4 {
	font-weight: 700;
}
.price img {
	vertical-align: text-top;
}
/*card*/
.card {
	background: url(../images/card-pattern.jpg) repeat #e2e2e2;
	width: 280px;
	height: 130px;
	padding: 10px;
	margin-bottom: 20px;
	color: #656565;
	border-top: 1px solid #ffffff;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-box-shadow:0 0 2px 2px rgba(0, 0, 0, 0.2);
	-moz-box-shadow:0 0 2px 2px rgba(0, 0, 0, 0.2);
	box-shadow:0 0 2px 2px rgba(0, 0, 0, 0.2);
	display: block;
}
.card h1 {
	font-size: 28px;
	color: #656565;
	margin-bottom: 5px;
	line-height: 1em;
}
.card .text_small {
	float: left;
	margin-top: 50px;
}
.card img {
	float: right;
	margin-top: 40px; /*adjust it according to your logo height*/
}
/*===== ----- =====*/
/*----- 2.4.5 faq page -----*/
/*===== ----- =====*/
ul.list_faq li {
	margin-bottom: 20px;
	background: none;
	list-style: none;
	display: block;
}
ul.list_faq li h6 {
	margin-bottom: 10px;
}
ul.list_faq li em {
        text-decoration: underline;
	font-weight: 600;
}
/*===== ----- =====*/
/*----- 2.4.6 contact and appointments page -----*/
/*===== ----- =====*/
#appointmentform h5 {
	margin-bottom: 20px;
	font-size: 12px;
	text-transform: uppercase;
}
.map {
	background: #ffffff;
	width: 275px;
	height: 320px;
	padding: 4px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
.large_map {
	background: #ffffff;
	width: 96%;
	height: 440px;
	padding: 4px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
/*===== ----- =====*/
/*----- 2.4.7 blog -----*/
/*===== ----- =====*/
.multiposts {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dashed #dbdbdb;
	background: none;
	list-style-type: none;
	display: block;
}
.last_multipost {
	border-bottom: 0px !important;
}
.blog_img_vid {
	background: #ffffff;
	width: 200px;
	padding: 4px;
	margin-right: 20px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float: left;
}
.blog_img_vid img, .blog_img_vid iframe {
	float: left;
}
.blogslider {
	width: 210px;
	float: left;
	margin-right: 20px;
}
.blogtext {
	width: 390px;
	float: left;
}
/*list for blog information*/
ul.bloginfo {
	padding-bottom: 15px;
	display: block;
	float: left;
}
ul.bloginfo li {
	margin: 0px 20px 5px 0px;
	font-size: 11px;
	background: none;
	list-style-type: none;
	float: left;
}
ul.bloginfo li.blogdate {
	background: url(../images/icons/icon-date.png) no-repeat left 0;
	padding-left: 25px;
}
ul.bloginfo li.blogauthor {
	background: url(../images/icons/icon-author.png) no-repeat left 0;
	padding-left: 25px;
}
ul.bloginfo li.blogtags {
	background: url(../images/icons/icon-tag.png) no-repeat left 0;
	padding-left: 25px;
}
ul.bloginfo li.blogcomments {
	background: url(../images/icons/icon-comment.png) no-repeat left 0;
	padding-left: 25px;
}
/*----- twitter feed -----*/
#twitter li {
	background: none;
	padding-bottom: 10px;
}
/*----- flickr feed -----*/
.flickr_feed img {
	background: #ffffff;
	width: 70px !important;
	height: 70px !important;
	padding: 4px;
	margin: 0px 10px 10px 0px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float: left;
}
/*===== ----- =====*/
/*----- 2.4.8 Misc -----*/
/*===== ----- =====*/
/*----- social icon list -----*/
ul.social {
	float: right;
}
ul.social li {
	margin-left: 5px;
	font-size: 11px;
	color: #656565;
	font-weight: 700;
	background: none;
	list-style-type: none;
	float: left;
}
.fb-like img, #like iframe, .fb_iframe_widget {
        vertical-align: middle;
}
ul.social li img {
	vertical-align: middle;
}
ul.social li p {
	padding-right: 5px;
	padding-bottom: 0px;
	line-height: 2em;
}
/*This is for circle behind number - used in list*/
.number_bg {
	background: #9f9f9f;
	width: 14px;
	height: 14px;
	margin-right: 10px;
	margin-top: 3px;
	font-size: 10px;
	color: #ffffff;
	text-align: center;
	line-height: 14px;
	border-radius: 14px;
	-moz-border-radius: 14px;
	-webkit-border-radius: 14px;
	float: left;
}
/*----- gift_icon -----*/
.gift_icon {
	float: right;
	margin-left: 25px;
}
/*===== ----- =====*/
/*----- 2.4.9 About CACI page (duplicated from treatments)-----*/
/*===== ----- =====*/
ul.about-caci li {
	width: 940px;
	margin: 0px 20px 20px 0px;
	background: none;
	list-style-type: none;
	display: inline-block;
	float: left;
}
ul.about-caci li img {
        width: 280px;
	margin: 0px 20px 20px 0px;
}
ol.about-caci.list_bullet li {
        width: 620px;
	background: url(../images/bullet-circles.png) no-repeat 0 5px !important;
	padding-left: 20px;
	margin-bottom: 10px;
	list-style-type: none;
	text-align: justify;
}
.about-caci h4 {
        color: #07b1f8;
}
.about-caci h4 span {
        color: #07b1f8 !important;
	font-size: 11px;
	display: block;
}
/*===== ----- =====*/
/*----- 2.4.10 CACI in the news -----*/
/*===== ----- =====*/
.caci-news h5 {
    margin-bottom: 0px;
}
.caci-news p {
    padding-bottom: 20px;
}
/*----------------------------------------*/
/*----- 2.5 footer -----*/
/*----------------------------------------*/
#footer {
	background: url(../images/widgetised-footer-bg.jpg) repeat #f8f8f8;
	padding: 20px 10px;
	border-top: 1px solid #efefef;
	display: block;
}
/*----- testimonial list -----*/
ul.list_testimonial li {
	margin-bottom: 15px;
	font-style: italic;
	text-align: justify;
	background: none;
	list-style-type: none;
}
ul.list_testimonial li span.quote {
	font-size: 22px;
	font-weight: 300;
	display: inline-block;
}
ul.list_testimonial li span {
	font-weight: 600;
	font-size: 11px;
	display: block;
}
/*----- blogpost list -----*/
ul.list_blog li {
	margin-bottom: 10px;
	font-size: 11px;
	font-style: italic;
	background: none;
	list-style-type: none;
}
/*----------------------------------------*/
/*----- 2.6 footer_bottom -----*/
/*----------------------------------------*/
#footer_bottom {
        /* BeauSkin background color */
        background: #450000; 
	padding: 15px 10px 15px 10px !important;
	margin: 20px 0px 0px 0px;
	color: #d5d5d5;
	line-height: 1em;
	-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
	float: left;
}
#footer_bottom h1, #footer_bottom h2, #footer_bottom h4, #footer_bottom h5, #footer_bottom h6 {
	color: #ffffff;
}
#footer_bottom a, #footer_bottom h3 {
	color: #d5d5d5;
}
#footer_bottom a:hover {
        color: #f39dc1;
}
#footer_bottom p.text_small {
        font-size: 9px;
}
/*----- social buttons -----*/
ul.social_buttons li {
	margin-bottom: 10px;
	background: none;
	list-style-type: none;
	float: left;
}
/*----- copyright -----*/
#copyright {
	font-size: 11px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
/*----------------------------------------*/
/*----- 2.7 forms -----*/
/*----------------------------------------*/
/*----- subscribe form -----*/
form#subform {
	background: #fbfbfb;
	width: 260px;
	margin-bottom: 15px;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	position: relative;
}
form#subform fieldset {
	border: none;
	background: none;
}
form#subform fieldset p {
	background: none;
	padding: 0;
	margin: 0;
}
form#subform input {
	background: transparent;
	width: 200px;
	height: 20px;
	padding: 8px 10px;
	margin: 0;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 12px;
	color: #9f9a95;
	font-weight: 400;
	line-height: 12px;
	outline:none;
	border: none;
	float: left;
}
form#subform input.sub_submit {
	background: url(../images/subscribe-btn.png) no-repeat 0 0;
	width: 40px;
	height: 36px;
	padding: 0;
	margin: 0;
	cursor: pointer;
	outline: none !important;
	border: none;
	float: left;
}
form#subform input.sub_submit:hover {
	background: url(../images/subscribe-btn.png) no-repeat 0 -36px;
}
form#subform label.error {
	font-size: 10px;
	color: #b14344;
	position: absolute;
	top: 33px;
	left: 2px;
}
form#subform #result_sub {
	width: 260px;
	line-height: 2em;
	text-align: left;
	position: absolute;
	top: 40px;
	left: 0;
}
/*----- contact and appintment form -----*/
/*common properties for both forms*/
#contactform label, #appointmentform label {
	width: 100%;
	margin-bottom: 5px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 12px;
	color: #404040;
	font-weight: 600;
	display: block;
}
#contactform input.submit, #appointmentform input.appointment_submit {
	background: #626262; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7d7d', endColorstr='#626262'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#7d7d7d), to(#626262)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #7d7d7d, #626262); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #7d7d7d, #626262);
	width: auto;
	height: 30px;
	padding: 0px 10px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 10px;
	color: #ffffff;
	line-height: 10px;
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
	border: 1px solid #535353;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
	-webkit-box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
	box-shadow: 0 1px 0px 0px rgba(255, 255, 255, 0.5) inset;
}
#contactform input.submit:hover, #appointmentform input.appointment_submit:hover {
	background: #7d7d7d; /* for non-css3 browsers */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#626262', endColorstr='#7d7d7d'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#626262), to(#7d7d7d)); /* for webkit browsers */
	background: -moz-linear-gradient(top, #626262, #7d7d7d); /* for firefox 3.6+ */
	background:  -o-linear-gradient(top, #626262, #7d7d7d);
	color: #ffffff;
}
#contactform label.error, #appointmentform label.error {
	display: none !important;
}
#contactform input.error, #appointmentform input.error {
	border: 1px solid #dc8f89;
}
#contactform textarea.error, #appointmentform textarea.error {
	border: 1px solid #dc8f89;
}
#contactform input, #contactform textarea, #contactform select {
	background: #fbfbfb;
	height: 18px;
	padding: 5px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 12px;
	color: #9f9a95;
	line-height: 1.9em;
	display: block;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

/*----- Contact form 1-----*/
#contactform ul li {
	margin-bottom: 20px;
	background: none;
	list-style-type: none;
}
#contactform input, #contactform textarea, #contactform select {
	width: 368px;
}
#contactform select {
	width: 380px;
	height: 30px;
}
#contactform textarea {
	height: 88px;
}
#result {
	width:380px;
	padding-top: 5px;
	display: block;
	float: left;
}
/*----- appointment form -----*/
#appointmentform {
	width: 580px;
}
#appointmentform ul li {
	width: 280px;
	margin-right: 20px;
	margin-bottom: 20px;
	background: none;
	list-style-type: none;
	float: left;
}
#appointmentform ul li.spmprevent {
        display: none;
}
#appointmentform input, #appointmentform textarea, #appointmentform select {
	background: #fbfbfb;
	width: 268px;
	height: 18px;
	padding: 5px;
	font-family: 'Century Gothic', 'Verdana', 'Open Sans', sans-serif;
	font-size: 12px;
	color: #9f9a95;
	line-height: 1.9em;
	display: block;
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
#appointmentform select {
	width: 280px;
	height: 30px;
}
#appointmentform input.address {
        width: 568px;
}
#appointmentform textarea {
	width: 568px;
	height: 88px;
}
#appointmentform #result_appointment {
	width: 580px;
	padding-top: 5px;
	float: left;
	color: #dd395f !important;
	font-weight: bold;
	display: block;
}
#appointmentform input.middlename, #appointmentform label.middlename {
        display: none;
}
.radio_input {
	width: auto !important;
	height: auto !important;
	margin-right: 20px;
	float: left;
}
p.radio_button {
	float: left;
}
.mobileCallIcon {
    display:none;
}
/*============================================================*/
/*---------- 3. Media queries ----------*/
/*============================================================*/

/*----------------------------------------*/
/*----- 3.1 Tablet (Portrait) / Design for a width of 768px -----*/
/*----------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 959px) {
/*----- No need to change below unless heavy layout changes -----*/
#wrapper_outer {
 width:100%;
 margin: 0 auto;
}
#wrapper {
 width:100%;
}
#header {
 width:100%;
/* padding: 20px 0px 20px 0px;*/
 padding: 20px 0px 0px 0px;
 margin: 0px 0px 20px 0px;
}
#header_bottom {
 width:100%;
 padding: 20px 0px 20px 0px;
}
#content {
 padding: 20px 0px;
 display: block;
}
#footer {
 padding: 15px 0px 15px 0px !important;
 width:100%;
}
#footer_bottom {
 width:100%;
 padding: 15px 0px 15px 0px !important;
 margin: 20px 0px 0px 0px;
}
#copyright {
 width:100%;
}
/* Header logo and slogan */
.header-slogan h3 {
    padding-left: 14px;
    padding-top: 28px;
    font-size: 17px;
}
.header-contact img {
/*    padding-top: 25px;*/
    padding-top: 33px;
    width: 25px;
}
.header-contact p {
/*    padding-top: 31px;*/
    padding-top: 41px;
    font-size: 17px;
}
/*sliders*/
.nivoslider {
 display: none;
}
.flex-caption {
 display: none;
}
#slider_wrapper {
    width: 768px;
}
/* main page */
.mainpage_box {
 width: 232px;
}
.mainpage .text_with_scroll {
    overflow:auto;
    height:230px;
}
.mainpage iframe {
    width: 344px; /* -10px */
    height: 225px;
}
.image_left {
 max-width: 97%;
}
.image_right {
 max-width: 97%;
}
/* Treatments */
.infoblock {
    padding-left: 10px;
    padding-right: 10px;
}
.infoblock.jcarousel_wrapper {
    padding-left: 10px;
    padding-right: 10px;
}
.widebox {
    width: 350px;
    
}
.widebox .caci_video iframe {
    width: 350px;
    height: 230px;
}
.button_contact {
    padding-left: 10px;
    padding-right: 10px;
}
.button_contact:hover {
    padding-left: 9px;
    padding-right: 9px;
}
ul.about-caci li {
 width: 748px;
}
ol.about-caci.list_bullet li {
 width: 488px;
}
.card {
display: none;
}
/*blog*/
.blog_img_vid, .blogslider {
 margin-bottom: 20px;
}
.blogtext {
 width: 490px;
 float: left;
}
/*contact and appointment*/
.map {
 width: 214px;
}
.large_map {
 height: 510px;
}
#contactform input, #contactform textarea, #contactform select, #appointmentform input, #appointmentform input.address, #appointmentform textarea {
 width: 288px;
}
#contactform select, #appointmentform select {
 width: 300px;
 height: 30px;
}
#result, #appointmentform #result_appointment {
 width:300px;
 padding-top: 5px;
 display: block;
 float: left;
}
#appointmentform ul li {
 width: 300px;
 margin-right: 0px !important;
 margin-bottom: 20px;
 float: none;
 display: block;
}
}

/*----------------------------------------*/
/*----- 3.2 Mobile (Portrait) / Design for a width of 320px -----*/
/*----------------------------------------*/

@media only screen and (max-width: 767px) {

/*----- Need changes while customization -----*/
#header {
 background: #450000; /* BeauSkin colour */
 width:100%;
 padding: 0;
 margin: 0px 0px 20px 0px;
}
.header-logo img {
    margin-top: 0px;
    width: 180px;
}
.header-slogan {
    display: none !important;
}
.header-contact {
    display: none !important;
}
/*----- No need to change below unless heavy layout changes -----*/
.container .columns, .container .column {
 margin: 10px 0px 10px 0px !important;
}
#wrapper_outer {
 width:100%;
 margin: 0 auto;
}
#wrapper {
 width:100%;
}
#slider_wrapper {
    width: 300px;
}
.banner-slider .flex-control-nav {
    display: none; /* Disable controls */
}
#header_bottom {
 width:100%;
 padding: 20px 0px 20px 0px;
}
#content {
 padding: 20px 0px;
 display: block;
}
#content_withsidebar {
 width: 100%;
 display: block;
}
#sidebar {
 width: 100%;
 padding-left: 0;
 display: block;
}
#sidebar_left {
 width: 100%;
 padding-right: 0;
 display: block;
}
#footer {
 width:100%;
 padding: 20px 0px;
}
#footer_bottom {
 width:100%;
 padding: 15px 0px 15px 0px !important;
 margin: 20px 0px 0px 0px;
 text-align:center;
}
#copyright {
 width:100%;
}
#copyright ul {
 float:left;
 padding-top: 5px;
}
#copyright ul li {
 margin-right: 10px;
 margin-left: 0px;
}
.image_left {
 max-width: 97%;
}
.image_right {
 max-width: 97%;
}
ul.social {
float: left;
}
ul.social li {
 margin-right: 5px;
 float: left;
}
/*sliders*/
.flex-caption {
 display: none;
}
.nivoslider {
 display: none;
}
/*portfolio*/
#portfolio_nav {
 margin: 0px 0px 20px 0px;
}
ul#portfolio_3column li {
 margin:0 0px 20px 0px;
}
ul#portfolio_4column li {
 margin:0 0px 20px 0px;
 width: 300px;
}
ul#portfolio_4column li img {
 width: 290px;
 height: 170px;
}
/*blog*/
.blog_img_vid, .blogslider {
 margin-bottom: 20px;
}
.blogtext {
 width: 100%;
 display: block;
}
/*forms*/
.map {
 width: 290px;
 height: 280px;
}
.large_map {
 height: 350px;
}
#contactform input, #contactform textarea, #appointmentform input, #appointmentform input.address, #appointmentform textarea {
 width: 288px;
}
#contactform select, #appointmentform select {
 width: 300px;
 height: 30px;
}
#result, #appointmentform #result_appointment {
 width:300px;
 padding-top: 5px;
 display: block;
 float: left;
}
#appointmentform ul li {
 width: 300px;
 margin-right: 0px;
 margin-bottom: 20px;
 display: block;
}
#appointmentform {
 width: 300px !important;
}
.mobileCallIcon {
 display:inline-block;
}
.mobileFooter {
 display:none;
}
/* main page */
.mainpage_box {
 width: 296px;
}
.mainpage_box .contents {
 padding-left:  38px;
 padding-right: 38px;
}
.mainpage .text_with_scroll {
    height:100%; /* disable scroll */
}
.mainpage iframe {
    width: 300px;
    height: 201px;
}
/* Treatments */
p.divider_with_text {
    font-size:18px;
}
.button_contact {
    padding-left: 20px;
    padding-right: 20px;
}
.button_contact:hover {
    padding-left: 19px;
    padding-right: 19px;
}
.infocentre a.button_contact span {
    display: inline-block;
    vertical-align:top;
    text-align: left;
    overflow: auto;
    width: 200px;
}
.infocentre a.button_contact img.top {
    width: 56px;
    float:right;
    overflow: auto;
}
.infocentre a.button_contact img.bottom {
    width: 70%;
}
.treatment_name {
    background: #fff0fc;
    border: 1px solid #a0092b;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-border-radius: 10px;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 10px;
    cursor: pointer;
}
.treatment_name, 
.treatment_price {
    width: 268px; /* -32 */
}
.treatment_price h3,
.treatment_price.special h3 {
    text-align: left;
    margin-top: 0px;
}
.treatment_name h3,
.treatment_price h3 {
    font-size: 14px;
}
.treatment_price,
.treatment_content {
    margin-left: 16px;
    margin-right: 16px;
}
.infocentre h3 {
    text-align: center;
}
p.disclaimer {
    text-align: center;
    font-size: 11px;
}
ul.about-caci li {
    width:300px;
    margin-right: 0px;
}
ol.about-caci.list_bullet li {
    width: 280px;
}
.box, .widebox {
    margin: 0px 0px;
    display: block;
}
.widebox {
    width: 280px;
    padding: 0px;
}
.widebox .caci_video iframe {
    width: 280px;
    height: 164px;
}
.widebox .caci_video_guide {
    display: none;
}
/*about*/
.testimonial-slider span {
    float: right;
}
.features {
    padding: 10px 20px 0px 20px;
}
.caci-news img {
    display: none;
}
}
/*----------------------------------------*/
/*----- 3.3 Mobile (Landscape) / Design for a width of 480px -----*/
/*----------------------------------------*/

@media only screen and (min-width: 480px) and (max-width: 767px) {

/*-----No need to change below unless heavy layout changes-----*/
/* Other properties are according to those specified for Mobile (Portrait)*/
#slider_wrapper {
    width: 420px;
}
.banner-slider .flex-control-nav {
    display: none; /* Disable controls */
}
.header-slogan {
    display: none !important;
}
.header-contact {
    display: none !important;
}
/* main page */
.mainpage_box {
 width: 416px;
}
.mainpage_box .contents {
 padding-left:  38px;
 padding-right: 38px;
}
/* Treatments */
.treatment_name,
.treatment_price {
    width: 388px; /* -32 */
}
.treatment_name h3 {
    margin-top: 15px;
}
.thumbs img {
    height: 60px;
}
.widebox {
    width: 310px;
}
.widebox .caci_video iframe {
    width: 310px;
    height: 180px;
}
.mainpage iframe {
    width: 420px;
    height: 270px;
}
.infocentre a.button_contact span {
    width: 320px;
}
.flexslider.image-slider .slides img {
    width: 370px;
}
ul.about-caci li {
 width:420px;
}
ol.about-caci.list_bullet li {
 width: 400px;
}
.map {
 width: 410px;
 height: 400px;
}
.large_map {
 height: 400px;
}
.caci-news img {
    display: none;
}
}

/*============================================================*/
/*---------- 4. Browser fixes ----------*/
/*============================================================*/
/*----- IE 8 fix -----*/
@media \0screen {
.header-logo h1 a {
	float: none;
}
}
.wme_footer{	font-size: 11px;	text-align: center;	margin-left: auto;	margin-right: auto;}

h1.seoptim, h2.seoptim, h3.seoptim { 
    font-size: 18px; /* matches h3 */
    color: #656565; /* matches mainpage's seo title */
}
h1.seoptim span { /* matches h3 span */
    display: block;
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 15px;
}

.the-head {
    cursor: pointer;
    font-style: italic;
    margin-bottom: 10px;
}