/* HTML elements  */		

	h1, h2, h3, h4, h5, h6{
		font-weight:normal;
		margin:0;
		line-height:1em;
		}	
	h1{font-size:2em;margin-bottom:.8em;margin-top: 15px;}	
	h2{font-size:1.2em;margin-bottom:.5142em;padding-top:.2em;}	
	h3{font-size:1.5em;margin-bottom:.7em;padding-top:.3em;}
	h4{font-size:1.25em;margin-bottom:.6em;}
	h5,h6{font-size:1em;margin-bottom:.5em;font-weight:bold;}
	
	p, blockquote, ul, ol, dl, form, table, pre{line-height:inherit;margin:0 0 1.5em 0;}
	ul, ol, dl{padding:0;}
	ul ul, ul ol, ol ol, ol ul, dd{margin:0;}
	li{margin:0 0 0 2em;display:list-item;list-style-position:outside;}	
	blockquote, dd{padding:0 0 0 2em;}
	pre, code, samp, kbd, var{font:100% mono-space,monospace;}
	pre{overflow:auto;}
	abbr, acronym{
		text-transform:uppercase;
		border-bottom:1px dotted #000;
		letter-spacing:1px;
		}
	abbr[title], acronym[title]{cursor:help;}
	small{font-size:.9em;}
	sup, sub{font-size:.8em;}
	em, cite, q{font-style:italic;}
	img{border:none;}			
	hr{display:none;}	
	table{width:100%;border-collapse:collapse;}
	th,caption{text-align:left;}
	form div{margin:.5em 0;clear:both;}
	label{display:block;}
	fieldset{margin:0;padding:0;border:none;}
	legend{font-weight:bold;}
	input[type="radio"],input[type="checkbox"], .radio, .checkbox{margin:0 .25em 0 0;}

/* //  HTML elements */	

/* common */		
	
	.left{float:left;margin-right:1em;}
	.right{float:right;margin-left:1em;}
	.center{text-align:center;}
	
	.clear{clear:both;}
	.first{margin-left:0 !important;}
	.last{margin-right:0 !important;}
	.top{margin-top:0 !important;}
	.bottom{margin-bottom:0 !important;}	
	.hidden, .print{display:none;}
	.graphic{
		margin:0;
		padding:0;
		display:block;
		overflow:hidden;
		text-indent:-8000px;
		}
		

/* // common */			

