/* -----------------------------------------
NAVIGATOR MULTIMEDIA INC CSS PAGE STRUCTURE
Designed by: Chris Satterthwaite
Modified By: Chris Satterthwaite
Date Modified: Oct.02.2009
--------------------------------------------
TABLE OF CONTENTS
--------------------------------------------
Reset: 
Body:
Wrapper:
Typography:
Header Section:
Navigation Section:
Content Section:
Footer Section:
Hacks/Fixes:
--------------------------------------------
STYLE RULES
--------------------------------------------
Box
			hieght
			width
			background
			border
			margin
			padding
			display
			
Position
			position
			top
			left
			float
			z-index
			
Font
			color
			font family
			font size
			line hieght
----------------------------------------- */
/* CSS Constants (works in IE6+, FF2+, Opera, Safari and CSS1+)
 * ------------------------------------------------------------
 * Variables like: $variable = 'value';
 * Import this css as:
 * <style type="text/css">
 *		@import '{path-to-cssconst.php}cssconst.php?c={path-to-this-css-file}&{var1}={value1}...';
 * </style> 
 * Comment out constants: replace $ with #

#colour2 = '#2f9a9e';  

*/

/* Reset                                  */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead {
	background: 			transparent;
	border: 				0;
	margin: 				0;
	padding:          		0;
	font-size: 				100%;
	outline: 				0;
	vertical-align: 		baseline;
}
body {
	height:					100%;
}
html {
	height:					100%;
}
ol, ul {
	list-style: 		  	none;
}
blockquote, q {
	quotes: 				none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: 				'';
	content: 				none;
}
/* remember to define focus styles! */
:focus {
	outline: 				0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: 		none;
}
del {
	text-decoration: 		line-through;
}
/*----------------- Body ---------------- */
body {
	background:				#a04910 url(../../images/interface/background.jpg) no-repeat center top;
	margin: 				0px;
	padding: 	    	  	0px;

	color:					#FFF;
	font: 					15px/16px Segoe UI, Arial, Helvetica, sans-serif;
}
/*-------------- Wrapper ---------------- */
#wrapper {
	width:					991px;
	margin:					0px auto;
	padding:          	    0px;
	
	position:       		relative;
	z-index:				10;
}
/*-------------- Typography/Global Styles ------------- */

