/*

[ CSS Document ]

	Style Sheet Name: hanna_style.css
	Website: Hanna Couture
	Author: Jimmyweb Web Design
	Author URL: www.jimmyweb.net
	Version: 1.0
	Date: 08/04/2010

[ Table Of Contents ]

	0- Reset
	1- Global
	2- Headings
	3- Navigation
	4- Main Content Elements
	5- Main Content
	6- Footer

[ Colour Reference Guide ]

	Black: #000000
	White: #ffffff - (Used for...)
	Etc...

*/ 


/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =0 Reset 
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Universal - reset browser default styles */
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, font, 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 {
	margin: 		0;
	padding: 		0;
	border: 		0;
	outline: 		0;
	font-size: 		100%;
	vertical-align: baseline;
	background: 	transparent;
}
body {
	line-height: 	1;
}
ol, ul {
	list-style: 	none;
}
blockquote, q {
	quotes: 		none;
	font-style:		italic;
}
:focus {
	outline: 		0;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* Tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =1 Global 
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* General style applied to HTML */
html {
	text-align: 	left;
	padding: 		0;
	margin: 		0;
	border: 		0;
	font-family: 	Arial, Helvetica, sans-serif;
	width: 			100%;
	background-color: #c9c9c9;
}
/*	
	background: #fff url(../images/bg-main.jpg) top center repeat;
	background: url(../images/bg-top.jpg) top center repeat-x;
*/

/* Body style */
body {
	clear: 			both;
	line-height: 	1;
	vertical-align: top;
	background: 	#ededed url(../img/bg_foot.jpg) bottom repeat-x;
	color: 			#000;
	padding: 		0;
	margin: 		0 auto;
	text-align: 	left;
}
/* Preset global styles */
.right {
	float: 			right;
}
.left {
	float: 			left;
}
.align-left {
	text-align: 	left;
}
.align-right {
	text-align: 	right;
}
.align-center {
	text-align:		center;
}
.justify {
	text-align:		justify;
}
.hide {
	display: 		none;
}
.clear {
	clear: 			both;
}
.bold {
	font-weight:	bold;
}
.italic {
	font-style:		italic;
}
img.centered {
	display: 		block;
	margin-left: 	auto;
	margin-right: 	auto;
}
img.alignleft {
	float: 			left;
	margin: 		4px 10px 4px 0px;
}
img.alignright {
	float: 			right;
	margin: 		4px 0px 4px 10px;
}
.spacer {
	display: 		block;
	clear: 			both;
	visibility: 	hidden;
	line-height: 	0;
	height: 		0;
}
/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =2 Headings
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */  

h1 {
}
h1 a {
	display: 		block;
	background: 	url(../img/logo.jpg) bottom no-repeat;
	width: 			516px;
	height: 		88px;
	font-size: 		0.1em;
	color: 			#ececec;
	margin: 		0 auto;
}
h1 a:link, h1 a:visited, h1 a:hover {
	text-decoration: none;
	color: 			#ececec;
}
h2, h3, h4, h5, h6 {
	color: 			#505052;
	font-weight: 	500;
	text-shadow:	0 1px 1px rgba(64, 64, 64, 0.33);
	font-family: 	Arial, Helvetica, sans-serif;
}
h2 {
	font-size: 		1.1em;
	margin: 		22px 0 22px 0;
	line-height: 	1.2em;
}
h3 {
	font-size: 		1.0em;
	margin: 		22px 0 0 0;
}
h4 {
	font-size: 		0.9em;
	margin: 		22px 0 0 0;
}
h5 {
	font-size: 		0.8em;
	margin: 		0 0 0.5em 0;
}
h6 {
	font-size: 		0.7em;
	margin: 		38px 0 22px 0;
}
h6 a {
	padding: 8px 16px;
	font-weight: 	900;
	text-transform:uppercase;
}
h6 a:link, h6 a:visited {
	color: 			#fff;
	text-decoration: none;
	background-color: #333333;
}
h6 a:hover {
	color: 			#fff;
	text-decoration: none;
	background-color: #000;
}
/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =3 Navigation
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */ 

/* Main Navigation - Horizontal style */
#main_nav {
	position: 		relative;
	top: 			0px;
	line-height: 	0px;
	text-align: 	center;
	margin: 		20px auto 0px 62px;
}
#main_nav a {
	display: 		block;
	font-family: 	Century Gothic, Arial, Helvetica, sans-serif;
	padding: 0;

}
#main_nav li a:link, #main_nav li a:visited {
	text-decoration: none;
	font-size: 		0.8em;
	color: 			#958b7c;
	padding: 		0px 14px 0px 14px;
	margin: 		0;
	border-bottom: 	3px solid #e8e8e8;
}
#main_nav li a:hover {
	text-decoration: none;
	padding: 		0px 14px 0px 14px;
	margin: 		0;
	background-color: #f2f2f2;
	border-bottom: 	3px solid #cfcfcf;
	color: 			#625b50;
}
#main_nav li {
	float: 			left;
	line-height: 	28px;
}
/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =4 Main Content Elements
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */ 