/* base */
	
	body, table, input, textarea, select, li, button{
		font:1em Helvetica, Arial, Sans-Serif;
		line-height:1.5em;
		color:#333;
		}		
	body{
		font-size:12px;
		background:#dbdad4;
		margin:0;
		padding:0;
		text-align:center;
		}	
	a, a:visited{
		text-decoration:none;
		color:#496977;
		}
	a:hover{color:#999;}
	ins{text-decoration:none;color:#900;font-style:italic;}
	code{color:#555;}
	pre{
		margin-left:2em;
		padding-left:2em;
		border-left:1px solid #ccc;
		}
	blockquote{
		margin-left:2em;
		border-left:1px solid #ccc;
		font-style:italic;
		}	
	dt{font-weight:bold;}
	th, td{padding:.5em 1em;line-height:1.5em;}		
	th{background:#eee;}
	td{border-bottom:1px solid #eee;}
	caption{font-style:italic;color:#777;margin:.5em 0;}	
	fieldset{
		border:1px solid #ccc;
		padding:1em 2em;
		margin:0 0 1.5em 0;
		}
	legend{padding:2px 5px;}	
	form div.col{clear:none;}form div.first{clear:both;}
	form div{overflow:hidden;}
	
	input[type="text"], input[type="password"], textarea, .field, .area, select{
		border:1px solid #aaa;
		padding:5px;
		background:#fff;
		width:300px;
		line-height:1em;
		margin:0;
		}
	select{width:312px;}
	textarea, .area{overflow:auto; height:150px; width:400px;}
	textarea, .area-askadoc{overflow:auto; height:60px; width:226px;margin: 0 0 0 25px;}
	input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus, .focus{background:#f5f5f5;outline:none;}
	.submit{}
	button{
		border:none;
		background:#555;
		color:#fff;
		padding:0 2.5em;
		height:2em;
		line-height:2em;
		cursor:pointer;
		}
		
	.note, .success, .error{display:block;}
	.error{color:#900;}
	.success{color:#060;}
	.note{font-weight:bold;}
	
	.pullquote{
		width:20%;
		float:left;
		margin-right:2em;
		padding-right:2em;
		border-right:1px solid #ccc;
		text-align:right;
		font-size:1.1em;
		font-style:italic;
		color:#777;
		margin-bottom:.5em;
		}
	.boxout{
		width:20%;
		float:right;
		margin-left:2em;
		padding:1em 2em;
		border:1px solid #ccc;
		margin-bottom:.5em;
		}
	#easy_tooltip{
		border:1px solid #e1e1e1;
		padding:2px 10px;
		background:#f5f5f5;
		}

/* base */

/* layout */

	#container{	
		margin:0 auto;
		width:960px;
		text-align:left;
		position:relative;
		background-color: #fff;
		}
	#container-inner {
		background-color: #fff;
		width: 920px;
		position:relative;
		margin:0 auto;
	}
	.inner{
		position:relative;
		}
	#header{
		position:relative;
		height: 120px;
		border-top: 10px solid #999;
		}	
	.logo {
		padding: 20px 0 0 0;
		margin: 0 0 0 0;
	}
	#footer{
		position:relative;
		clear:both;
		padding: 10px 0 5px 0;
		border-top: 1px dashed;
		}	
		
	.content{
		clear:both;
		padding:1em 0;
		}
	.main, .secondary, .tertiary, .quaternary{
		float:left;
		display:inline;
		}
	.main h2 {
		font-size: 16px;
	}
	.main{width:580px;}
	.secondary{width:300px;margin-left:38px;}
	.tertiary{}
	.quaternary{}
	
	/* grid */
		
		.cols{} /* main column container class */
		.col{
			float:left;
			display:inline;
			width:48%;margin-left:4%; /* 2 equal width columns layout - default */
			}	
		.cols3 .col{width:30%;margin-left:5%;} /* 3 equal width columns layout */
		.cols4 .col{width:22%;margin-left:4%;} /* 4 equal width columns layout */
		
		/* use following classes to build custom grid (add as many as you want) */
		
		.col1, .col2, .col3{float:left;display:inline;}
		.col1{}
		.col2{}
		.col3{}
		
		.indent1{}
		.indent2{}
		.indent3{}
		
	/* grid */	

/* // layout */

/* navigation */

		#navigation {
			width: 920px;
			height:32px;
			background-color: #e0e7e4;
			}	
		#nav {
			color: #333333;
			width: 920px;
			background-color: #e0e7e4;
			}		
		#nav ul, #nav li{
			margin:0;
			padding:0;
			list-style:none;
			color: #333333;
			}	
		#nav li{
			float:left;
			display:inline;
			position:relative;
			line-height:32px;
			height:32px;
			padding-right:2em;
			background-color: #e0e7e4;
			color: #333333;
			}	
			
		#nav ul{
			position:absolute;
			left:0;
			top:32px;
			padding:5px 10px;
			width:200px;	
			background-color:#eee;
			display:none;
			z-index:1000;
			border: 1px solid #999;
			color: #333333;
			}
		#nav ul li{
			float:none;
			background-color:#eee;
			display:block;
			border-bottom: 1px dashed #c8c8c8;
			color: #333333;
			}
		#nav ul li a{
			color: #333333;
		}
		
/* //navigation */

/* header */

	#header h1{
		line-height:50px;
		height:50px;
		margin:0;
		}
	#header h1 a{		
		}		

/* // header */
	
/* content */

	.content a, .content a:visited{
		text-decoration:underline;
		}
	
/* // content */

/* footer */

	#footer {
		font-size: 11px;
		font-weight: bold;
	}
	
	#footer a, #footer a:visited{
		text-decoration:underline;
		}
	
/* // footer */