@font-face {
 	font-family: 			'Lumpy';
 	src: 					url(../fonts/lumpyregular.eot);
	src: 					local('Lumpy'), url(../fonts/lumpyregular.ttf) format('opentype');
}
h1 span, h2 span, h3 span {
	display: 				none;
}
h1 {
	margin-bottom: 			20px;
	
	font-family: 			"Lumpy", Lucida Grande, Arial;
	font-size: 				30px;
	line-height:			30px;
	
	text-shadow:			2px 2px 3px #000;
}
h2 {
	margin-bottom:			20px;

	font-family: 			"Lumpy", Lucida Grande, Arial;
	font-size:				24px;
	line-height:			30px;

	text-shadow:			2px 2px 3px #000;
}
h3 {
	margin-bottom:			20px;

	font-family: 			"Lumpy", Lucida Grande, Arial;
	font-size:				18px;
	line-height:			24px;

	text-shadow:			2px 2px 3px #000;
}
p {
	margin-bottom:			20px;
	
	font-size:				14px;
}
ul {
	margin:			        0px 0px 20px 60px;
		
	list-style:				disc;
}
ol {
	margin:			        0px 0px 20px 60px;
	
	list-style:				decimal;
}
li {
	padding-bottom:         10px;
}
a {
	color: 					#f6cb4f;
	text-decoration:		none;
}
a:hover {
	text-decoration:		none;
}
.alignleft {
	float: 					left;
}
.alignright {
	float: 					right;
}
.textleft {
	text-align: 			left;
}
.textright {
	text-align: 			right;
}
.textcenter {
	text-align: 			center;
}
.img {
	border: 				1px solid #FFF;
	
	-moz-box-shadow:		2px 2px 5px #000;
	-webkit-box-shadow:		2px 2px 5px #000;
}
.imgleft {
	margin-right: 			10px;
	border: 				1px solid #FFF;

	float: 					left;
	
	-moz-box-shadow:		2px 2px 5px #000;
	-webkit-box-shadow:		2px 2px 5px #000;
}
.imgright {
	margin-left: 			10px;
	border: 				1px solid #FFF;

	float: 					right;

	-moz-box-shadow:		2px 2px 5px #000;
	-webkit-box-shadow:		2px 2px 5px #000;
}
/*-------------- Header Section --------- */
#header {
	height:					391px;
	width:					auto;
	display:				block;
	
	position:				relative;
	z-index:				20;
}
#logo {
	height:					237px;
	width:					206px;
	
	position:				absolute;
	top:					0px;
	left:					0px;
}
#photo {
	width:					799px;
	height:					320px;
	background:				url(../../images/interface/photo-bg.png) no-repeat;
	
	position:				absolute;
	right:					0px;
	bottom:					0px;
	z-index:				50;
}
#images {
	width: 					720px;
	height: 				235px;

	position: 				absolute;
	right: 					37px;
	bottom: 				33px;
	z-index: 				30;

}
#images li {
	margin: 				0px;

	list-style: 			none;
}
/*----------- Navigation Section -------- */
#nav {
	height:					77px;
	width:					auto;
	background:				url(../../images/interface/navigation.jpg) no-repeat;

	position:				absolute;
	top:					34px;
	left:					212px;
	z-index:				20;
}
#nav ul {
	height:					77px;
	width:					746px;
	display:				block;
}
#nav ul li {
	margin:					0px;
	padding:          		0px;
	
	position:				absolute;
	float:					left;
	list-style-type:		none;
}
#nav ul li span {
	display:				none;
}
#nav ul li a {
	height: 				77px;
	display: 				block;
}
.about {
	left:					0px;
	width:					101px;
}
.location {
	left:					101px;
	width:					108px;
}
.our-cheese {
	left:					209px;
	width:					110px;
}
.tour {
	left:					316px;
	width:					106px;
}
.news-events {
	left:					422px;
	width:					107px;
}
.media {
	left:					529px;
	width:					107px;
}
.contact-us {
	left:					636px;
	width:					110px;
}

