@charset "utf-8";

/* reset */ 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
	position: relative; /* Forgetting position relative on block level elements causes problems, so I add it in the beginning */
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
/* address,caption,cite,code,dfn,em,strong,th,var {  see notes below */
address {
/*
- I would change address tags to a normal font style,
- caption, cite, code, dfn and var are almost never used, so why bother
- em should typically be italic
- strong should typically be bold
- th tends to be bold in 
*/
	font-style: normal;
/*	font-weight: normal; not needed */
}
ol,ul {
	list-style:disc; 
}
caption,th { /* caption is rarely used, so I wouldn't bother adding it */
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;}

.class {
  width:200px; /* All browsers */
  *width:250px; /* IE */
  _width:300px; /* IE6 */
  .width:200px; /* IE7 */
}

/* reset */ 

/* From Steve */

a img {
	border: none; /* images that are links get ugly blue borders */
}

h1, h2, h3, h4, h5, p, ul, ol, blockquote {
	margin: .7em auto; /* Typically you want spacing between paragraphs, headings and lists in the body text, this would be changed to match the site I'm working on */
}

li {
	margin-left: 30px; /* Normally on websites bullet lists are indented, using margin-left on the li causes fewer problems than padding-left on the ul */
}

body, textarea {
	font-size: 14px; /* For some reason textareas tend to have too large of a font and they use a mon-space font, this sets it to the same as the body text */
	font-family: Arial, Helvetica, sans-serif;
}

/* End from Steve */

html {
	margin: 0;
	padding: 0;
	overflow:-moz-scrollbars-vertical; /* always show firefox scrollbar */
	}
	
#wrapper {
	width: 975px; /* sets width of main container */
	margin: 0 auto; /* centers box */
	margin-bottom:25px;
	}

/* body, h1, h2, h3, h4, h5, h6, ul, ol, dl { All the other tags inherit this from the body tag, plus I move this above with the textarea */
body {
	font-size: 15px;
	font-family: Arial, Helvetica, sans-serif;
	background: #e7e7e7 url('../images/yf-top-back.gif') repeat-x top center;
	}
		
h1 { font-size: 1.75em; font-weight: bold; } 
h2 { font-size: 1.5em;	}
h3 { font-size: 1.25em;	}
h4 { font-size: 1.125em; font-weight: bold; margin-top: 0px;} /* catalog and promo area */
h5 { font-size: 1em; } 
h6 { font-size: .875em;	}
p  { font-size: 1em; }
img { border: 0; } /* Removes default border around linked images */ 

h1, h2, h3, h4, h5, h6, strong {color: #00907e;	}

a:link, a:visited, a:active { text-decoration: underline; /*color:#00a4e2;*/ color:#0390c5;}
a:hover { text-decoration: none; color:#00907e;;}

h1, #global-nav, #promo-offer, #furrier-catalog {
	font-family: Garamond, Hoefler Text, Times New Roman, Times, serif;
}


/* LAYOUT */

#logo {
	width: 493px; height: 114px;
	display: block;
	background: url('../images/yf-logo.gif') no-repeat top center;
	margin: 10px auto;
	}
#elmhurst, #deerpark {
	position: absolute;
	top: 30px;
	font-size: .9em;
	}
#elmhurst {
	left: 0;
	}
#deerpark {
	right: 0px;
	text-align: right;
	}

#global-nav {
	position: absolute; top: 126px; left: 0;
	width: 975px; /* sets width of main container */
	height: 30px;
	/*background: url('/images/global-nav-back.jpg') no-repeat top center;
	background-color:#463f35;*/
	font-size: 1.1em;
	line-height: 30px;
	*top: 135px; /*fixes IE mess*/
	}
#global-nav ul {
	list-style: none;
	/*margin-top: 5px;*/
	margin-top:0;
	margin-left:80px;
	height: 30px;
	line-height: 30px;
		}

#global-nav li {
	float: left; /* makes the nav menu inline*/
	margin: 0 1em 0 0;
	}
