@charset "UTF-8";

/* CSS Document */

/*Copyright 2009 Sarah Milcetic/Designed by Sarah*/
/*Cannot be reproduced without express written consent*/

body {
	background-color:#fff;
	font:normal 10px/2em Calibri, Arial, Helvetica, sans-serif;
	text-align:justify;
	width:1000px;
	margin:20px auto 0;
}
#col1 {
	width:150px;
	float:left;
}

#col2 {
	width:150px;
	float:right;
}

#col3 {
	width:540px;
	margin:0 auto;
}

a { color:#333; }

a:hover { color:#777; }

em {
	font-style:italic;
}

#content {
	width:500px;
	min-height:300px;
	padding:0 20px;
	margin:0 auto;
	text-align:justify;
	background:url(../i/bg.jpg) bottom right no-repeat;
	padding-bottom:20px;
	border:1px solid #ccc;
}

#content:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#nav { margin-top:120px; }

#shop.shop-main #nav { margin-top:350px; }

#shop.shop-main.v2 #nav { margin-top:400px; }

#nav, #main_nav {
	font-size:1.5em;
	line-height:1.5em;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align:left;
}

#nav li, #main_nav li {
	list-style:none;
	margin-left:0;
	padding:0.5em;
}

#nav li a, #main_nav li a { text-decoration:none; }

#nav li a:hover, #main_nav li a:hover { color:#999; }

#main_nav {
	width:475px;
	margin:1em auto;
}

#main_nav li {
	float:left;
	padding:0;
	margin:0;
}

#main_nav li a {
	display:block;
	text-indent:-9000px;
	height:40px;
}

#main_nav #a_about {
	background:url(../i/nav-about.jpg) no-repeat top center;
	width:50px;
}

#main_nav #a_contact {
	background:url(../i/nav-contact.jpg) no-repeat top center;
	width:65px;
}

#main_nav #blog {
	background:url(../i/nav-blog.jpg) no-repeat top center;
	width:50px;
}

#main_nav #twitter {
	background:url(../i/nav-twitter.jpg) no-repeat top center;
	width:60px;
}

#main_nav #a_accessories {
	background:url(../i/nav-accessories.jpg) no-repeat top center;
	width:80px;
}

#main_nav #a_productions {
	background:url(../i/nav-productions.jpg) no-repeat top center;
	width:80px;
}

#main_nav #a_programs {
	background:url(../i/nav-programs.jpg) no-repeat top center;
	width:80px;
}

blockquote {
	text-align:right;
	text-transform:lowercase;
	color:#ccc;
	font:100 normal normal 2em/1em "Trebuchet MS";
}

/*blockquote + p {
	clear:right;
}*/
h1 a {
	display:block;
	background:url(../i/h1.jpg) no-repeat;
	height:300px;
	width:106px;
	text-indent:-9000px;
}

h2 {
	line-height:2.2em;
	font:normal normal normal 3em/2em "Trebuchet MS", Arial, Helvetica, sans-serif;
	;
	color:#555;
	text-align:left;
}

h3 {
	padding-top:5px;
	font:normal normal normal 1.6em/2em "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#999;
}

h4 {
	line-height:200%;
	font:bold normal normal 1.4em/1.5em "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align:center;
	color:#333;
	margin-bottom:0.5em;
}

div.image_gallery + h4 {
	clear:both;
}

h4:before, h4:after {
	content:" ~ ";
	font:100 normal normal 4em/0.5em "Trebuchet MS";
	vertical-align:bottom;
	color:#ddd;
}

p, #content ul {
	margin:1em 0;
	font-size:1.5em;
}

p img {
	float:left;
	padding:0 10px 10px 0;
}

p.mingle {
	width:300px;
	float:right;
	padding-top:1em;
}

p.mingle img { padding-top:0; }

p.mingle:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#content li {
	margin-left:40px;
	list-style-image:url(../i/bullet.jpg);
}

strong { font-weight:bold; }

.center { text-align:center; }

.logolink {
	height:150px;
	width:200px;
	display:inline;
}

.image_gallery {
	height:170px;
	width:165px;
	float:left;
	text-align:center;
	padding:20px 0 0;
}

.image_gallery img { border:1px solid #ccc; }

.collection_gallery {
	height:245px;
	width:240px;
	float:left;
	margin:0 5px 10px;
}

.collection_gallery.outlined {
	width:238px;
	height:300px;
	border:1px solid #ccc;
}

.collection_gallery.wide {
	width:498px;
	height:350px;
	float:none;
	margin:20px auto 0;
}

.small {
	font-size:0.8em;
	color:#777;
}

form fieldset {
	border:1px solid #ccc;
	padding: 10px;
	margin: 0;
}

form fieldset legend {
	font-size:1.5em;
	color:#000; /*IE was displaying it as blue */
}

form label {
	display: block;
	float: left;
	width: 120px;
	padding: 0;
	margin: 5px 0 0; /*top must be same as form elements (below)*/
	text-align: right;
	font-size:1.2em;
}

form input, form textarea, form select {
	width:auto;
	margin:5px 0 0 10px;
}

textarea { overflow: auto; }

form small {
	display: block;
	width:100px;
	padding: 1px 3px;
	font-size:1.1em;
	float:right;
	text-align:left;
}

form.mini {
	width:150px;
	padding:10px;
	float:left;
	text-align:left;
}

form.mini label, form.mini textarea, form.mini file, form.mini small {
	float:none;
	margin:0;
	text-align:left;
}

form.mini input { margin:0; }

/*This is the alternate content for browsers that can't display the flash logo */
#sites {
	width:400px;
	margin:0 auto;
	text-align:center;
}

#sites img {
	display:block;
	padding-bottom:30px;
	margin:0 auto;
}

#sites a { font-size:2em; }

#sites a {
	display:block;
	float:left;
	height:40px;
	width:100px;
	padding:0 15px;
	text-indent:-9000px;
}

#sites a#accessories { background:url(../i/sites-accessories.jpg) no-repeat; }

#sites a#productions { background:url(../i/sites-productions.jpg) no-repeat; }

#sites a#fashion { background:url(../i/sites-fashion.jpg) no-repeat; }

#sites a#accessories:hover, #sites a#productions:hover, #sites a#fashion:hover { background-position:0 -40px; }

/*This will replace the h2s with the Susie font*/
h2 {
	height:100px;
	width:500px;
	text-indent:-9000px;
}

#about h2 { background:url(../i/h2-about.jpg) no-repeat; }

#accessories h2, #note h2 { background:url(../i/h2-accessories.jpg) no-repeat; }

#admin h2 { background:url(../i/h2-admin.jpg) no-repeat; }

#clients h2 { background:url(../i/h2-clients.jpg) no-repeat; }

#productions h2 { background:url(../i/h2-productions.jpg) no-repeat; }

#contact h2 { background:url(../i/h2-contact.jpg) no-repeat; }

#dance h2 { background:url(../i/h2-dance.jpg) no-repeat; }

#giving h2 { background:url(../i/h2-giving.jpg) no-repeat; }

#lookbook h2 { background:url(../i/h2-lookbook.jpg) no-repeat; }

#fashion h2 { background:url(../i/h2-programs.jpg) no-repeat; }

#mingle h2 { background:url(../i/h2-mingle.jpg) no-repeat; }

#service h2 { background:url(../i/h2-service.jpg) no-repeat; }

#shop h2 { background:url(../i/h2-shop.jpg) no-repeat; }

#testimonials h2 { background:url(../i/h2-testimonials.jpg) no-repeat; }

br { clear:both; }

em { font-style:italic; }

.reader {display:none;}