.about a:hover, .about .selected {
	background:				transparent url(../../images/interface/navigation.jpg) 0px -77px no-repeat;
}
.location a:hover, .location .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -101px -77px no-repeat;
}
.our-cheese a:hover, .our-cheese .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -209px -77px no-repeat;
}
.tour a:hover, .tour .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -316px -77px no-repeat;
}
.news-events a:hover, .news-events .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -422px -77px no-repeat;
}
.media a:hover, .media .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -529px -77px no-repeat;
}
.contact-us a:hover, .contact-us .selected {
	background:				transparent url(../../images/interface/navigation.jpg) -636px -77px no-repeat;
}
/*-------------- Side-Nav Section -------- */
#side-nav {
	width: 					181px;
	height: 				260px;
	
	position: 				absolute;
	left: 					-3px;
	top: 					396px;
	z-index: 				10;
}
.side-nav-border {
	width: 					32px;
	height: 				260px;
	background:				url(../../images/interface/side-nav-shadow.png) no-repeat;

	position: 				absolute;
	left: 					150px;
	top: 					379px;
	z-index: 				20;
}
#side-nav ul {
	margin: 				0px;
	list-style: 			none;
}
#side-nav ul li {
	margin: 				0px;

	padding: 	            4px 0px 0px 0px;
	text-align: 			center;
}
#side-nav ul li:hover {
	position: 				relative;
	right: 					10px;
}
#side-nav .green {
	width: 					184px;
	height: 				33px;
	background:				url(../../images/interface/side-nav-green.png);
}
#side-nav .blue {
	width: 					184px;
	height: 				35px;
	background:				url(../../images/interface/side-nav-blue.png);
}
#side-nav .red {
	width: 					184px;
	height: 				36px;
	background:				url(../../images/interface/side-nav-red.png);
}
#side-nav a {
	color: 					#f4ebc6;
	font-family: 			"Lumpy", Lucida Grande, Arial;
	font-size: 				14px;
	text-decoration: 		none;
}
/*-------------- Content Section -------- */
#content {
	width: 					760px;
	min-height:       		400px;/*Real browsers will read this for Min-Hieght*/
	height:					auto !important;
	height:					400px;/*Hack to make this work in IE6*/
	padding:                20px;

	float: 					right;
}
/*-------------- Photo Gallery Section -------- */
#gallery {
	width: 					100%;
	height: 				auto;
	margin-left: 			0px;
}
#gallery li {
	width: 					130px;
	height: 				100px;
	background:				url(../../images/interface/sm-photo-bg.png) no-repeat;
	margin: 				0px;
	padding: 	        	8px 10px;
	display: 				block;	
	float: 					left;
	list-style: 			none;
}
#gallery .gallery-img {
	width: 					120px;
	height: 				90px;
}
#gallery a {
	width: 					120px;
	height: 				90px;
	
	display: 				block;
}
/*------------- Cheese Section ---------- */
.listing {
	width: 					100%;
	min-height: 			120px;
	border-bottom: 			1px solid #FFF;
	margin-bottom:			20px;
	padding-bottom: 		10px;

	position: 				relative;
	display: 				block;
}
.listing .date {
	float: 					right;
	
	font-size: 				18px;
	font-weight: 			bold;
}
.listing .image {
	width: 					130px;
	height: 				100px;
	background:				url(../../images/interface/sm-photo-bg.png) no-repeat;
	margin-right: 			10px;
	padding: 	            8px 10px;

	float: 					left;
}
.listing .listing-img {
	width: 					120px;
	height: 				90px;
}
.listing .text {
	width: 					420px;
	height: 				auto;
	margin-right: 			10px;
	
	float: 					left;
}
.listing .grams {
	width: 					50px;
	
	float: 					left;
}
.listing .price {
	width: 					120px;
	
	float: 					left;

	text-align: 			center;
}
.listing .readmore {
	width: 					125px;
	background: 			#682300;
	border: 				1px solid #FFF;

	position: 				absolute;
	bottom: 				10px;
	right: 					0px;
	display: 				block;

	color: 					#FFF;
	text-align: 			center;
	text-decoration: 		none;

	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
}
.back {
	width: 					184px;
	height: 				29px;
	background: 			url(../../images/interface/button.png) no-repeat;
	padding: 	            8px 0px 0px 0px;

	float: 					right;
	display: 				block;

	color: 					#f4ebc6;
	font-family: 			Lumpy, Segoe UI, Arial;
	text-align: 			center;
	text-decoration: 		none;
	
	cursor: 				pointer;
}
.back:hover {
	background: 			url(../../images/interface/button.png) no-repeat 0px -37px;
}

.cheese-nav {
	width:					184px;
	height:					29px;
	background: 			url(../../images/interface/button.png) no-repeat;
	padding: 	            8px 0px 0px 0px;
	
	float:					left;
	display:				block;
	
	color: 					#f4ebc6;
	font-family: 			Lumpy, Segoe UI, Arial;
	text-align: 			center;
	
	cursor:					pointer;
}
.cheese-nav:hover {
	background: 			url(../../images/interface/button.png) no-repeat 0px -37px;
}

/*Stupid IE Clearfix*/
.iefix {
	display: block; 
	width: 100%;
}

/*------------- News & Events Details --------- */
.newsimage {
	position:		relative;
	float:			left;
	min-height: 	90px;
	height:			250px;
	width: 			250px;
	margin: 		0 10px 10px 0;
	border: 		1px solid #fff1d2;
}

.newsimage a {
	height:			250px;
	display:		block;
}