/* floats can be dangerous if you don't set the width, usually doesn't cause problems if used like this. I tend to simply use <a> tags for nav */

#global-nav li a {
	border-left-width: 1px;
	border-left-color:#000000;
	border-left-style: solid;
	padding-left: 1em;
	padding-right: 1em;
	text-decoration: none;
	}
	
#global-nav li a.nav-no-border {border: none;}

#global-nav a:link, #global-nav a:visited, #global-nav a:active {	color: #e7e7e7;}
#global-nav a:hover {	color:#CCCCCC; text-decoration: underline; }

#footer {
/* Handled above
	position: relative;	top: 0; right: 0; bottom: 0; left: 0; /* make is go 0px from top and 0px from bottom */
	float: left; /* This shouldn't need to be floated s.p. */
	clear:both;
	width: 100%; height: 180px;
	background: url('../images/yf-foot.gif') no-repeat top center;
	background-color:#dedede;
	margin: 0 auto; /* centers box */
	font-size: .8em;
	}
#footer-inner {
	position: relative;
	width: 975px;
	margin: 0 auto; /* centers box */
	margin-top: 10px;
	}
	
#footer-left {position: relative; float: left;  }
#footer-right {position: relative; float: right; text-align: right; }

#bottom-tag {
	position: relative;
	margin-top: -3px; margin-bottom: 20px;
	color: #e7e7e7;
	font-size: 1.5em;
	letter-spacing: .2em;
	text-align: center;
	}
	
#store-hours {
	position: relative;
	font-size: 1.25em;
	text-align: center;
	margin-bottom: 15px; margin-top: 35px;
	}

#main-text-area {
	position: relative; float: left; margin-top: 40px; margin-bottom: 20px; left:0;
	width:1000px;
	background: #ffffff url('../images/yf-main-text.gif') no-repeat top center;
	min-height: 523px;
	margin-left: -10px;
	}
#left-column {
	position: relative;
	float: left;
	margin: 0 10px;
	width: 340px;
	}
#left-column-promo {
	position: relative;
	float: left;
	margin: 20px 26px;
	}
	
#right-column {
	position: relative;
	float: right;
	margin-bottom:20px;
	margin-right: 25px;
	width: 600px;
/*	border-left-width: 1px;
	border-left-color:#000000;
	border-left-style: solid; 
	border: 1px solid #000; */
	}
#left-column-catalog {
	position: relative;
	float: left;
	margin: 0 20px;
	width: 525px;
	}
#right-column-catalog {
	position: relative;
	float: right;
	margin-bottom:20px;
	margin-right: 25px;
	width: 410px;
/*	border-left-width: 1px;
	border-left-color:#000000;
	border-left-style: solid; 
	border: 1px solid #000; */
	}
.catalog-image {
	position: relative;
	float: left;
	/*margin-bottom: 10px;*/
	border: 1px solid #CCC;
	padding: 2px;	
	margin: 10px 5px 10px 0;
	}

#promo-offer, #furrier-catalog {
	position: relative; float: left; margin: 10px 15px 0px 15px;
	width:252px; height: 175px;
	text-align: center;
}

#promo-offer { background: #ffffff url('../images/promo-offer.jpg') no-repeat top center; }
#furrier-catalog { background: #ffffff url('../images/furrier-catalog.jpg') no-repeat top center; }

/*Easy Slider*/

#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slider, #slider li{ 
	width:340px;
	height:600px;
	overflow:hidden; 
	}

/*Easy Slider - Catalog*/

#slider-catalog ul, #slider-catalog li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slider-catalog, #slider-catalog li{ 
	width:340px;
	overflow:hidden; 
	}
#slider-catalog {margin-bottom: 10px;}

span#prevBtn, span#nextBtn{ 
	font-size: .8em; 
	font-style: italic;
	background-color: #000000;
	padding: 5px;
	}
span#prevBtn a:link, span#nextBtn a:link { 
	color: #FFFFFF;
	}	

#wrapper-catalog{ 
	width:340px;
	height:600px;
	margin: 0 auto;
	}