/*	COSMOS CREATIONS 
	http://www.cosmoscreations.com	*/

/*	Resets
	------	*/

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figure,figcaption,hgroup,menu,header,footer,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0}article,aside,canvas,figure,figure img,figcaption,hgroup,footer,header,nav,section,audio,video{display:block}a img{border:0}figure{position:relative}figure img{width:100%}


/*	Typography presets
	------------------	*/

.serif,
cite,
blockquote,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: palatino,platino linotype,georgia,times,times new roman,serif;
	font-weight: normal;
}

.post h2,
.post h3,
.post h4,
.post h5,
.post h6 {
	margin: 0;
}

.monospace,
var,
code {
	font-family: courier new, courier, monospace;
}

.gigantic {
	font-size: 110px;
	line-height: 120px;
	letter-spacing: -2px;
}

.huge,
h1 {
	font-family:'Friz Quadrata W01 Bold';
	font-size: 68px;
	line-height: 72px;
	font-weight: normal;
}

.large,
h2,
#content h1 {
	font-family:'Friz Quadrata W01 Bold';
	font-size: 42px;
	line-height: 48px;
	font-weight: normal;
}

.big,
h3,
#content h2 {
	font-family:'Friz Quadrata W01 Bold';
	font-size: 24px;
	line-height: 32px;
	font-weight: normal;
	color: #A84D10;
}

#content h4 {
    font: 16px/22px Helvetica Neue, Helvetica, Trebuchet MS, Arial, Verdana, Tahoma, sans-serif;
    font-weight: bold;
}

#content h3 {
	font-family:'Friz Quadrata W01 Bold';
    	font-size: 18px;
    	line-height: 24px;
    	font-weight: normal;
    	color: #A84D10;
}

.normal,
body {
	font: 14px/21px Helvetica Neue, Helvetica, Trebuchet MS, Arial, Verdana, Tahoma, "DejaVu Sans", "Liberation sans", "Bitstream Vera Sans", sans-serif;
	text-shadow: 1px 1px 1px rgba(0,0,0,.1); -moz-text-shadow: 1px 1px 1px rgba(0,0,0,.1);
}

.page-content p {
        margin-bottom: 12px;
}


.post-content p {
        margin-bottom: 12px;
}

small,
.small {
	font-size: 11px;
	line-height: 15px;
	color: #a84d10;
}

abbr,
acronym{
	border-bottom: 1px dotted;
	cursor: help;
	font-variant: small-caps;
}

address,
cite,
em,
i{
	font-style: italic;
}

.pagetitle1 {
	color: #A84D10;
}

.pagetitle2 {
	color: #5A481C;
}

.post-content ul,
.post-content ol {
	padding-left: 24px;
}

input,
textarea,
select { 
	border: 1px #aaa solid;
	padding: 8px;
	outline: none;
	background: #fff;
}
input:hover,
textarea:hover,
input:focus,
textarea:focus {
	border: 1px #444 solid;
	background: #fffee0;
}
input:focus,
textarea:focus {
	box-shadow:inset 0px 0px 10px rgba(0,0,0,.2);
	-webkit-box-shadow:inset 0px 0px 10px rgba(0,0,0,.2);
	-moz-box-shadow:inset 0px 0px 10px rgba(0,0,0,.2);
}
textarea {
	min-height: 120px;
	max-width: 450px;
	min-width: 210px;
}

blockquote {
	border-top: 1px #ccc dotted;
	border-bottom: 1px #ccc dotted;
	text-align: justify;
	margin: 20px;
	padding: 12px;
}
	blockquote:first-letter {
		font-size: 24px;
		padding-right: 1px;
	}
	blockquote:first-line {
		font-size: 20px;
}

a {
	transition: color .3s linear;
	-webkit-transition: color .3s linear;
	-o-transition: color .3s linear;
	-moz-transition: color .3s linear;
	text-decoration: none;
	outline: none;
}

a:link {
	color: #A84D10;
}
a:visited {
	color: #A84D10;
}
a:hover,a:active,a:focus {
	color: #999;
	text-decoration: none;
}



