/* -------------------------------------------------------
               CSS for Backcountry Site
---------------------------------------------------------*/

body{
  font-family: Verdana, Helvetica, Arial, sans-serif;
  line-height: 125%;
  padding: 1px;
  margin: 0;
}



li{
  font-size:small;
  list-style-type: none;
}




h1{
  font-family:Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;  
  color: black;
  font-size: 200%;
  font-weight: bold;
  padding: 0px;
  text-align: center;
  line-height: 100%;
  border-bottom:3px solid black;
  font-variant:small-caps;
  font-style:italic;
}



h1:first-letter {
  font-size: 150%
}




h2{
  font-family:Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding: 15px;
  margin:0;
  text-align: center;
  line-height: 100%;
}



h3{
  font-family:Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 110%;
  font-weight: bold;
  padding:5px;
  margin:0;
  text-align: center;
  line-height: 100%;
}


h4 {
font-family:Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 125%;
  font-weight: bold;
  padding: 15px;
  margin:0;
  text-align: center;
  line-height: 100%;
  display:block;
  color:white /*rgb(255,255,204)*/;
  background-color:rgb(63,32,13);
}


h5{
  font-family:Helvetica, Verdana, Lucida, Geneva, Arial, sans-serif;
  font-size: 110%;
  font-weight: bold;
  padding-top:5px;
  margin:0;
  text-align: center;
  line-height: 90%;
  color:rgb(46,82,24);
}

p {
  font-size:100%;
  font-weight:bold;
  color: black;
}


.smalltext {
  font-size:80%;
  line-height:100%;
}


a {
  font-weight: bold;
  /*color: rgb(66,49,16);*/
}


/* ------------------------------------------------------------------
This section deals with the coloring of the Navigation section
---------------------------------------------------------------------*/

#navigation {
  width: 12em;
  border-right: 1px solid #000;
  padding: 0.25em 0 1em 0;
  margin: 10em 0 1em 0;
  font-family: Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
  background-color: black /*rgb(63,32,13)*/;
  color: #336600;
}

#navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: none;
}

#navigation li {
  border-bottom: 1px solid black;
  margin: 0;
}

#navigation li a {
  display: block;
  padding: 5px 5px 5px 0.5em;
  border-left: 10px solid rgb(63,32,13);
  border-right: 1px solid rgb(63,32,13);
  background-image: url(../images/navigation/navigationbackground4.jpg);
  background-color: rgb(254,220,130);
  color: white;
  text-decoration: none;
  width: 100%;
}

html>body #navigation li a { width: auto; }

#navigation li a:link {
}

#navigation li a:visited {
}

#navigation li a:hover {
  border-left: 10px solid rgb(63,32,13);
  border-right: 1px solid rgb(63,32,13);
  background-image: url(../images/navigation/navigationbackground2.jpg);
  background-color: rgb(160,135,73);
  color: black;
}

#navigation li a:active {
  color: white; 
}

#navigation li.current a {
  background: rgb(63,32,13);
  border-left:10px solid black;
  color:white;
}


/*--------------------------------------------------------------------------------
   End of Navigation Coloring
----------------------------------------------------------------------------------*/


/* ----------------------------------------------------------------------------------
This section deals with the postion of items on the screen.
It uses absolute positioning - fixed x and y coordinates
measured from the top-left corner of the brower's content display.
------------------------------------------------------------------------------------*/
#navigation, #bodycontent, #header, #tagline, #contact, /*#sidebar,*/ #flyer-sidebar, #dream-sidebar, 
	#specials-sidebar, #calendar-sidebar, #monthlyproduct-sidebar, #sidebar_photo, #footer, 
	#secondnavigation,img {
  position: absolute;
}


#navigation {
  top:360px;
  margin:0.25px;
}


#secondnavigation {
  top:172px;
  left:225px;
}


#bodycontent {
  top: 185px;
  left: 185px;
  margin-left:2px;
}
/*the margin-left value is to try and help with the body content overlapping with the navigation
in internet explorer 6*/


#header {
  width:925px;
  height:285px;
}


#tagline {
  top: 83px;
  left:10px;
}


#contact {
  top:10px;
  right:25px;
}


#flyer-sidebar {
  top:365px;
  left:790px;  
}


#dream-sidebar {
  top:655px;
  left:790px;  
}


#monthlyproduct-sidebar {
  top:510px;
  left:790px;
}


#specials-sidebar {
  top:800px;
  left:790px;
}


#calendar-sidebar {
  top:950px;
  left:790px;
}

#footer {
  left:-150px;
  bottom:165px;
}