/*------------- Testimonials Section ---------- */
.testimonial {
	width: 					100%;
	min-height: 			50px;
	border-bottom: 			1px solid #FFF;
	margin-bottom: 			20px;
	padding-bottom: 		10px;
}
.testimonial .name {
	width:					100%;
	
	font-weight: 			bold;
	font-size: 				18px;
	text-align: 			right;
}
.testimonial blockquote {
	width: 					650px;
	margin-bottom:			20px;
	padding: 				0 60px;

	display: 				block;
}
.testimonial blockquote:before, blockquote:after {
	width: 					50px;

	display: 				block;

	color: 					#000;
	font-size: 				700%;
}
.testimonial blockquote:before {
	height: 				30px;
	background:				url(../../images/interface/left-quote.png) no-repeat;
	margin-left: 			-40px;
	
	color: 					#000000;

	content: 				open-quote;
}
.testimonial blockquote:after {
	height: 				30px;
	background:				url(../../images/interface/right-quote.png) no-repeat;
	margin-top: 			-30px;
	margin-left: 			650px;	
	
	content: 				close-quote;
}
.testimonial .reply {
	border-top: 			1px dotted #FFF;
	margin-top: 			30px;
	padding: 	            10px;

	float: 					right;
	
	font-size: 				12px;
}
/*------------- Contact Section ---------- */
.row {
	width: 					425px;
	height: 				30px;
	
	display: 				block;
}
.message-row {
	width: 					425px;
	height: 				110px;
	
	display: 				block;
}
label {
	width: 					90px;
	height: 				20px;
		
	float: 					left;
}
input {
	width: 					325px;
	height: 				20px;
	background: 			#682300;
	border: 				none;
	
	float: 					right;

	color: 					#FFF;
	
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
}
select {
	width: 					325px;
	height: 				20px;
	border: 				none;
	background: 			#682300;

	float: 					right;

	color: 					#FFF;

	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
}
textarea {
	width: 					325px;
	height: 				100px;
	border: 				none;
	background: 			#682300;

	color: 					#FFF;

	float: 					right;
	
	overflow: 				hidden;

	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
}
.submit {
	width: 					100px;
	height: 				35px;
	background: 			#682300;
	margin-left: 			10px;
	
	float: 					right;

	color: 					#FFF;
	font-family: 			Lumpy, Segoe UI, Lucida Grande, Verdana;
	font-size:				18px;
}
.submit:hover {
	background:				#FFF;
	
	color:					#682300;
}
.over {
	width: 					auto;
	height: 				auto;
	border: 				1px solid #FFF;
	
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;

	float: 					right;
}
.form {
	width: 					25px;
	height: 				20px;
	border: 				1px solid #FFF;
}
.view-large-map {
	padding-top:            5px;
}
/*------------- Footer Section ---------- */
#footer-wrapper {
	height:					224px;
	width:					100%;
	padding:	            0px 0px 10px 0px;
	margin:                 0;
	background:				url(../../images/interface/footer-bg.gif) repeat-x bottom;
	color:					#FFF;
	clear:					both;
}
#footer {
	height:					224px;
	width:					1000px;
	margin:         		0px auto;
	padding:        		0px;
	position:       		relative;
	z-index:				20;
}

#callouts {
	width: 					1000px;
	height: 				165px;
	margin: 				auto;
	padding: 	            20px 10px;
}
	