/* General paragraph style */
p {
	margin-bottom: 	0em;
	margin-top:		1.9em;
	padding: 		0px;
	font-size: 		0.8em;
	color: 			#58564e;
	font-family: 	Arial, Helvetica, sans-serif;
	line-height: 	1.5em;
	text-shadow:	0 1px 1px rgba(64, 64, 64, 0.13);
}
p a:link, p a:visited {
	color: 			#958b7c;
	text-decoration: none;
	padding: 2px;
}
p a:hover {
	color: 			#947d5d;
	text-decoration: none;
	background-color: #fff;
	padding: 2px;
}

/* ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =5 Main Content 
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */ 
#bodywrap {
	background:  	url(../img/bg_head.jpg) top repeat-x;
	margin:			0;
	padding:		0px 0 0 0;
	text-align: 	center;
	width: 			100%;
	overflow: 		auto;
}
#contentwrap {
	clear: 			both;
	width: 			820px;
	margin:			0 auto;
	padding:		0;
	text-align: 	left;
}
#wrapper {
	clear: 			both;
	position: 		relative;
	top: 			20px;
	-top: 			5px;
	padding:		0 0 20px 0;
	background: 	url(../img/bg_watermark.jpg) bottom center no-repeat;
	margin: 		0 0 40px 0;
	float: 			left;
}
#wrap {
	margin: 		0px 0 0 0;
	background: 	url(../img/bg_main.jpg) top no-repeat;
	padding: 		0 40px;
	width: 			740px;
	float: 			left;
}
#content {
	margin: 		0px 0 0 0;
	padding: 		24px 40px 30px 0;
	width: 			380px;
	float: 			right;
}
#photo_wrapper {
	float: 			left;
	height: 		330px;
	width: 			284px;
	margin: 		50px 0px 90px 0px;
	position: 		relative;
	left: 			40px;
}
/* Carousel section */
#carousel {
	background: 	url(../images/bg-carousel.jpg) top center no-repeat;
	width: 			244px;
	height: 		370px;
	padding: 		0px 0px 0px 0px;
	position: 		absolute;
	top: 			77px;
	right: 			250px;
}
.stepcarousel {
	position: 		relative; /*leave this value alone*/
	overflow: 		scroll; /*leave this value alone*/
	width: 			244px; /*Width of Carousel Viewer itself*/
	height: 		370px; /*Height should enough to fit largest content's height*/
}
.stepcarousel .belt {
	position: 		absolute; /*leave this value alone*/
	left: 			0;
	top: 			0;
}
.stepcarousel .panel {
	float: 			left; /*leave this value alone*/
	overflow: 		hidden; /*clip content that go outside dimensions of holding panel DIV*/
	width: 			244px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
	position: 		relative;
	margin:  		0px 25px 0px 0px;
	padding: 		0px 10px 0px 0px;
	height: 		328px; /*Height should enough to fit largest content's height*/
}
#galPaginate {
	position: 		relative;
	z-index: 		1000;
	padding-top: 	310px;
}
#mygallery-paginate {
	width: 			244px;
	text-align:		center
}
/* 
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   =6 Footer
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– 
*/  

/* Footer */
#footer {
	clear: both;
	padding:0px 50px 66px 50px;
	text-align: right;
height: 40px;
}
#footer p {
	font-size: 0.7em;
	color: #a3a3a3;
}
#footer a:link, #footer a:visited {
	color: #7a7a7a;
	text-decoration: none;
	padding: 8px 2px;
}
#footer a:hover {
	color: #51513b;
	text-decoration: none;
	background-color: none;
	padding: 8px 2px;
}