/* 		
Danielle Sutton
www.daniellesutton.com
Dark Brown: #7c6a55
Medium Brown:  #bfad9d
Light Brown:  #f4efea
*/

/*
Reset
*/

*						{ margin: 0; padding: 0; }
html					{ overflow-y: scroll; }
html, body				{ height: 100%; margin: 20px 0px; padding:0px;}
body					{ font-size: 12px; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; color: #7c6a55; text-align:center;line-height:1em}

ul						{ list-style: square inside; }
ol						{ list-style: decimal inside; }
a						{ outline: none; text-decoration: none; }
a img					{ border: none; }
img						{boder:none}
img						{ vertical-align: middle; }
table					{ border-collapse: colapse; }




/*
Utility
*/
.floatLeft				{ float: left; }
.floatRight				{ float: right; }
.clear					{ clear: both; }
.button					{ border:; background:; padding:; }
.button:hover			{ background:; color:; }
.italic					{ font-style: italic; }
p.noBreak				{ display:inline; }
p						{margin-bottom:1em; line-height:1.5em;}



/* 		
UNIVERSAL STYLES
*/

#wrapper 								{ /*background-color: lightblue;*/ width: 800px; height: 720px; margin: 0px auto; text-align: center}
#header									{ /*background-color: lightpink;*/ width: 798px; height: 100px; }
#quaziLogo								{ /*background-color: lightgreen;*/ padding-left: 80px; height: 72px; width: 350px; float: left; }
#tagLine								{ /*background-color: lightyellow;*/ padding-top: 18px; padding-right: 63px; height: 72px; width: 146px; float: right;}
h1										{ font-size: 2em; margin-bottom:1em; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; color: #7c6a55; font-weight: 200; }
h3 a									{font-weight:bolder ;color: #bfad9d; }
h3 a:visited							{ color: #7c6a55; }
h3 a:hover								{ color: #7c6a55;; text-decoration: none; }
h3										{font-size:1.3em;line-height:2em; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; font-weight: 200; margin-bottom: 1em;  }
p a										{ font-size: 1em; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; color: #7c6a55; }
p a:visited								{ font-size: 1em; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; color: #7c6a55; }
p a:hover								{ font-size: 1em; font-family: Geneva, Verdana, "MS Sans Serif", sans-serif; color: #bfad9d; text-decoration: none; }

.column-image	{
	-webkit-box-shadow: #7c6a55 0px 0px 5px 0px ;
    -moz-box-shadow:  #7c6a55 0px 0px 5px 0px ;
	box-shadow:  #7c6a55 0px 0px 5px 0px ;
	webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
	margin-left:5px;
	margin-top:20px;
	}
	
dl{text-align:left;margin-bottom:1em}
dt{font-size:1.4em;font-weight:bold;margin-bottom:0.5em}
	

/*
UNIVERSAL STYLES
*/
#mainContentHome,#mainContentStockist,#mainContentCollections	{ /*background-color: lightyellow;*/ margin: 44px auto 0 ;  width: 705px;text-align:left; }
#mainContentStockist					{border:none; margin-top:30px }
#latestNews								{ background-color: #f4efea; margin-top: 20px; margin-left: 84px; width:626px; height: 39px; }
#mainContentCollections 				{ /*background-color: lavender;*/ margin: 60px auto 0 auto;  }
#footer									{ font-size:0.8em;/*background-color: lightgreen;*/ text-align: right; margin-top: 20px; margin-left: 84px; width: 656px; height: ; }
.imageBorder							{ border: 1px solid #cccccc; }
.clearfix:after 						{ content: "."; visibility: hidden; display: block; height: 0; clear: both;}
.text-center							{text-align:center}
.left									{float:left}
.right									{float:right}

/*
POLAROID STYLES
*/
.horizontal-polaroid{clear:both;
margin: 1em 0 2em 0;}
.vertical-polaroid{float:left; display:inline-block; width:170px;margin-right:5px; margin-bottom:10px;}

.pol1,.pol2,.pol3,.pol4,.pol5,.pol6 {
	-webkit-box-shadow: #7c6a55 0px 0px 5px 0px ;
    -moz-box-shadow:  #7c6a55 0px 0px 5px 0px ;
	box-shadow:  #7c6a55 0px 0px 5px 0px ;
	webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px; 
	float:left;
	}
	
.col{ float:left;width:225px;margin-right:25px;}	

.pol1{
	-webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    transform: rotate(-2deg);
	margin-left:-10px;
	margin-top:-3px;}
.pol2{
	-webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
	margin-left:-6px;
	margin-top: 3px}
.pol3{
	-webkit-transform: rotate(2deg);
    -moz-transform: rotate2deg);
    -o-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    transform: rotate(2deg);
	margin-left:-8px;
	margin-top:-5px}
	
.pol4{
	-webkit-transform: rotate(5deg);
    -moz-transform: rotate( 5deg);
    -o-transform: rotate( 5deg);
    -ms-transform: rotate( 5deg);
    transform: rotate( 5deg);
	margin-top:3px}
	
.pol5{
	-webkit-transform: rotate(5deg);
    -moz-transform: rotate( 5deg);
    -o-transform: rotate( 5deg);
    -ms-transform: rotate( 5deg);
    transform: rotate( 5deg);
	margin-top:-25px}	
.pol6{
	-webkit-transform: rotate(-3deg);
    -moz-transform: rotate( -3deg);
    -o-transform: rotate( -3deg);
    -ms-transform: rotate( -3deg);
    transform: rotate( -3deg);
	margin-top:-30px}
/*
HOME PAGE
*/
.footnote								{ font-style: italic; }
#slideshow1								{overflow:hidden;width:655px;height:397px;margin: 0 auto}

.social_media{margin:10px 5px 10px 0;float:left}
#home_links{margin: 2px 84px}
#home_links img{opacity: 0.4}
#home_links img:hover{opacity:1}
/* NAVIGATION */

#navigationMain, #navigationMain ul		{ z-index: 1000; /*background-color: lavender;*/ width: 700px; color: #7c6a55; font-size: 12px; font-family: Geneva, Helvetica, Arial, sans-serif; padding: 0px; margin: 0px 0px 0px 30px; list-style:none; text-align: center; }

#navigationMain ul li#orientation a	{ color: #bfad9d; }

#navigationMain li ul					{ position: absolute; width: 60px; left: -999em;}

#navigationMain li:hover ul				{ left: auto;}

#navigationMain li:hover ul, #nav li.sfhover ul { left: auto }

#navigationMain ul li.topLevel			{ /*background-color: lightsalmon;*/ display: inline-block; text-align: center; margin: 0 14px; height: 20px; float:left}

#navigationMain ul li.topLevel a:hover 	{ color: #beae9f;}

#navigationMain ul li a					{ color: #7c6a55; text-decoration: none; display: block; margin-left: 4px; margin-right: 4px; }

#navigationMain ul li ul li a			{ color: #7c6a55; margin-left: 2px;} /*THIS IS THE DROPDOWN TEXT LINKS*/

#navigationMain ul li.collections		{ background-color: #ffffff; font-size: 10px; float: left; width: 85px; height: 15px; text-align: left; padding-left: 12px; margin-left: 5px; border-bottom: solid 1px #666666; padding-top: 3px;}
										/* THIS STYLES AND POSITIONS THE ENTIRE COLLECTIONS DROPDOWNS TOGETHER */
#navigationMain ul li ul.collectionsNav	{ margin-left: -16px; margin-top: 4px;} 	/*THIS POSITIONS THE COLLECTIONS SUB NAV UL*/

#navigationMain ul li.collections a:hover{ background-color: #f3efeb; color:#7c6a55; width: 83px; height: 15px; padding-top: 3px; padding-left: 14px; margin-left: -12px; margin-top: -3px;} 
										/*THIS STYLES THE DROPDOWN HOVER LINKS TEXT AREA*/
										
#navigationMain ul li.gallery			{ background-color: #ffffff; font-size: 10px; float: left; width: 68px; height: 15px; text-align: left; padding-left: 12px; margin-left: 5px; border-bottom: solid 1px #666666; padding-top: 3px;}
										/* THIS STYLES AND POSITIONS THE ENTIRE GALLERY DROPDOWNS TOGETHER */
#navigationMain ul li ul.galleryNav		{ margin-left: -13px; margin-top: 4px;} 	/*THIS POSITIONS THE GALLERY SUB NAV UL*/

#navigationMain ul li.gallery a:hover	{ background-color: #f3efeb; color:#7c6a55; width: 66px; height: 15px; padding-top: 3px; padding-left: 14px; margin-left: -12px; margin-top: -3px;} 
										/*THIS STYLES THE DROPDOWN HOVER LINKS TEXT AREA*/
										
#navigationMain ul li.gallery a#orientation	{ background-color: #f3efeb; color:#7c6a55; width: 83px; height: 15px; padding-top: 3px; padding-left: 14px; margin-left: -12px; margin-top: -3px;} 



/*
Gallery and Collections STYLES
*/
#galleryForwardBack						{ border-radius:5px;float:right;background-color: #f4efea; font-size: 10px; margin: 3px 0px 10px 5px; width:132px; height: 22px; padding-top: 6px; }
#previous								{ margin-left: 17px; } 
a#previous								{ color: #7c6a55; margin-right: 7px; }
#next									{ padding-left: 0px; } 
a#next									{ color: #7c6a55; }

#mygallery {  
	-webkit-box-shadow: #7c6a55 0px 0px 5px 0px ;
    -moz-box-shadow:  #7c6a55 0px 0px 5px 0px ;
	box-shadow:  #7c6a55 0px 0px 5px 0px ;
	webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px; }

.stepcarousel {
/*background-color: lightyellow;*/
position: relative; /*leave this value alone*/
border: 0px solid black;
overflow: scroll; /*leave this value alone*/
width: 705px;; /*Width of Carousel Viewer itself*/
height: 338px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt {
/*background-color: lightgreen;*/
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel {
/*background-color: lightblue;*/
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px 0px 0px 0px; /*margin around each panel*/
/*width:365px;*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}



/*
STOCKIST
*/

#stockistInformation					{ /*background-color: lightpink;*/ width: 290px; height: 490px; }
#stockistScroll							{ /*background-color: lightblue;*/ margin-left: 30px; width: 270px; height: 480px; }
p.stockistParagraph						{ width: 287px; }
img.stockistDisplay						{ margin-top: 28px; }
.scroll-pane							{ width: 100%; height: 475px; overflow: auto; background-color: #ffffff; } /*THIS MUST REMAIN FOR THE SCROLL PANE TO WORK*/
.scroll-pane input:focus				{  outline: none; }


/*
CONTACT
*/
#mainContentContact						{ /*background-color: lightyellow;*/ margin-top: 44px; margin-left: 84px; width: 656px; height: 500px; }
#contactImagesBox						{ /*background-color: lightpink;*/ width: 290px; height: 490px; }
#contactFormBox							{ /*background-color: lightblue;*/ margin-left:; width: 363px; height: 480px; }
.facebookButtonMargin					{ margin-bottom: 20px; margin-top: 22px; }
#contactCopy							{ margin-left: 50px;}



/*FORM STYLES*/

.formLabelMargin						{ margin-top: 23px; }
#submitButtonStyles						{ /*THESE STYLES ARE INLINE FOR CROSS BROWSER CONSISTENCY*/ }
#contactThankYouContent					{ margin-left: 30px; }


.contact-area 							{ displaY:inline-block;/*background-color: lightgreen;*/ width: 335px;  margin-right:15px; text-align:left;margin: 0 0 14px 57px; }
.contact-area input, .contact-area textarea { 
padding: 2px 5px;
width: 55%;
font-family: Geneva, Verdana, "MS Sans Serif";
font-size: 11px;
margin: 0px 0px 10px 0px;
color: #7c6a55;
outline: none;
 }
.contact-area textarea 					{ height: 90px; }
.contact-area textarea:focus, .contact-area input:focus {background-color:#EEE ; }
.contact-area input.submit-button 		{ width: 100px; float: left; margin-left: 58px; }
#contact-copy							{ margin: 0 0 14px 57px; }
		
.contact-area label 					{ /*background-color: lightsalmon;*/ text-align: right; margin-right:; width: 45px; padding-top: 2px; font-size: 9px; float: left; }

#newsletter-signup h3					{ margin-bottom: 9px;}
#newsletter-signup						{ /*background-color: lightgreen;*/ width: 283px; margin-top: 0px; }
#newsletter-signup input				{ width: 281px; font-family: Geneva, Verdana, "MS Sans Serif"; font-size: 11px; margin: 0px 0px 22px 0px; border: none; color: #8d837a; background-color: #f4efea; float: left; outline: none; }
#newsletter-signup input value			{ }
#newsletter-signup .submit-button		{ /*THESE STYLES ARE INLINE FOR CROSS BROWSER CONSISTENCY*/ }


/*
OUR PHILOSOPHY
*/
#philosophyCopy							{ /*background-color: lightblue;*/ width: 300px; }
p .philosophy							{ line-height: 12px; }


/*
VIDEO
*/

.video_frame{width:100%; margin: 20px 0; text-align:center}

.video_frame iframe{ margin: auto}