@import url(reset.css); 

/**
 * ProcesssWire.com site template stylesheet. Prepared for use in the basic site profile. 
 *
 * Please feel free to use and/or modify under the same license as ProcessWire.
 *
 * Copyright 2010 by Ryan Cramer Design, LLC
 *
 */


/*
link         #676766
link:hover   #e41c39
*/

html {
	height:100%;
	background: #fff url(images/fadebg2.png) bottom left repeat-x;
	background-attachment:fixed;	
}

body {
	height:100%;

}

body, input, textarea, table {
	font-family: Helvetica Neue, "Arial", sans-serif; 
	font-size: 14px;
	color: #676766; 
}

#wrapper {
	width:980px;
	position:relative;
	margin:0 auto;
    top:0px;
    z-index: 2;
    overflow:hidden;
display:block;
}

.bg_img {
	width:100%;
	height:500px;
	top:0;
	left:0;
	z-index: -1;
	position:absolute;
	background-color:white;
}

header,
#content,
footer {
	padding-right: 20px;
	padding-left: 20px;
}

.container {
	position: relative;
	
	
}

header {
	background: none;
	height: 200px; 
}

	#logo {
       position: absolute; 
        left: 0;
		top: 0px; 
		background: url(images/kateskitchen-logo.png); 
		width: 218px;
		height: 134px; 
        text-indent: -9999px; 
	}

	#title {
		font-size: 2em; 	
		color: #e41c39; 
		position: relative;
		font-weight:300;
	}


	/*-------------------- main navigation --------------------*/

	header nav {
		    position:relative;
		    float: right;
		    height:50px;
		    margin: 0px;
	        z-index: 999;
        	font-family: Helvetica Neue, "Arial", sans-serif;
		}	

	header nav ul { 
	         margin:0 ;
			 padding: 5px 0 ;
			 height:30px;
		  	 float:left;
			 }
	header nav li {
		     height:20px;
		     width: 130px;
		     position:relative;
	         float: left;
	         text-align:center;
		     margin: 0;
		     padding: 10px 0px;
	         list-style:none;
	         border-right: 2px dotted #999;
			 }
			 
		header nav li:last-child {
				border:none;
			 }		 
			 
	header nav a { 
	         color: #415968; 
			 text-decoration: none;
			 font-size: 1em;
			 letter-spacing: 0.2em;
			 line-height: 20px;
			 text-align:center;
			 text-transform: lowercase; 
			 padding: 9px 0 ;
			 }
	header nav a:hover {
		     color: #c4122f;
			 }



	header nav ul li ul { 
			margin:0;
			width:130px;
			padding-top: 18px;
			position:absolute;
			border:none;
			display:none;
			background-image: url(images/top_arrow.png);
			background-repeat: no-repeat;
			background-position: 6px 10px;
			 }

	header nav ul li:hover ul {
		display:block;
		}

	header nav ul li ul li { 
	        margin:0;
		    padding:5px 0;
			display:block;
			float:none;
			border:none; 
			background-color:#cdcccb;
			 }
			 

	header nav ul li ul li:first-child { 
		border-radius: 5px 5px 0px 0px;
			 }			
			 
	header nav ul li ul li:last-child { 
		border-radius: 0px 0px 5px 5px;
			 }			  
			 
			 

	header nav ul li ul li a{ 
	       font-size: 0.8em;
		   color: #676766;
		   text-transform: capitalize;
		   padding: 4px 0 ;
			 }

	header nav ul li ul li a:hover { 
	       font-size: 0.8em;
		   color: #e42238;
			 }

	header nav ul li ul li ul li { 
			display:none;
			 }

	

	#topnav {
        position: relative;
        float:right;
		top: 3px;
	}

		#topnav li {
         display:block;
         float:left;
         border-right: 2px dotted #999;
		}

			#topnav a,
			#sidebar ul.nav a,
			#breadcrumb a,
			a.nav {
				font-family: Helvetica Neue, "Arial", sans-serif; 
				font-size: 14px; 
				letter-spacing:1px;
				font-weight:300; 
				text-transform: lowercase; 
				color: #676766; 
			}

			#topnav a {
				display: block;
				float: left; 
				margin: 0 0 0 1px;
				padding: 20px 15px ;
			}

			#topnav a:hover,
			#topnav a.on {
				color: #e41c39; 
			}

	#breadcrumb {
		position: relative; 
		left: 0; 
		top: 10px; 
		list-style:none;
	}
