/* =============================================================================
   The 1140px Grid V2 by Andy Taylor - http://cssgrid.net
   ========================================================================== */
* {
	margin: 0px;
	padding: 0px;	
}

.last {
	margin-right: 0px;
}

a {
	color: #19a1b8;
	text-decoration: underline;
}

a:visited {
	color: green;
}

a:hover {
	color: blue;
}

a img {
	border: none;
}

.small {
	font-size: 0.8em;
}

.clear {
	clear: both;
}	

.left {
	float: left;	
}

.right {
	float: right;
}	


/* =============================================================================
   Structure
   ========================================================================== */
html,body,#window {
	height: 100%;
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	line-height: 24px;
	color: #3e454c;
	background: url(/wp-content/themes/moroccan-spice-journey/images/layout/body-bg.jpg) no-repeat center top;
}

body {
	min-width: 480px;
}

body>#window {
	height: auto;
	min-height: 100%;
}

.container {
	max-width: 960px;
	width: 960px;
	margin: 0 auto;
/*	overflow: auto;
	overflow-y:hidden;
	overflow-x:hidden;
*/
}

#header,
#content,
#footer {
	min-width: 960px;	
}

/* =============================================================================
   Header
   ========================================================================== */
#header {
	width: 100%;
	height: 172px;
}

#header .container {
	position: relative;	
/*
	overflow: auto;
	overflow-x: hidden;
	overflow-y: hidden;
*/	
}

#header h1 {
	margin: 0;
	font-size: 14px;
	color: #202020;
	width: 250px;
}

#header h1 a {
	display: block;
}	

#header h1 img {
	position: absolute;
	left: 10px;
	top: 20px;
}	


/* =============================================================================
   Navigation
   ========================================================================== */
#nav {
	width: 700px;
	float: right;
	height: 106px;
	padding: 66px 10px 0px 0px;
	position: relative;
/*	overflow: auto;
	overflow-y:hidden;
	overflow-x:hidden;
*/}

#nav ul {
	float: right;
	position: relative;
}	

#nav li {
	list-style: none;
	float: left;
	position: relative;
}

#nav a {
	color: #aee5ee;
	padding: 40px 14px 20px;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	display: block;
}

#nav li a:hover {
	color: #fff;
	background: url(/wp-content/themes/moroccan-spice-journey/images/layout/nav-hover.png) no-repeat center 14px;
}

#nav li.current_page_item a {
	color: #fff;
	background: url(/wp-content/themes/moroccan-spice-journey/images/layout/nav-hover.png) no-repeat center 14px;
}

#nav li.page-item-5 a {
	padding: 40px 14px 20px 5px;
}

#nav li.page-item-8 a {
	padding: 40px 0px 20px 14px;
}

#nav .fb-like {
	position: absolute;
	top: 48px;
	right: 0px;
}	

/* =============================================================================
   Drop downs
   ========================================================================== */
#nav ul li:hover > ul {
	opacity: 1;
	visibility: visible;
	margin: 0;
}

#nav ul ul {
	margin: 0;
	padding: 0px;
	list-style: none;
	width: 200px;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 70px; 
	z-index: 9999;
    left: 0px;
	background: #1794a8;
	border-bottom: 1px solid #fff;
}

#nav ul ul li {
	float: left;
	position: relative;
	width: 100%;
}

#nav ul li ul li a, 
#nav ul li.current ul li a {
    color: #aee5ee;
	margin: 0;
	padding: 10px 13px;
}

#nav li.active a li a, 
#nav li:hover a li a {
	color: #fff;
}

#nav ul li:hover ul li a {
	color: #fff;
}	

#nav ul li:hover ul li a {
	background-image: none;	
}

#nav ul ul li:hover, 
#nav ul li:hover ul li:hover a {
	background-image: none !important;
}		

/* =============================================================================
   Slider Container
   ========================================================================== */
#slider {
	width: 1062px;
	margin: 0 auto;	
	height: 554px;
}