/*	Default 8-column layout
	60 px columns, 24 px gutters, 60 px margins, 768 px total
	---------------------------------------------------------
	1     2      3      4      5      6      7      8     
	60px  144px  228px  312px  396px  480px  564px  648px	*/

.none {
	display: none;
}

.clear {
	clear: both;
}

#if-logged-in {
	position: relative;
	width: 100%;
	height: 24px;
	line-height: 24px;
	background: #000;
	color: #aaa;
	font-size: 10px;
	z-index: 1000;
}
	#if-logged-in .container {
		padding-top: 0;
		padding-bottom: 0;
		margin-top: -24px;
	}
	#if-logged-in p {
		margin: 0;
	}
	#if-logged-in a:link,
	#if-logged-in a:visited {
		color: #fff;
		text-decoration: none;
	}
	#if-logged-in a:hover {
		text-decoration: underline;
	}
	#if-logged-in a:active {
		text-decoration: underline;
		margin-bottom: -1px;
	}

body {
	background: #fff;
	color: #111;
	padding: 0;
}

.container {
	padding: 150px 0 0 275px;
	width: 700px;
	margin: 0;
	overflow: hidden;
	position: relative;
	z-index: 1;
}

#header {
		padding-bottom: 40px;
}
	
	#header-image {
		padding: 0;
		overflow: hidden;
		float: left;
		position: absolute;
		z-index: -1;
	}

		#header-image img {
			width: 465px;
			height: 425px;
			margin: 0;
			padding: 0;
		}
		
		#title {
			padding-bottom: 10px;
			float: left;
		}
			#logo,
			#tagline {

			}
			#logo {
				left: 0;
				font-size: 72px;
				line-height: 72px;
				letter-spacing: 0;
			}
			#tagline {
				font-family:'FrizQuadrataW01-Regular';
				font-size: 21px;
				right: 0;
				line-height: 30px;
				color: #5A481C;
			}
			#tagline-small {
				font-family:'FrizQuadrataW01-Regular';
			        font-size: 14px;
			        color: #A84D10;
			}
		
			#header-image.container {
				padding: 0;
			}
			
		.icons {
			position: relative;
			top: 20px;
			float: right;
		}
		
		.icons img:hover {
		opacity: 0.85;
		}
			
	#nav-primary {
	    font-family:'Friz Quadrata W01 Bold';
	    font-size: 16px;
	    line-height: 18px;
		clear: both;
		width: 100%;
		padding: 0;
		text-transform: uppercase;
	}
		#nav-primary ul,
		#nav-primary li {
			list-style: none;
		}
			#nav-primary a {
				font-family:'Friz Quadrata W01 Bold';
				float: left;
				padding: 0 30px 0 0;
				color: #5A481C;
				margin-bottom: -10px;
				transition: color .3s linear;
				-webkit-transition: color .3s linear;
				-o-transition: color .3s linear;
				-moz-transition: color .3s linear;
			}
			    
			#nav-primary a:hover {
			    color: #999;
			    }
			
	#widget-header {
		clear: both;
	}

	#widget-alert {
		background: #C6D8CD;
		border: 1px #5b816a solid;
		padding: 24px;
		margin-bottom: 24px;
	}

.post-single {
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.post-content {
    margin-top: 10px;
	float: left;
    width: 100%;
}

.page-content {
    margin-top: 10px;
    float: left;
    width: 100%;
}


#footer {
	font-size: 10px !important;
	line-height: 14px !important;
	margin: 20px 0 30px 0;
	float: left;
}
	
	#footer .container {
		padding-top: 20px;
		padding-bottom: 20px;
		
	}
		#footer-content {
			padding: 20px;
		}
			#footer ul,
			#footer li {
				display: inline;
				list-style: none;
			}
				#footer li a {
					padding: 0 20px 0 0;
				}
				
	#footer .footerblock1 {
	   float: left;
	   width: 70%;
	}
	
	#footer .footerblock2 {
	   float: left;
	   width: 30%;
	   text-align: right;
	}
		
#content {
	width: 700px;
	float: left;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#blog-content {
    width: 490px;
    float: left;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
	