/* ---------------------------------------------------------------------
  This is the location of the backcountry logo in the page header and in
  and in the transbox as well as the product photos on the what's new 
  and/or the specials pages.
------------------------------------------------------------------------*/
.pageheader {
  position:absolute;
  left: 0px;
  top: 0px;
}

.product {
  float:left;
  margin:1px;
  border:1px solid black;
  position:relative;
}


.centerimg {
  margin:1px;
  border:1px solid black;
  position:relative;
  left:150px;
}


.centerimg2 {
  margin:1px;
  border:none;
  position:relative;
  left:195px;
}


.centerimg3 {
  margin:1px;
  border:none;
  position:relative;
  left:160px;
}

.centerimg4 {
  margin:1px;
  border:none;
  position:relative;
  left:0px;
}

.centerimg5 {
  margin:1px;
  border:none;
  position:relative;
  left:130px;
}

.centerimg6 {
  margin:1px;
  border:none;
  position:relative;
  left:90px;
}

.centerimg7 {
  margin:1px;
  border:none;
  position:relative;
  left:50px;
}


.centerimg8 {
  margin:1px;
  border:none;
  position:relative;
  left:115px;
}


.centerimg9 {
  margin:1px;
  border:none;
  position:relative;
  left:180px;
}


.centerimg10 {
  margin:1px;
  border:none;
  position:relative;
  left:20px;
}

.zeissimg {
  margin:1px;
  border:none;
  position:relative;
  left:185px;
}

.zeissimg1 {
  margin:1px;
  border:none;
  position:relative;
  left:210px;
}

.winnerimg {
  margin:.5px;
  border:none;
  position:relative;
  left:85px;
}

.logo {
  background-image: url(../images/backcountrylogo006.gif);
  background-repeat:no-repeat;
  background-position:80px 10px;
  width:500px;
  height:100px;
}


.sidebar-photo {
  border:solid 2px black;
  position:relative;
  top:725px;
  left:13px;
}


.footerimg1 {
  border:none;
}

/* ----------------------------------------------------------------------
    This section deals with the location and formatting for a list with 
    a disc style type.
-------------------------------------------------------------------------*/


ul.list1 li{
  font-size:70%;
  list-style-type: disc;
  list-style-position:inside;
}


/* ----------------------------------------------------------------------
    This section deals with the location and formatting for the vendor 
    logos on each page.
-------------------------------------------------------------------------*/
ul.vendors {
  position:relative;
  left: -20px;
  list-syle:none;
  
}

ul.vendors li {
  line-height:25%;
}


.vendorimg {
  border:none;
  margin:-10px;
  padding:10px;
}


ul.vendors p {
  list-style:none;
  position:relative;
  clear:left;
  left:65px;
  top:-10px;
}

/* ---------------------------------------------------------------------
     End of Item Positioning 
   ---------------------------------------------------------------------*/


/* ----------------------------------------------------------------------
    This section deals with the Typography (coloring, size etc) 
    of ID Selectors
-------------------------------------------------------------------------*/

#header {
  border-bottom:10px solid black;
  margin:-1px;
  padding:0px;
  background-color: rgb(69,49,16); 
}


#tagline {
  font-family:Times New Roman, Verdana, Helvetica, Arial, sans-serif;
  font-size:170%;
  line-height:150%;
  font-weight:bold;
  color:rgb(26,0,0);
}


#contact {
  font-family:Verdana, Helvetica, Arial, sans-serif;
  color:rgb(26,0,0);
  font-weight:bold;
  font-size:80%;
  line-height:110%;
  padding:2px; 
}

#contact a:link, #contact a:visited {
  color:black;
}

#contact a:hover {
  background-color: rgb(46,82,24);
  color: white;
}


#flyer-sidebar {
  display:block;
  float:left;
  width: 150px;
  height: 125px;
  margin:0;
  padding:0;  
  background:url(../images/sidebar/backcountry_flyer.gif) no-repeat;
}

.flyer-sidebartheme {
  display:block;  
  text-decoration:none;
  font-family:Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding:150px 150px 0px 150px; /* the padding is so large so that the hover will work over the entire image */
  margin:0;
}


#flyer-sidebar a:link{
}

#flyer-sidebar a:visited {
}

#flyer-sidebar a:hover {
  display:block;  
  float: left;
  width: 150px;
  height: 200px;
  margin:0;
  padding:0px;  
  background: url(../images/sidebar/backcountry_flyer_hover.gif) no-repeat;
}





#dream-sidebar {
  display:block;  
  float:left;
  width: 150px;
  height: 125px;
  margin:0;
  padding:0;  
  background:url(../images/sidebar/zeiss_promo.gif) no-repeat;
}