#slider .container {
	width: 1052px;
	max-width: 1052px;
	background: #fff;
	border: 5px solid #fff
}

/* =============================================================================
   Banners
   ========================================================================== */
#banner {
	width: 1052px;
	margin: 0 auto;	
	height: 320px;	
}

#banner .container {
	width: 1052px;
	max-width: 1052px;
	height: 251px;
	border: 5px solid #fff;
}

#banner img {
}

/* =============================================================================
   Content
   ========================================================================== */
#content {
	padding: 80px 0px;
	position: relative;
	background: #fff;
}

#content .container {
	overflow: auto;
	overflow-y: hidden;
	overflow-x: hidden;
}	

#content h2,
#content h3,
#content h4 {
	font-weight: 300;
	text-transform: uppercase;
	margin: 0px 0px 30px;
}

#content h2 {
	font-size: 187%;
	line-height: 118%;
}	

#content p {
	font-size: 87%;
	margin: 0 0 15px;
	font-weight: 300;
}	

#content a:hover {
	cursor: pointer;
	text-decoration: none;
}

#content .container a {
	color: #19a1b8;	
}

#content .col {
	padding: 0px 10px;	
}

#content .col.left {
	width: 530px;
}

#content .col.right {
	width: 350px;
}

#content .col.left ul {
	margin: 0px 0px 0px 22px;
}

#content .col.left ul li {
	padding: 0px 0px 10px 23px;
	list-style: none;
	background: url(/wp-content/themes/moroccan-spice-journey/images/layout/bullet.gif) no-repeat left 3px;
	font-weight: 300;
}

#content .col.left img.alignright {
	float: right;
	margin: 0px 0px 20px 20px;	
}

#content .col.left img.alignleft {
	float: left;
	margin: 0px 20px 20px 0px;	
}

/* =============================================================================
   Home Page
   ========================================================================== */

/* =============================================================================
   Right Column
   ========================================================================== */
ul.snippets {
	overflow: auto;
	overflow-y: hidden;
	overflow-x: hidden;
}

ul.snippets li {
	list-style: none;
	overflow: auto;
	margin: 0px 0px 10px;
}

ul.snippets li .circle {
	width: 89px;
	float: left;
	margin-right: 10px;
	position: relative;
	text-align: center;
}

ul.snippets li .circle img.frame {
	position: absolute;
	top: 0px;
	left: 0px;
}

ul.snippets li a:hover {
	cursor: pointer;
	display: block;
}

ul.snippets li .copy {
	float: right;
	width: 240px; 
}	

#content ul.snippets li .copy h3 {
	color: #e8a135;
	text-transform: none;
	margin: 0px 0px 5px;
}

#content ul.snippets li .copy h3 a {
	color: #e8a135;
	text-decoration: underline;
}

#content ul.snippets li .copy p {
	margin: 0px 0px 10px;
}

/* =============================================================================
   Inner Pages
   ========================================================================== */

/* =============================================================================
   Products
   ========================================================================== */
#content ul.three.box {
	overflow: hidden;
}

#content ul.box li {
	width: 282px;
	float: left;
	list-style: none;
	position: relative;
	margin-bottom: 40px;
}

#content ul.box li.center {
	margin: 0px 48px;
}	

#content ul.box li h3 {
	color: #19a1b8;
	font-size: 87%;
	text-transform: none;	
	margin: 0px 0px 5px;
	line-height: 100%;
}

#content ul.box li img {
	border: 1px solid #d4d4d4;
	margin: 0px 0px 25px;
}

#content ul.box li p.btn a {
	font-size: 86%;
	color: #fff;
	text-decoration: none;
	background: #19a1b8;
	padding: 14px 17px;
	display: inline;
	text-transform: uppercase;
	text-align: center;
	height: 12px;
	width: auto;
	opacity: 1;
	transition: all .3s ease-in-out;
}