#bodycopy_product #breadcrumb li {
			color: #676766; 
			font-size: 10px; 
            display: inline;
            padding: 0 2px 0 0;
            list-style:none;
            margin:0;

		}
#bodycopy_product #breadcrumb a {
				color: #676766; 
				padding: 0 2px 0 0;
			}
#bodycopy_product #breadcrumb a:hover {
				text-decoration: none; 
				color:#e41c39;
				background:none;
			}

	#search_form { }

		#search_query {
			position: absolute; 
			top: 7px;
			right: 0; 
			width: 222px; 
			padding: 2px 5px;
			height: 17px; 
			border: none;
		}

		#search_submit {
			position: absolute; 
			top: 7px;
			right: 0; 
			border: none;
			background: url(images/btn-search.png) top left no-repeat; 
			width: 27px;
			height: 21px;
			text-indent: -9999px; 
		}
			#search_submit:hover {
				background-position: center left; 
				cursor: pointer; 
			}
			#search_submit:focus {
				background-position: bottom left; 
			}

	header #photo {
		position: absolute;
		top: 34px;
		right: 0; 
	}

	/*-------------- jquery galleria size --------------*/

#galleria{
		 height:300px;
		 width:100%;
	   	 margin:20px 0 25px -5px;
		 position:relative;
		 }	


.galleria-counter {
	display:none;
}


#content {
	background: #fff; 
	font-size: 14px; 
	line-height: 1.7em; 
	color: #333; 
	padding-top: 0;
	padding-bottom: 4em;
	min-height: 400px; 
	border-top:4px solid #59180b;
	border-left:4px solid #59180b;
	border-right:4px solid #59180b;
	-webkit-border-radius: 15px 15px 0px 0px;
	border-radius: 15px 15px 0px 0px;
	overflow:hidden;
}

#content_head {
	position:relative;
	display:block;
}

	#content p,
	#content ul,
	#content ol,
	#content table {
		margin: 1em 0 1.5em 0;
	}
	
	

	#content a {
		color: #676766; 
	}
		#content a:hover {
			background-color: #f00076; 
			color: #212121; 
			text-decoration: none; 
		}

	#content em {
		font-style: italic;
	}

	#content strong {
		font-family: Helvetica Neue, "Arial", sans-serif; 
		font-weight: bold; 
		color: #555; 
	}

	#content h2,
	#content h3,
	#content h4 {
		margin-top: 1.5em; 
		line-height: 1.3em;
	}

	#content h2 {
		color: #e42643; 
		font-size: 23px; 
		margin-bottom: 0.5em; 
	}

	#content h3 {
		color: #690033; 
		font-size: 18px; 
		border-bottom: 1px dotted #ccc; 
		margin-bottom: -0.5em; 
		padding-bottom: 0.25em; 
	}
		#content h2 + h3 {
			margin-top: 0;
		}

		#content h3 + ul,
		#content h3 + ol {
			margin-top: 1.5em; 
		}

	#content h4 {
		font-size: 1em; 
		font-weight: bold; 
		text-transform: uppercase; 
	}

	#content ol li {
		margin: 0 0 0 3em; 
	}

	#content ul li {
		margin: 0 0 0 0em;
		display: list-item; 
	}

	#content ol li {
		margin: 0 0 0 3em; 
		display: list-item;
		list-style: decimal;
	}

	#content ul.nav { }

		#content ul.nav li {
			display: block;
			list-style: none; 
			margin: 0;
			border-bottom: 1px dotted #ccc; 
		}
			#content ul.nav li a {
				font-family: Helvetica Neue, "Arial", sans-serif; 
				font-weight: 300;
				font-size:1.2em; 
				margin: 0;
				padding:5px 10px;
			}

			#content ul.nav li p {
				margin: 1em 0;
			}

	#content .disclaimer {
		font-size: 11px;
		line-height: 17px; 
		color: #777; 
	}