.dream-sidebartheme {
  display:block;  
  text-decoration:none;
  font-family:Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding: 150px 150px 0px 150px; /* the padding is so large so that the hover will work over the entire image */
  margin:0;
}


#dream-sidebar a:link{
}

#dream-sidebar a:visited {
}

#dream-sidebar a:hover {
  display:block;  
  float: left;
  width: 150px;
  height: 200px;
  margin:0;
  padding:0;  
  background: url(../images/sidebar/zeiss_promo_hover.gif) no-repeat;
}



#monthlyproduct-sidebar {
  display:block;
  float:left;
  width: 150px;
  height: 125px;
  margin:0;
  padding:0;  
  background:url(../images/sidebar/monthlyproduct.gif) no-repeat;
}

.monthlyproduct-sidebartheme {
  display:block;  
  text-decoration:none;
  font-family:Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding:150px 150px 0px 150px; /* the padding is so large so that the hover will work over the entire image */
  margin:0;
}


#monthlyproduct-sidebar a:link{
}

#monthlyproduct-sidebar a:visited {
}

#monthlyproduct-sidebar a:hover {
  display:block;  
  float: left;
  width: 150px;
  height: 200px;
  margin:0;
  padding:0px;  
  background: url(../images/sidebar/monthlyproduct_hover.gif) no-repeat;
}



#specials-sidebar {
  display:block;
  float:left;
  width: 150px;
  height: 125px;
  margin:0;
  padding:0;  
  background:url(../images/sidebar/specials_promos.gif) no-repeat;
}

.specials-sidebartheme {
  display:block;  
  text-decoration:none;
  font-family:Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding:150px 150px 0px 150px;/* the padding is so large so that the hover will work over the entire image */
  margin:0;
}


#specials-sidebar a:link{
}

#specials-sidebar a:visited {
}

#specials-sidebar a:hover {
  display:block;  
  float: left;
  width: 150px;
  height: 200px;
  margin:0;
  padding:0;  
  background: url(../images/sidebar/specials_promos_hover.gif) no-repeat;
}


#calendar-sidebar {
  display:block;
  float:left;
  width: 150px;
  height: 125px;
  margin:0;
  padding:0;  
  background:url(../images/sidebar/calendar.gif) no-repeat;
}

.calendar-sidebartheme {
  display:block;  
  text-decoration:none;
  font-family:Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-size: 100%;
  font-weight: bold;
  padding:150px 150px 0px 150px; /* the padding is so large so that the hover will work over the entire image */
  margin:0;
}


#calendar-sidebar a:link{
}

#calendar-sidebar a:visited {
}

#calendar-sidebar a:hover {
  display:block;  
  float: left;
  width: 150px;
  height: 200px;
  margin:0;
  padding:0px;  
  background: url(../images/sidebar/calendar_hover.gif) no-repeat;
}


/*-------------------------------------------------------------------------
   End of Typography on ID Selectors
---------------------------------------------------------------------------*/



/* -----------------------------------------------------------------------
  This is information on the background image in the body
-------------------------------------------------------------------------*/
#main, #fishing, #fly, #spin, #ice, #fishgear, #specials, #firearms, #archery,
#optics, #camping, #clothing, #huntingstuff, #dream, #links, #gallery, #huntphoto, #fishphoto, 
#calendar, #used, #gungear, #ammo, #bows, #bowgear, #cross, #clothes, #footwear, 
#weblinks, #coolstuff, #flyer, #promos, #monthlyproduct {
  background-color: rgb(17,16,12);
  background-image: url(../images/header/background01.jpg);
  background-repeat: repeat-y;
  background-attachment:float;
  border:30px black double;
  width:922px;
  margin:5px;
}


#main {
  height: 1665px;
}


#fishing {
  height: 1040px;
}


#fly {
  height: 1560px;
}


#spin {
  height: 1160px;
}


#ice {
  height: 2190px;
}



#fishgear {
  height: 2240px;
}



#specials {
  height: 2050px;
}



#specials p {
  font-size:120%;
}

#specials .transbox p {
  text-indent:0;
  text-align:center;
}


#promos {
  height: 1920px;
}


#monthlyproduct {
  height: 1490px;
}



#monthlyproduct .transbox p {
  text-indent:0;
  text-align:center;
}



#flyer {
  height: 1060px;
}



#dream {
  height: 1660px;
}
 


#firearms {
  height: 3720px;
}


#used {
  height: 2180px;
}


#gungear {
  height: 1900px;
}