.fcol1 {
	height:					167px;
	width:					243px;
	
	float:					left;
}
.fcol2 {
	height:					167px;
	width:					249px;
	
	float:					left;
}
.fcol3 {
	height:					167px;
	width:					251px;
	
	float:					left;
}
.fcol4 {
	height:					167px;
	width:					244px;
	
	float:					left;
}
#copyright {
	width:					500px;
	
	float:					left;
}
#webdesign {
	width:					500px;
	
	float:					left;
	
	text-align:				right;
}
#copyright a, #webdesign a {
	color:					#FFF;
	font-size:        		10px;
	text-decoration:		none;
}
/*------------- Hacks/Fixes ------------- */
/* Fire Fox Float Fix                     */
.clearfix:after {
	height:					0;
	visibility: 			hidden;
	
	display: 				block;
	
	clear: 					both;
	content: 				".";
	line-height: 			0;
}
.clearfix {
	display: 				block;
}
html[xmlns] .clearfix {
	display:				block;
}
* html .clearfix {
	height: 				1%;
}
/* Light Box 
--------------------------------------------------------------------------------------- */
#jquery-overlay {
	width: 					100%;
	height: 				500px;
	
	position:			 	absolute;
	top: 					0;
	left: 					0;
	z-index: 				99;

}
#jquery-lightbox {
	position: 				absolute;
	top: 					0;
	left: 					0;
	width: 					100%;
	z-index: 				100;
	text-align: 			center;
	line-height: 			0;
}
#jquery-lightbox a img { 
	border: 				none; 
}
#lightbox-container-image-box {
	width: 					250px;
	height: 				250px;
	background-color: 		#607070;
	margin: 				0 auto;
	
	position: 				relative;
}
#lightbox-container-image { 
	padding: 	            10px;
}
#lightbox-loading {
	height: 				25%;
	width: 					100%;
	
	position: 				absolute;
	top: 					40%;
	left: 					0%;

	text-align: 			center;
	line-height: 			0;
}
#lightbox-nav {
	height: 				100%;
	width: 					100%;
	
	position: 				absolute;
	top: 					0;
	left: 					0;

	z-index: 				10;
}
#lightbox-container-image-box > #lightbox-nav { 
	left: 0; 
}
#lightbox-nav a { 
	outline: none;
}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 					49%;
	height: 				100%;
	
	display: 				block;
}
#lightbox-nav-btnPrev { 
	left: 					0; 
	float: 					left;
}

#lightbox-nav-btnNext { 
	right: 					0; 
	float: 					right;
}
#lightbox-container-image-data-box {
	width: 					100%;
	background-color: 		#607070;
	margin: 				0 auto;
	padding: 	            0 10px 0;

	font: 					10px Verdana, Helvetica, sans-serif;
	line-height: 			1.4em;
	overflow:				auto;
}
#lightbox-container-image-data {
	padding:                0 10px;
	
	color: 					#FFF; 
}

#lightbox-container-image-data #lightbox-image-details { 
	width:					70%;
	
	float: 					left;
	
	text-align: 			left; 
}	
#lightbox-image-details-caption { 
	font-weight: 			bold; 
}
#lightbox-image-details-currentNumber {
	padding-bottom: 		1.0em;	

	display: 				block; 
	clear: 					left; 
}			
#lightbox-secNav-btnClose {
	width: 					66px; 
	padding-bottom: 		0.7em;	

	float: 					right;
}		
/* SIMPLE MODAL BOX
--------------------------------------------------------------------------------------- */
#simplemodal-overlay {
	background:				#000; 
	
	cursor:					wait;
}

/* Container */
#simplemodal-container { 
	width:					600px; 
	min-height:	            250px; 
	background:				url(../../images/interface/background.jpg) center repeat-y;
	border:					2px solid #FFF;
	
	padding: 	            20px;
}
#simplemodal-container a.modalCloseImg {
	width:					33px; 
	height:					34px; 
	background:				url(../../images/x.png) no-repeat; 
	
	position:				absolute; 
	top:					-15px; 
	right:					-18px; 
	display:				inline; 
	z-index:				3200; 

	cursor:					pointer;
}
#simplemodal-container #basicModalContent {
	padding:	           	0px;
}
/*PAPER WORK*/				   
#modal {
	padding:               	20px;

	color:					#FFF;
	font-weight:			bold;
}
#modal h2 {
	text-align:				center;
	font-size:				18px;
}
#modal p {
	text-align:				center;
	font-size:				14px;
}
#videobox {
	width: 					500px;
	height: 				500px;
	
	text-align: 			center;
	margin: 				auto;
}

/*------------- Form Security ------------- */
.sec {
	display: none;
}