#content-content {
	width: 452px;
	padding-right: 20px;
	float: left; 
}
	
#sidebar {
	width: 190px;
	float: left;
	margin-left: 10px;
	padding-left: 10px;
	overflow: hidden;
}

	#sidebar .widget-area {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
		
		#sidebar ul,
		#sidebar li {
			padding: 0;
			margin: 0;
			list-style: none;
		}
				#sidebar .children {
					padding-left: 10px;
				}
					#sidebar .children .children {
						padding-left: 10px;
					}

#product-header {
	width: 100%;
    margin-top: -20px;
    float: left;
}

    .product-thumb {
        padding-right: 15px;
        float: left;
		width: 72px;
		height: auto;
    }
    
    .product-thumb:hover {
    opacity: 0.85;
    }

#children li {
    display: inline;
    padding-right: 30px;
}

.home-button-container {
    margin-top: -25px;
    text-align: center;
}

.home-button {
    margin-right: 50px;
}

    .home-button-right:hover {
        opacity: 0.85;
    }
    .home-button:hover {
        opacity: 0.85;
    }

#store-product-image {
	float: left;
	margin: 0 20px 20px 0;
}

#store-product-info {
	float: left;
	width: 360px;
}

.store-front-thumbs {
    float: left;
    margin: 20px 20px 0 0;
    text-align: center;
    height: 280px;
}

.store-front-thumbs img:hover {
    opacity: 0.85;
}

.comment {
	margin-bottom: 24px;
}

::selection {
	background: #c6d8cd;
}
::-moz-selection {
	background: #c6d8cd;
}
img::selection {
	background: transparent;
}
img::-moz-selection {
	background: transparent;
}




/*	13-column layout
	60 px columns, 24 px gutters, 72 px margins, 1212 px total (extra space for scrollbars)
	---------------------------------------------------------------------------------------
	1     2      3      4      5      6      7      8      9      10     11     12     13
	60px  144px  228px  312px  396px  480px  564px  648px  732px  816px  900px  984px  1068px	*/

@media only screen and (min-width: 1212px) {
	
	.container {
		padding: 150px 0 0 275px;
		width: 700px;
	}
		#header-image img {
			width: 465px;
			height: 425px;
			margin-left: 0;
		}
		#content {
			width: 700px; /* 8 columns */
		}
		#content-content {
	                width: 452px;
	                padding-right: 20px; 
	        }
		#sidebar {
			width: 190px;
		}
	
}


/*	5-column layout
	60 px columns, 24 px gutters, 42 px margins, 480 px total
	---------------------------------------------------------
	1     2      3      4      5
	60px  144px  228px  312px  396px	*/

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

	.container {
		padding: 215px 24px 0 24px;
		width: 396px;
		margin: 0 auto;
		-webkit-text-size-adjust: 100%; /* Prevents Mobile Safari from bumping up font sizes in landscape */
	}

		#logo,
		#tagline {
			position: relative;
			line-height: 30px;
		}
		
		#logo {
			font-size: 42px;
		}

		#sidebar {
			float: none;
			width: 376px;
			margin: 0px;
		}

		#header .container {
			padding-top: 40px;
			padding-bottom: 12px;
		}
			#title {
				height: 20px !important;
			}
				#tagline {
					font-size: 19px !important;
				}
				#tagline-small {
				        font-size: 11px !important;
				}
				
				
			#header-image {
				height: 362px !important;
				padding: 0;
				float: none;
			}
				#header-image img {
					width: 396px;
					height: 362px;
				}
				
		#nav-primary {
		        font-size: 16px !important;
		        line-height: 36px !important; 
		}
				
		#content {
			width: 396px; /* 5 columns */
			float: none;
			padding: 0;
		}
		
		#content-content {
	        width: 396px;
	        float: none;
	        padding-right: 0px; 
	        }
	        
	    #blog-content {
            width: 396px;
        }
		
		#sidebar {
			width: 396px; /* 5 columns */
			padding-top: 30px;
		}
		
		.icons {
		        top: -80px;
		}
		
		#footer {
		    width: 396px;
		}
		
		#footer .container {
			padding-top: 0;
		}
		
		#footer-content {
			border: 0;
			padding: 10px;
		}

		
		.home-button {
		    margin: 0 0 8px 0;

        }

	
	.gigantic {
		font-size: 68px;
		line-height: 72px;
		letter-spacing: -2px;
	}
	
	.huge,
	h1 {
		font-size: 42px;
		line-height: 48px;
		letter-spacing: -1px;
	}
	
	.large,
	h2 {
		font-size: 24px;
		line-height: 32px;
	}
	
	.big,
	h3,
	#post-single h2 {
		font-size: 18px;
		line-height: 25px;
	}
	
	.normal,
	body,
	#post-single h3 {
		font-size: 13px;
		line-height: 18px;
	}
	
	.small {
		font-size: 11px;
		line-height: 16px;
	}
	
}