#ammo {
  height: 2280px;
}



#archery {
  height: 1090px;
}


#archery .transbox .normal {
  font-size:100%;
  font-weight:bold;
  color: black;
  text-indent:25px;
  text-align:left;
}


#archery .transbox p {
  text-indent:0;
  text-align:center;
}

#archery .transbox li{
  font-size:75%;
  list-style-type: disc;
  list-style-position:inside;
}


#bows {
  height: 1100px;
}


#cross {
  height: 2690px;
}


#bowgear {
  height: 1310px;
}


#optics {
  height: 3830px;
}


#camping {
  height: 4725px;
}


#clothing {
  height: 1055px;
}


#clothes {
  height: 3300px;
}


#footwear {
  height: 1750px;
}


#huntingstuff {
  height: 2570px;
}


#gallery {
  height: 2530px;
}


#huntphoto {
  height: 1040px;
}


#fishphoto {
  height: 1040px;
}


#links {
  height: 1040px;
}


#weblinks {
  height: 2050px;
}


.weblinks {
  font-size:15px;
  line-height:40%;
  text-align:center;
}

#weblinks h2{
  font-family:Helvetica, Verdana, Arial, sans-serif;
  font-size: 200%;
  font-weight: bold;
  padding: 0px;
  text-align: center;
  line-height: 70%;
  font-variant:small-caps;
  font-style:italic;
  background-image: url(../images/navigation/navigationbackground1.jpg);
  background-color: rgb(160,135,73);
  color: rgb(181,66,8);
  width: 100%;
}

#coolstuff {
  height: 1040px;
}


#calendar {
  height: 1550px;
}




/*-------------------------------------------------------------------------------
  This is information on the text box in the body of the webpages.  It determines
  color, text and opacity.
--------------------------------------------------------------------------------*/

div.transbox {
  width: 500px;
  margin: 175px 50px;
  background-color: rgb(255,249,232);
  border-style:double;
  border-color:black;
  border-width:20px;
  filter:alpha(opacity=75);
  opacity:0.75;
}


div.transbox p {
  margin: 15px 40px;
  font-family: Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: black;
  text-align:justify;
  letter-spacing:-0.05em;
  word-spacing:0.05em;
}


div.transbox h2 {
  color:black;
  font-size:150%;
}


div.transbox li {
  font-family: Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
  font-weight: bold;  
  color:black;
  font-size:90%;
}

div.hours {
  color:black;
  text-align:center;
  font-size:125%;
  line-height:105%;
  font-weight:bold;
  border: 1px solid black;
  width:325px;  
  padding:0;
  margin-left:100px;
}



/* ----------------------------------------------------------------------------------
  End of Background Image Information
 ---------------------------------------------------------------------------------*/


.block {
  display:block;
  text-align:center;
  text-indent:0;
  border-bottom:2px solid black;
  padding-bottom:5px;
}

  
.center {
  display:block;
  text-align:center;
  text-indent:0;
}

.leftimg {
  float:left;
  margin:1px;
  border:none;
  position:relative;
}

.leftimg2 {
  float:left;
  margin:1px;
  position:relative;
}

.leftimg3 {
  float:left;
  margin:1px;
  position:relative;
  left:50px;
}

.leftimg4 {
  float:left;
  margin:1px;
  position:relative;
  left:15px;
}

.archeryimg {
  margin:1px;
  border:none;
  position:relative;
  left:35px;
}



/*-----------------------------------------------------------------------------------
  This section deals with the typography of the secondary navigation
  ---------------------------------------------------------------------------------*/

#secondnavigation {
margin: 10em 0 0 0;
padding: 0 0 0 12px;
}

#secondnavigation ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#secondnavigation li {
display: block;
margin: 0;
padding: 0;
float: left;
width: auto;
}

#secondnavigation a {
color: white;
display: block;
width: auto;
text-decoration: none;
background: rgb(181,66,8);
margin: 0;
padding: 2px 10px;
border-left: 1px solid rgb(66,49,16);
border-top: 1px solid rgb(66,49,16);
border-right: 1px solid rgb(255,255,204);
}

#secondnavigation a:hover, #secondnavigation a:active { 
  background: rgb(255,255,204);
  color:rgb(66,49,16)
}


#secondnavigation a.active:link, #secondnavigation a.active:visited {
position: relative;
z-index: 102;
background: #BBBBBB;
font-weight: bold;
}

#secondnavigation li.current a {
  background: white;
  color:rgb(181,66,8);
}






/*--------------------------------------------------------------------------------------
  This section deals with the styling of the events table on the Calendar of Events Page
---------------------------------------------------------------------------------------*/