/* ---------- products --------------  */	

#product_raster {
	width:700px;
	overflow:hidden;
}

.cat_box {
	width:170px;
	float:left;
	overflow:hidden;
	margin:25px 0 100px;
}

#product_raster .cat_box p {
	padding:0 10px 0 0;
	line-height:14px;
	font-size:0.9em;
	margin: 8px 0 0;
}

#product_raster .cat_box a {
	padding: 0;
	color:#e41c39;
}

#product_raster .cat_box a:hover {
	background:none;
	color:#676766;
}

#product_raster .cat_box h4 {
	padding:0 10px 0 0;
	margin: 8px 0 0;
	font-weight:400;
	letter-spacing:0.1em;
	font-size:1.2em;
	font-family: Helvetica Neue, "Arial", sans-serif; 
	text-transform: capitalize;
	color:#676766;
}



#sidebar {
	position: relative; 
	float: right;
	width: 300px; 
	min-height: 200px; 
	padding-bottom: 2em; 
}

#sidebar_product {
	position: relative; 
	float: left;
	width: 170px; 
	min-height: 200px; 
	margin-top:35px;
	padding-bottom: 2em; 
	border-right:1px dashed #676766;
}

#sidebar_product h2 {
	padding:0;
	margin:0 0 0 10px;
	font-weight: 200;
	font-family: "Helvetica Neue", Arial, sans-serif; 
}

	#sidebar h3 {
		border: none; 
		color: #e42643; 
		font-size: 16px; 
	}
		#sidebar h3 + ul.nav {
			margin-top: 1em; 
		}

#sidebar .pdf {
	padding-left:45px;
	width:200px;
	margin:50px auto;
	background:transparent url(images/pdf.png)top left no-repeat;
}

	#sidebar #photo {
		display: block;
	}

	#sidebar ul.nav {
		margin: 0 0 1em 0;
	}
		#sidebar ul.nav li {
			margin: 0; 
			border: none; 
		}
		
		#sidebar_product ul.nav li {
			margin: 0 15px 0 0; 
			border: none; 
		}

		#sidebar ul.nav a {
			display: block;
			padding: 8px 10px 8px 15px; 
			color: #005f7d; 
			background: #d5e5eb; 
			border-top: 1px solid #fff; 
		}
		
		#sidebar_product ul.nav a {
			display: block;
			padding: 8px 10px 8px 15px; 
			color: #676766; 
			background: transparent; 
			border-top:none; 
		}
		
		#sidebar_product ul.nav a:hover,
		#sidebar_product ul.nav a.on {
			background: transparent; 
			color: #e41c39;
			text-decoration: none; 
		}
		
			#sidebar ul.nav a:hover,
			#sidebar ul.nav a.on {
				background: #db1174; 
				color: #676766;
				text-decoration: none; 
			}

		#sidebar_product ul li {
			margin-left:20px;
		}

	#sidebar .sidebar_item {
		padding: 0 5px 0 14px;
		margin: 0 0 2em 0;
		border-left:1px dashed #676766;
	}



#bodycopy {
	padding-right: 340px; 
	padding-left: 20px;
	padding-top: 1px; 
	margin-top: 0;
	
}
#bodycopy_product {
	padding-left: 220px; 
	padding-top: 1px; 
	margin-top: 0;
	
}
	#bodycopy strong {
		color: #444; 
	}

	#content #bodycopy > h2:first-child {
		margin-top: 1em; 
	}

	#bodycopy .video {
		margin: 1em 0;
		background: #000;
		padding: 10px; 
		padding-bottom: 3px; 
		width: 640px; 
	}