/*	3-column layout
	60 px columns, 24 px gutters, 46 px margins, 320 px total
	---------------------------------------------------------
	1     2      3
	60px  144px  228px	*/

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

	#if-logged-in {
		height: 40px;
		line-height: 20px;
	}
		#if-logged-in .right {
			float: left;
			clear: left;
		}
	
	.container {
		padding: 175px 24px 0 24px;
		width: 228px;
		margin: 0 auto;
		-webkit-text-size-adjust: 100%; /* Prevents Mobile Safari from bumping up font sizes in landscape */
	}
		#title {
			height: 60px !important;
		}
		
		#tagline {
			font-size: 20px !important;
			line-height: 24px !important;
			font-size: 16px;
		}
		
		#tagline-small {
			font-size: 12px !important;
		}
		
		#logo {
			font-size: 42px;
		}
		
		#logo,
		#tagline {
			position: relative;
			line-height: 30px;
		}
		
		#header-image img {
			width: 320px;
			height: 292px;
		}
		
		#nav-primary {
		        font-size: 12px !important;
		        line-height: 30px !important; 
		}
		
		.icons {
		    top: -110px;

		}
		
		#nav-primary a {
		        padding: 0 20px 0 0 !important;
		}
		
		#content {
			padding: 0;
			width: 228px; /* 3 columns */
			float: none;
		}
		
		#content-content {
	        width: 228px;
	        float: none;
	        padding-right: 0px; 
	    }
	    
	    #blog-content {
            width: 228px;
        }
	        
		#sidebar {
			padding: 20px 0 0 0;
			margin: 0px;
			width: 228px; /* 3 columns */

		}

        .product-thumb {
            padding-right: 8px;
        }
		
		#footer .container {
			padding-top: 0;
		}
		
		#footer-content {
				border: 0;
				padding: 10px;
		}
		
		#footer .footerblock1 {
	       width: 100%;
	    }
	
	    #footer .footerblock2 {
	       width: 100%;
	       text-align: left;
	    }
	    
	    .home-button {
	        margin: 0 0 8px 0; 
        }
        
    #store-product-image {
    	float: none;
    }
    
    #store-product-info {
    	float: none;
    	width: 100%;
    }

	
	.gigantic {
		font-size: 68px;
		line-height: 72px;
		letter-spacing: -2px;
	}
	
	.huge,
	h1,
	#content h1 {
		font-size: 36px;
		line-height: 48px;
		letter-spacing: -1px;
	}
	
	.large,
	h2 {
		font-size: 26px;
		line-height: 36px;
	}
	
	.big,
	h3, h4,
	#post-single h2 {
		font-size: 16px !important;
		line-height: 25px !important;
	}
	
	.normal,
	body,
	#post-single h3 {
		font-size: 11px;
		line-height: 16px;
	}
	
	.small {
		font-size: 11px;
		line-height: 16px;
	}
	
}

/*	Retina media query.
	Overrides styles for devices with a 
	device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */

@media 
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min-device-pixel-ratio: 2) {
	
	body {
	
	}
	
}

/* Enable images in posts to automatically resize */
/* as browser window changes sizes.               */

.post-content img {
  max-width: 100%;
  height: auto;
}

.container img {
  overflow: hidden;
}


/*	Less Framework 3
	by Joni Korpi
	http://lessframework.com	*/