table.events {
  background-color:rgb(186,158,89);
  table-layout:fixed;
}

table.events th {
  background-color: rgb(46,82,24);
  border:1px solid rgb(25,45,13);
  border-top:3px solid rgb(25,45,13);
  border-left:3px solid rgb(25,45,13);
  color:white;
  font-size:large;
  text-align:center;
  table-layout:fixed;
}

table.events td {
  font-size: 80%;
  font-weight:bold;
  color:black;
  text-align:center;
  padding-left:8px;
  padding-right:8px;
  padding-top:4px;
  padding-bottom:4px;
  border:1px solid rgb(134,111,57);
  border-top:3px solid rgb(134,111,57);
  border-left:3px solid rgb(134,111,57);
  background-color:rgb(254,220,130);
}

table.events caption {
  font-family:Times New Roman, Verdana, Helvetica, Arial, sans-serif;
  font-weight:bold;
  font-size:165%;
  text-align:center;
}

.tabletitle {
  color:rgb(181,66,8);
  font-weight:bold;
  font-size:120%;
  font-family:Helvetica, Verdana, Arial, sans-serif;
  font-variant:small-caps;
  font-style:italic;
}




/*--------------------------------------------------------------------------------------
  This section deals with the styling of the used firearms table on the Used Firearms Page
---------------------------------------------------------------------------------------*/

table.usedguns {
  background-color:rgb(186,158,89);
  table-layout:fixed;
}

table.usedguns th {
  background-color: rgb(46,82,24);
  border:1px solid rgb(25,45,13);
  border-top:3px solid rgb(25,45,13);
  border-left:3px solid rgb(25,45,13);
  color:white;
  font-size:large;
  text-align:center;
  table-layout:fixed;
}

table.usedguns td {
  font-size: 80%;
  font-weight:bold;
  color:black;
  text-align:center;
  padding-left:8px;
  padding-right:8px;
  padding-top:4px;
  padding-bottom:4px;
  border:1px solid rgb(134,111,57);
  border-top:3px solid rgb(134,111,57);
  border-left:3px solid rgb(134,111,57);
  background-color:rgb(254,220,130);
}

table.usedguns caption {
  font-family:Times New Roman, Verdana, Helvetica, Arial, sans-serif;
  font-weight:bold;
  font-size:165%;
  text-align:center;
}

.tabletitle {
  color:rgb(181,66,8);
  font-weight:bold;
  font-size:120%;
  font-family:Helvetica, Verdana, Arial, sans-serif;
  font-variant:small-caps;
  font-style:italic;
}


/*----------------------------------------------------------------------------------------------------
 This deals with images in the gallery page. 
------------------------------------------------------------------------------------------------------*/

/*#gallerylinks a img {
  height: 0;
  width: 0;
  border-width: 0;
} 

#gallerylinks a {
  display:block;
  padding-top: 65px;
} 

#gallerylinks a:hover img {
  position: relative;
  top: -260px;
  left: -90px;
  height: 280px;
  width: 430px;
  border-width: 4px;
  border-color: black;
} */



ul.thumbnail {
  position:relative;
  list-syle:none;
  left:-65px;
}

ul.thumbnail li {
  float:left;
  width: 100px;
  height: 75px;
  margin: 0 15px 15px 0;
  padding: 0px;
  text-align: center;
  font-size:60%;
  background-repeat: no-repeat;
  border:none;
}


ul.thumbnail2 {
  position:relative;
  list-syle:none;
  left:-48px;
}

ul.thumbnail2 li {
  float:left;
  width: 75px;
  height: 100px;
  margin: 0 15px 15px 0;
  padding: 0px;
  text-align: center;
  font-size:60%;
  background-repeat: no-repeat;
  border:none;
}




ul.fishthumbnail {
  position:relative;
  list-syle:none;
  left:-65px;
}

ul.fishthumbnail li {
  float:left;
  width: 100px;
  height: 75px;
  margin: 0 15px 15px 0;
  padding: 0px;
  text-align: center;
  font-size:60%;
  background-repeat: no-repeat;
  border:none;
}




/*
.vendorimg {
  border:none;
  margin:-10px;
  padding:10px;
}


ul.vendors p {
  list-style:none;
  position:relative;
  clear:left;
  left:65px;
  top:-10px;
}



.thumbnail {
  /*float: left;*/
  width: 100px;
  height: 75px;
  margin: 0 15px 15px 0;
  padding: 0px;
  text-align: center;
  font-size:60%;
  background-repeat: no-repeat;
  border:none;
} 
*/