hr {
	background: transparent;
	color: transparent;
	border-left:  none;
	border-right: none;
	border-top:   none;
	border-bottom: 1px dashed #000;
}

footer {
	height:200px;
	background: transparent url(images/footer2.png) top left no-repeat;
	clear: both; 
	border: none;
	font-size: 11px; 
	padding: 2em 0;
}

footer ul {
	width:600px;
	margin:180px auto 0;
}

footer ul li {
	float:left;
	list-style:none;
	padding: 0 10px;
}

.footer_divider {
	border-right:1px solid #212121;
}

	footer p,
	footer a {
		color: #676766; 
	}

	footer p {
		text-align: center; 
	}

	footer a:hover {
		text-decoration: none; 
		color: #e41c39; 
	}

/**
 * The edit link that appears when you are logged in.
 * It is recommended that you implement an edit button 
 * in your templates to make it easy to switch to and
 * from the admin control panel when editing pages. 
 *
 */
#editpage {
	position: absolute;
	top: 0;
	left: 0; 
	padding: 5px 6px; 
	background: #db1174; 
	color: #fff; 
	display: block;
	font-weight: bold; 
}
	#editpage:hover {
		background: #ffffcc;
		color: #000; 
	}


/**
 * Alignment styles that are used by the InputfieldTinyMCE for 
 * positioning images in bodycopy. If you are using this field type, 
 * you may want to include these or similar styles in your site.
 *
 */
.align_left {
        float: left;
        margin: 0 1em 0.25em 0;
}

.align_right {
        float: right;
        margin: 0 0 0.25em 1em;
}

.align_center {
        display: block;
        margin-left: auto;
        margin-right: auto;
}

/**
 * Optional CSS classes specific to the FieldtypeComments module
 * when used in this site design template. 
 *
 */

#content .CommentList {
	margin: 1em 0 0 0; 
}

	#content .CommentListItem {
		list-style: none; 
		margin: 0;
		border-left: 5px solid #ddd; 
		border-top: 1px dotted #ccc; 
		padding: 1em 0 1px 1em; 
		background: #fff; 
		
	}
		#content .CommentListItem p {
			margin-top: 0; 
		}
		#content .CommentHeader,
		#CommentForm label {
			margin: 0; 
			font-weight: bold; 
			font-size: 11px; 
			text-transform: uppercase; 
			font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
			color: #3786bc; 
		}
		#content .CommentText {
			color: #666; 
		}

#CommentForm { }

	#CommentForm h3 {
		margin: 0; 
		border: none; 
	}

	#CommentForm label {
		display: block;
		color: #f00076; 
		color: #999; 
	}

	#CommentForm p {
		margin: 0.5em 0;
	}

	.CommentForm_cite,
	.CommentForm_email {
		float: left; 
	}
		.CommentForm_cite input,
		.CommentForm_email input {
			width: 200px; 
			margin-right: 1em; 
		}

	.CommentForm_text {
		clear: left; 
	}
		.CommentForm_text textarea {
			padding: 2px; 
			width: 75%; 
			height: 100px; 
		}

	#CommentForm .error {
		background: #a30000; 
		color: #fff; 
		padding: 0.25em 0.5em; 
	}
	#CommentForm .success {
		font-weight: bold; 	
	}



// Contact form

li.InputField {
    list-style-type: none;
}

.InputField {
	width:500px;
}


/**
 * WireFatalError is a class that ProcessWire will use to output
 * fatal errors in the design, but only if debug mode is on, or if
 * you are logged in as a superuser. 
 *
 */
.WireFatalError {
	background: #a30000; 
	color: #fff; 
	padding: 1em; 
	position: relative;
	z-index: 9999;
}