#content ul.box li p a.view {
	font-size: 86%;
	color: #fff;
	text-decoration: none;
	background: #19a1b8;
	padding: 11px 0px 9px;
	display: block;
	width: 105px;
	text-transform: uppercase;
	text-align: center;
	height: 25px;
	opacity: 1;
	transition: all .3s ease-in-out;
	margin: 20px 0px 0px
}

#content ul.box li p.btn a:hover,
#content ul.box li p a.view:hover {
	opacity: 0.8;
	transition: all .3s ease-in-out;
	cursor: pointer;
}

#content ul.box li .fb-share-button {
	position: absolute;
	z-index: 999;
	top: 13px;
	left: 13px;
}

#content ul.box li .share {
	position: absolute;
	left: 10px;
	top: 10px;
}

#content ul.box li .share span {
	width: 12px;
}
#content ul.box li .gallery-copy a.view {
	display: none !important;
}	

/* =============================================================================
   Stockist
   ========================================================================== */
#content .left.col ul.stockists {
	/*margin: 0px;
	padding: 0px;	
	overflow: hidden;*/
	display: none;
}

#content .left.col ul.stockists li {
	width: 48%;
	float: left;	
	background: none;
	padding: 0px;
	margin: 0px 0px 30px;
}

#content .left.col ul.stockists li.right {
	float: right;
}

/* =============================================================================
   Recipe Pages
   ========================================================================== */
#content .col.left.ingredients {
	width: 300px;
}

#content .col.left.ingredients ul {
	margin: 0px 0px 20px 22px;
}

#content .col.left.ingredients ul li {
	background: none;	
	list-style: disc;
	font-size: 87%;
    font-weight: 300;
    margin: 0 0 5px;
	padding: 0px;
}

#content .col.right.recipe {
	width: 580px;
}

#content .wp-body {
	overflow: auto;
	overflow-y: hidden;
	overflow-x: hidden;	
}

#content .wp-foot {
	padding: 20px 0px;	
}

#content p.category,
#content p.tags {
	margin: 0px 0px 5px;	
}

#content .share-inner {
	margin: 0px 0px 30px;	
}

#content #respond {
	border-top: 1px solid #ccc;	
}

#content #respond h3 {
	margin-top: 20px;
}	

#content #respond form {
	width: 960px;
}

#content #respond form p textarea,
#content #respond form p input {
	border: 1px solid #3e454c;
	font-family: 'Roboto', sans-serif;
	font-size: 86%;
	padding: 5px; 
	display: block;
	float: right;
	width: 640px;
}

#content #respond form p {
	width: 100%;
	overflow: hidden;
	margin-bottom: 15px;
}	

#content #respond form p label {
	float: left;
	width: 220px;	
}

#content #respond form p input {
	height: 24px;
}

#content #respond form textarea {
	height: 200px;
}

#content #respond form input#submit {
	background: #19a1b8;
    color: #fff;
    display: block;
    font-size: 86%;
    height: 44px;
	width: 140px !important;
    opacity: 1;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease-in-out 0s;
    width: auto;	
	font-family: 'Roboto', sans-serif;
	font-size: 300;
	border: 0px;
}

/* =============================================================================
   Contact
   ========================================================================== */
#content .pagination {
	overflow: hidden;
	text-align: center;
	line-height: 210%;
	font-weight: 300;
	font-size: 87%;
}

#content .pagination span.pages {
	float: left;
	background: #19a1b8;
	display: block;
	width: 60px;
	margin-right: 10px;
	border: 0px;
	color: #fff;
}

#content .pagination span {
	background: #19a1b8;
	color: #fff;
	text-decoration: none;
	width: 30px;
	height: 30px;
	border: 0px solid #000;
	margin: 0px 2px;
	float: left;
	text-align: center;
	display: block;
	padding: 0px;
}

#content .pagination span.current {
	background: #158fa4;
}	