/* search form */
	form#searchForm{
		margin:0;
		padding:10px 10px;
		background:#eeeeee;
		float:right;
		position:relative;
		top:20px;
		text-align: left;
		right:0;
		width: 340px;
		}		
	#searchForm .field{
		border:1px solid #999;
		padding:0;
		width:200px;
		height:26px;
		float:left;
		text-align: left;
		}		
	#searchForm button{
		display:inline;
		float:left;
		background:#ccc; /* place search icon here */
		height:26px;
		width:108px;
		margin-left:5px;
		text-align: left;
		}	
/* //search*/


/* clearfix */

	.inner:after, .content:after, .cols:after, .fixed:after{
		content:"."; 
		display:block; 
		height:0; 
		clear:both; 
		visibility:hidden;
		}
	.inner, .content, .cols, .fixed{display:block;min-height:1%;}
	* html .inner, * html .content, * html .cols, * html .fixed{height:1%;}

.clearboth { clear: both; }

/* // clearfix */










/* // SKG Additions */

.page-title {
	margin-bottom: 10px;
	padding: 0;
}


/* spacer */

.h-spacer {
	padding: 0;
	margin: 20px 0 20px 0;
	text-align: center;
}

/* Profile */

.contact-card-outer {
	border: 1px solid #a38d85; 
	margin: 0; 
	position: inherit;
}
.contact-card-banner {
	background-color: #dfd3c5; 
	border-bottom: dashed 1px #9ab2b6;
}
.contact-card-banner  h3 {
	background: #dfd3c5 url(../images/profile-icon.gif) center left no-repeat; 
	margin: 0 0 0 10px;
	padding: 10px 10px 10px 40px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	color: #403029;
}
.contact-card-inner {
	margin: 10px 0 0 0;
	padding-bottom: 0;
	position: relative;
	clear: both;
}

#profile-picture {
	margin-left: 10px; 
	padding: 5px; 
	border: 1px solid #ccc;
}
.profile-phone {
	font-size: 19px;
	color: #644f46;
	margin: 0 0 5px 0;
	font-weight: bold;
}
.profile-phone span {
	color: #644f46;
}
.profile-web {
	font-size: 14px;
	color: #506568;
}
.procedure-list {
	width: 165px;
	border-right: 1px solid #ccc;
	padding: 10px 10px 10px 0; margin: 0;
	list-style-type: none;	
}
.procedure-list li {
	font-weight: bold;
	margin: 0 0 0 0;
	padding: 0 0 10px 25px;
	background: url(../images/check.png) top left no-repeat;
}

/* QA / Most Viewed */

#qa-home {
	padding: 0; 
	margin: 0; 
	background-color: #fff; 
	border: 1px solid #9ab2b6;
}
.qa-home-title {
	background-color: #dfd3c5; 
	padding: 5px; margin: 0; 
	border-bottom: dashed 1px #8b7864; 
	text-align: center;
}
.qa-home-list {
	width: 265px;
	padding: 10px 10px 10px 0; margin: 0;
	list-style-type: none;
}
.qa-home-list li {
	font-weight: bold;
	margin: 0 0 0 10px;
	padding: 0 0 10px 25px;
	background: url(../images/check.png) top left no-repeat;
}

#most-viewed-home {
	width: 288px; 
	margin: 0 0 0 8px; 
	background-color: #fff; 
	border: 1px solid #9ab2b6;
}
.most-viewed-home-title {
	background-color: #e0e7e4; 
	padding: 5px; margin: 0; 
	border-bottom: dashed 1px #9ab2b6; 
	text-align: center;
}



/*--SLIDESHOW--*/
.main_image {
	width: 280px; height: 229px;
	float: left;
	background: #333;
	position: relative;
	overflow: hidden;
	color: #fff;
	padding: 0;
	margin: 0 0 20px 0;
}
.main_image h2 {
	font-size: 12px;
	font-weight: bold;
	margin: 0;	padding: 10px 10px 0 10px;
}
.main_image h2 a {
	color: #fff;
}
.main_image p {
	font-size: 9px;
	padding: 10px;	margin: 0;
	line-height: 1.6em;
}
.block small { 
	padding: 0 0 0 20px; 
	background: url(../images/icon_calendar.gif) no-repeat 0 center; 
	font-size: 11px; 
}
.main_image .block small {margin-left: 10px;}
.main_image .desc{
	position: absolute;
	bottom: 0;	left: 0;
	width: 100%;
	display: none;
}
.main_image .block{
	width: 100%;
	background: #111;
	border-top: 1px solid #000;
}
.main_image a.collapse {
	background: url(../images/btn_collapse.gif) no-repeat left top;
	height: 27px; width: 93px;
	text-indent: -99999px;
	position: absolute; 
	top: -27px; right: 20px; 
}
.main_image a.show {background-position: left bottom;}

.image_thumb {
	float: left;
	width: 299px;
	background: #f0f0f0;
	border-right: 1px solid #fff;
	border-top: 1px solid #ccc;
}
.image_thumb img {
	border: 1px solid #ccc; 
	padding: 5px; 
	background: #fff; 
	float: left;
}
.image_thumb ul {
	margin: 0; padding: 0;
	list-style: none;
}
.image_thumb ul li{
	margin: 0; padding: 12px 10px;
	background: #f0f0f0 url(nav_a.gif) repeat-x;
	width: 279px;
	float: left;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-right: 1px solid #ccc;
}
.image_thumb ul li.hover {
	background: #ddd;
	cursor: pointer;
}
.image_thumb ul li.active {
	background: #fff;
	cursor: default;
}
html .image_thumb ul li h2 {
	font-size: 12px; 
	line-height: 18px;
	font-weight: bold;
	margin: 0 0; padding: 0;
}
.image_thumb ul li .block {
	float: left; 
	margin-left: 10px;
	padding: 0;
	width: 170px;
}	
.image_thumb ul li p{display: none;}


/* DOC FEED */

	#side-docfeed {
		margin: 0 0 20px 0;
		padding: 0 0 20px 0;
		background-color: #fff;
		border: 1px solid #9ab2b6;
		width: 300px;
	}

	.side-docfeed-scroll {
		width: 270px;
		height: 125px;
		padding: 10px;
		position: relative;
		overflow:scroll;
		overflow-x: hidden; 
	}
	
	.comments ul, #comments li {
		margin:0;
		padding-bottom:15px;
		list-style:none;
		clear: both;
		border-bottom: 1px solid #ccc;
		}
	.comments {
		margin:0;
		padding: 0;
		list-style:none;
	 }
	
	.comments li{margin:0;padding: 0;position:relative;}
	.comments .meta{margin-bottom:.5em;}	
	.comments .meta li{
		margin:0;
		padding: 0;
		display:inline;
		color:#777;
		}	
	.comments .meta .author{
		font-size:12px;
		font-weight:bold;
		}	
	.comments .meta img{
		position:absolute;
		left:0;
		top:3em;
		z-index:100;
		width: 48px;
		border:1px solid #ccc;
		}	
	.comments .body{
		padding-left:70px;
		}	
	
	/* END DOC FEED */	
	
	
	/* Sidebar List */	
	#sidebar-list {
		margin: 0 0 20px 0;
		padding: 0;
		background-color: #fff;
		border: 1px solid #9ab2b6;
		width: 300px;
	}
	/* END Sidebar List */	
		
		

	.check-list {
		list-style-type: none;
	}
	.check-list li {
		margin: 0 0 10px 0;
		text-indent: 0;
		background: url(../images/check.png) top left no-repeat;
		padding: 0 0 0 25px;
	}
	#tc-homelist {
		margin-bottom: 20px;
	}
	#tc-homelist ul{
		list-style-type: none;
	}	
	#tc-homelist ul li {
		margin: 0;
		padding: 0;
		text-indent: 0;
	}
	#tc-homelist ul li a{
		float: left;
		text-indent: 0;
		padding: 0 0 0 10px;
	}
	#tc-homelist ul li.listnote {
		background: url(../images/note.png) top left no-repeat;
		float: left;
		width: 16px; 
	}
	
/*Results*/

.results{
	width: 580px;
	padding: 0;
	margin: 0;
	}