#content .pagination a {
	background: #19a1b8;
	color: #fff;
	text-decoration: none;
	width: 30px;
	height: 30px;
	border: 0px solid #000;
	margin: 0px 2px;
	float: left;
	text-align: center;
	padding: 0px;
	display: block;
	opacity: 1;
	transition: all .3s ease-in-out;
	cursor: pointer;
}

#content .pagination a:hover {
	opacity: 0.8;
	transition: all .3s ease-in-out;
	cursor: pointer;
}	

#content .pagination a.next {
	background: #19a1b8;
	display: block;
	width: 60px;
	margin-left: 10px;
	border: 0px;
}

/* =============================================================================
   Contact Form
   ========================================================================== */
#content .accua-form-view-standard {
	font-family: 'Roboto', sans-serif;
	font-size: 300;
}

#content .pfbc-element {
	margin: 0px 0px;	
}

#content .accua-form-view-standard label {
	font-weight: 300;	
	font-size: 87%;
}

#content .accua-form-view-standard input.pfbc-textbox {
	height: 24px;	
}

#content .accua-form-view-standard .pfbc-checkboxes {
	margin: 0px 0px 10px;	
}

#content .accua-form-view-standard .pfbc-checkbox {
	border: 0px;	
	margin: 0px 0px 3px;
	padding: 0px;
}

#content .accua-form-view-standard .pfbc-checkbox input {
	padding: 0px 10px 0px 0px;	
}

#content .accua-form-view-standard button {
	text-transform: uppercase;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-size: 87%;
}

#content .accuaform-fieldname-upload {
	font-family: 'Roboto', sans-serif;
	font-size: 87%;
}

#content fieldset {
	border: 0px;
	margin: 10px 0px;
}

#content legend {
 	font-family: 'Roboto',sans-serif;
    font-size: 87%;
    margin-bottom: 5px;
}

/* =============================================================================
   Page Not Found
   ========================================================================== */
#content #searchform label.screen-reader-text {
	padding: 0px 10px 0px 0px;
}

#content #searchform #s {
	width: 200px;
	border: 1px solid #ccc;
	height: 26px;
}	
   
#content #searchform #searchsubmit {
	background: none repeat scroll 0 0 #19a1b8;
    border: 0px solid #fff;
    padding: 4px 17px;
	font-family: 'Roboto',sans-serif;
    font-size: 87%;
    text-align: center;
    text-transform: uppercase;
	color: #fff;
}
   
/* =============================================================================
   Footer
   ========================================================================== */
#footer {
	background: #e8a135;
	height: 145px;
	color: #ffd79b;
	font-size: 81%;
}

#footer .container {
	padding: 46px 0px;	
}

#footer ul {
	overflow: auto;
	margin: 0px 0px 5px;
}

#footer li {
	float: left;
	list-style: none;	
}

#footer li a {
	padding: 0px 5px;	
	display: block;
}

#footer li.page-item-5 a {
	padding: 0px 5px 0px 0px;
}	

#footer ul li li {
	display: none;	
}

#footer a {
	color: #ffd79b;
	text-decoration: none;
	text-transform: uppercase;
}	

#footer li.current a,
#footer a:hover {
	color: #fff;
}

#footer p span.cvw {
	background: url(/wp-content/themes/moroccan-spice-journey/images/layout/cvw-creative-logo.gif) no-repeat right 5px ;
	width: 100px;
	height: 18px;
	text-indent: -9999px;
	display: block;
	float: right;
}
/* =============================================================================
   Smaller screens
   ========================================================================== */
@media screen and (max-width: 1076px) {
	#slider .container,
	#slider,
	#banner .container,
	#banner {
		width: 950px;	
		max-width: 950px;	
	}
}

/* =============================================================================
   Mobile
   ========================================================================== */




/* C4 Customization */

.widget_sp_image > h3 {
    margin: 0 0 10px 0 !important;
    color: #e8a135;
    text-decoration: underline;
    text-transform: none !important;
}

.widget_sp_image-image-link {
    float: left;
    display: block;
    margin: 7px 20px 10px 0;	
}