.results-entry {
	background-color: #fff;
	width: 580px;
	margin: 0;
	padding: 20px 0 0 0;
	border-top: 1px solid #ccc;
}
.results-entry-img {
	margin: 0 0 20px 0;
	padding: 0;
	float: left;
	clear: both;
	position: relative;
}
.results-entry-img p img{
	border: solid 1px #ccc;
	background-color: #eee;
	margin: 0;
	padding: 2px;
}
.results-entry-meta {
	width: 300px;
	padding: 0;
	margin: 0 0 0 20px;
	float: left;
	position: relative;
	vertical-align: top;
}


	
/* Feed search form */
	
	.feedform {
		padding: 10px 0 10px 25px;
		margin: 20px auto 0 auto;
		height: 15px;
		width: 250px;
		text-align: center;
		background: #fff;
		border-top: 1px dashed #999;
	}
	
	form#feedsearch{
		margin:0;
		padding:0;
		background:#ffffff;
		position:inherit;
		}		
	#feedsearch .field{
		border:1px solid #999;
		padding:5px;
		width:135px;
		float:left;
		}		
	#feedsearch button{
		float:left;
		background:#3e606f; /* place search icon here */
		height:26px;
		width: 70px;
		text-align: center;
		padding: 0;
		margin-left:5px;
		}	
/* //search*/


/* Breadcrumbs */

ul.breadcrumbs{
	margin:0 0 2em 0;
	padding:0;
	font-size: 10px;
	}	
ul.breadcrumbs li{
	margin:0;
	padding:0 .5em;
	line-height:1em;
	float:left;
	list-style:none;
	border-left:1px solid #555;
	}
ul.breadcrumbs li.first{
	padding-left:0;
	border-left:none;
	}
ul.breadcrumbs li a{float:left;}
	
/* End Breadcrumbs */


/* Pagination */

	ol.pagination{
		margin:1em 0;
		padding:0;
		}	
	ol.pagination li{
		margin:0 .5em 0 0;
		padding:0;
		float:left;
		list-style:none;
		}
	ol.pagination li a, ol.pagination li span{
		float:left;
		border:1px solid #ccc;
		line-height:1.5em;
		padding:0 .5em;
		color: #496977;
		text-decoration: none;
		background:#fff;
		}
	ol.pagination li a:hover{background:#f1f1f1; text-decoration: underline;}
	ol.pagination li span{background:#a7b8bb;color:#fff;}
	
/* Pagination */

/* Profile Contact Form */		

	.profileform-containter {
		margin-bottom: 30px;
		padding: 15px
	}
	
	.profileform fieldset{border:none;margin:0;padding:0;}
	.profileform legend{display:none;}
	.profileform div{clear:both;margin:0 0 0.5em 0;}
	.profileform label{
		float:left;
		width:250px;
		}
	.profileform .field, .profileform .area{
		width:260px;
		padding:3px;
		}
	.profileform select{padding:3px;width:250px;}
	.profileform .submit{margin-left:0;}

/* END Profile Contact Form */	

/* Q/A */

#qa-main-banner {
	width: 374px; height: 50px;
	background: url(../images/qa-main-banner.gif);
	text-indent: -9999px;
	text-align: left;
	margin: 0 auto 20px auto;
}

#qa-ask-specialist-banner {
	width: 432px; height: 61px;
	background: url(../images/qa-ask-specialist-banner.gif);
	text-indent: -9999px;
	text-align: center;
	margin: 0 auto 20px auto;
}

.qa-intro-blurb {
	border-top: 1px dashed #ccc;
	border-bottom: 1px dashed #ccc;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	text-transform: normal;
	letter-spacing: normal;
	line-height: 1.4em;
	color: #333;
	margin: 15px 0;
	padding: 15px 0 0 0;
}

.qa-grouplist {
	margin:0;
	padding: 0;
	border-bottom: 1px dashed #999;
	list-style-type: none;
}

.qa-grouplist li {
	text-indent: 0;
	padding:0;
	margin: 10px 0 10px 10px;
}

.qa-answer {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	text-transform: normal;
	letter-spacing: normal;
	line-height: 1.4em;
	color: #333;
	margin: 15px 0;
}

/* QA Profile */

.qa-card-outer {
	border: 1px solid #a38d85; 
	margin: 0; 
	position: inherit;
}
.qa-card-banner {
	background-color: #dfd3c5; 
	border-bottom: dashed 1px #9ab2b6;
}
.qa-card-banner  h3 {
	background: #dfd3c5 url(../images/profile-icon.gif) center left no-repeat; 
	margin: 0 0 0 10px;
	padding: 10px 10px 10px 40px;
	text-transform: uppercase;
	color: #403029;
}
.qa-card-inner {
	margin: 10px 0 0 0;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #ccc;
}
#qa-profile-picture {
	margin: 0px 15px 15px 10px; 
	padding: 5px; 
	border: 1px solid #ccc;
	float: left;
	clear: both;
	width: 100px;
}
#qa-profile-picture img {
	width: 100px;
}

.articles-by-procedure {
	list-style-type:none;
	margin: 0;
	padding: 0;
}
.articles-by-procedure li {
	border-bottom: 1px dashed #999;
	padding: 10px 0;
}

.im-art-left {
	padding: 3px;
	border: 1px solid #ccc;
	margin: 0 15px 15px 0;
}


#sharethis_0 {
	padding: 0;
	margin: 0 0 15px 0;
}


.article-body h2 {
	font-size: 18px;
	margin: 10px 0;
}


#contact-profile-form {
	width: 280px;
	margin: 0 auto;
}
#contact-profile-form input {
	width: 260px;
}
#contact-profile-form .area {
	width: 260px;
	padding: 5px;
}

.lfr-form input{
	width: 250px;
}
.lfr-form textarea{
	width: 550px;
}





















/*  scroll scg.ca */

div.scrollable {  
position:relative;
overflow:hidden;
width: 400px;	 
height:150px;
border-top:1px solid #dcdcdc;
border-right:1px solid #dcdcdc;
border-left:1px solid #dcdcdc;
}

/* 
root element for scrollable items. It is 
absolutely positioned with large width. 
*/
#thumbs {	
position:absolute;
width:20000em;	
clear:both;
line-height: 10pt;
}

/* custom positioning for navigational links */
a.prev, a.next {
margin-top:0px;
}



/* single item */
#thumbs div {
float:left;
width:200px;
height:150px;
background:#aaa;
color:#fff;
border-left:1px solid #fff;
border-right:1px solid #dcdcdc;
cursor:pointer;
line-height: 10pt;
}

/* style when mouse is over the item */
#thumbs div.hover {
background-color:#777777;	
}

/* style when element is active (clicked) */
#thumbs div.active {
background-color:#78A4D0;
cursor:default;
}

#thumbs p {	
font-family: Arial;
font-size:10px;
color:#fff;
margin: 0;
padding: 5px 12px 0px 12px;
line-height: 10pt;
}

#thumbs a {		
font-family: Arial;
font-size:8pt;
font-weight: bold;
color:#fff;	
}

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

#thumbs a.text, #thumbs a.text:visited {		
font-family: Arial;
font-size:10px;
color:#fff;
text-decoration: none;
}


/* this makes it possible to add next button beside scrollable */
div.scrollable {
	float:left;		
}

/* prev, next, prevPage and nextPage buttons */
a.prev,  a.prevPage {
    width:36px;
    height: 151px;
	background:url(http://www.skintherapy.ca/flow/images/left.png) no-repeat;
	float:left;
	cursor:pointer;	
}

/* next button uses another background image */
a.next, a.nextPage {
    width:36px;
    height: 151px;
	background:url(http://www.skintherapy.ca/flow/images/right.png) no-repeat;
	float:left;
	cursor:pointer;
}

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;
}

/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi {
	margin-left:328px;
	width:200px;
	height:20px;
}


/* items inside navigator */
div.navi a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(http://www.skintherapy.ca/flow/images/navigator.png) 0 0 no-repeat;     
	cursor:pointer;	
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -16px;     
} 	

/* Google Search */

#cse-search-box {
	background-color: #dfd3c5; border: 1px solid #88827a;
	padding:0;
}