 @import "csrGlobalStyle_ie.css";
 
/* -----  Page Layout Styles for new site----- */
body {
    margin: 5px 0 0 0;
    padding: 0;
    font-family: verdana,sans-serif;
    background: #ffffff;
    font-size: .7em;
  /*  opacity:.999;    added to prevent flicker from drop down in Firefox on a Mac --> moved to #hunt3 style */
    }

#container {
    margin: 0 auto 200px auto;
    text-align: left;
    width: 908px;
    border: 1px solid #cccccc;
    border-width: 1px 0 0 0;}

#wrapper {
    margin: 0;
    text-align: left;
    width: 908px;
    position:relative;
    top:145px;}

/* Is the below code necessary? */
#siteWideMsg {display:none;}
/* --- */

.showSiteWideMsg #wrapper {
    top:175px;}  

.showSiteWideMsg #siteWideMsg {display:block;}

/* Only use hideSiteWideMsg class for manual override (?) */
.hideSiteWideMsg #wrapper {
    top:145px;}  
/* Only for manual override (?) */
.hideSiteWideMsg #siteWideMsg {display:none;}

.noHeader #wrapper {
    top:0px;}

#corewrapper { /*delete once all the corewrapper is replaced with coreWrapper */
    float: left;
    width: 908px;
    border: 1px solid #cccccc;
    border-width: 0 1px 1px 1px;
    background: #fff repeat-y url(https://www.rei.com/pix/common/bg_01.gif);
    margin: 0 0 0 -1px;}
    
    
#coreWrapper {
    float: left;
    width: 908px;
    border: 1px solid #cccccc;
    border-width: 0 1px 1px 1px;
    background: #fff repeat-y url(https://www.rei.com/pix/common/bg_01.gif);
    margin: 0 0 0 -1px;}
    
.noSidebar #corewrapper { /*delete once all the corewrapper is replaced with coreWrapper */
    background-image: none;}
    
.noSidebar #coreWrapper {
    background-image: none;}    

#pageContent { /*if you want no padding on the left, between the sidebar, put width:723px */
    float: right;
    width: 713px;
    background:#fff;
    padding-bottom:75px;}

.noSidebar #pageContent {
    float: left;
    width: 908px;
    padding: 0 0 75px 0;}

#headerWrapper {
    margin: 0;
    padding: 0px 0 0px 0px;
    background: #ffffff;
    border: 1px solid #cccccc;
    border-width: 1px 1px 0 1px;
    clear: both;
    font-family: verdana, sans-serif;
    height:145px;
    width:908px;
    position:absolute;
    top:-146px;
    left:-1px;}


.noHeader #headerWrapper {
    display:none;}

.showSiteWideMsg #headerWrapper {
    height:175px;
    top:-176px;
    }

/* Only for manual override */
.hideSiteWideMsg #headerWrapper {  
    height:145px;
    top:-146px;
    }

#sidebarWrapper {
    float: left;
    width: 185px;
    padding:15px 0 75px 0;  /* there is 4px of top padding on the sidbar ul li style in reiNavStyle */
    }

.noSidebar #sidebarWrapper {
   display:none;}

#footerWrapper {
    margin: 0 0 0 -1px;
    padding: 15px 0 15px 19px;
    background: #fff;
    border: 1px solid #cccccc;
    border-width: 0px 1px 1px 1px;
    clear: both;
    font-family: verdana, sans-serif;
    height:186px;
    width:889px;}


.noFooter #footerWrapper {
   display:none;}
    
.cleardiv {
    clear:both;}
        
    
/* -----  END Page Layout Styles ----- */

/* -----  Generic Styles  ----- */
a:link, a:visited {         
    text-decoration: underline;
}

a:hover {
    text-decoration: underline;
}

a:focus {text-decoration: underline; outline: 0; /* prevent dotted border in Firefox */}

a:active {
    text-decoration: underline;
}

/* typical body text for all sites */

ul {
    margin: 0 0 10px 16px;
	padding: 0 0 0 0;
    }
	
li {
    font-weight: normal;
    color: #333333;
}

#pageContent li { /* pageContent area only leading */
    line-height:1.6em;}
    
ul li a:link, ul li a:visited {
    text-decoration:none;
    }
    
ul li a:hover {
    text-decoration:underline;
    }
    
 ul.linkStyle1 li a:link, ul.linkStyle1 li a:visited {
    text-decoration:underline;
    }
    
ul li a:hover {
    text-decoration:underline;
    }   

p {
               font-weight: normal;
               color: #333333;
	padding: 0 10px 0 0;
	margin:0 0 12px 0;
	}
	
#pageContent p { /* pageContent area only leading */
    line-height:1.6em;}

.p0 {
               font-weight: normal;
               color: #333333;
	margin:0;
	padding:0 10px 0 0;
	}

.p1 {
    font-weight: bold;
    color: #000000;
    padding-right:0px;  
}

.p2 {
    font-weight: bold;
    color: #333333;
    padding-right:0px;  /* right padding is 0 for when p2 is used as a span within a p tag */
}

.fontDeco1 {

      font-style: italic;

      }

/* headlines for both sites */
h1 {
    font-family: arial, sans-serif;
    font-size: 2.0em;
    font-weight: bold;
    color: #333333;
    margin:10px 10px 4px 0;
    padding:0;
}

h2 {
    font-family: arial, sans-serif;
    font-size: 1.6em;
    font-weight: bold;
    color: #333333;
    margin:12px 10px 10px 0;
    padding:0;
    line-height:1.4em;
}

h3 {
    font-family: arial, sans-serif;
    font-size: 1.25em;
    font-weight: bold;
    color: #333333;
    margin:0 10px 3px 0;
    padding:0;
}

h4 {
    font-family: arial, sans-serif;
    font-size: 1.25em;
    font-weight: bold;
    color: #000000;
    margin:0 10px 3px 0;
    padding:0;
}

h5 {
    font-family: georgia, serif;
    font-size: 1.3em;    
    color: #000000;
    font-weight:normal;
    margin:0 10px 3px 0;
    padding:0;
}

h6 {
    font-family: georgia, serif;
    font-size: 1.3em;    
    font-weight: bold;
    color: #000000;
    margin:0 10px 3px 0;
    padding:0;
}


#pageContent .listStyle0 {
    list-style:none;
    padding:0;
    margin:0;}

.style1 {
    color: #cc0000;
}

.breadcrumbs {margin:17px 0 16px 0; padding:0;}

.saleTxt, .errorTxt {color:#cc0000;}

.captionTxt, .disclaimerTxt {
    font-size:.9em;
    line-height:1.3em;
    }

/*Table styles */

#pageContent table {
              color:#333333;
              border:0;
              }
              
#pageContent table.style1 {
	border-color:#cccccc; 
	border-width:1px; 
	border-collapse: collapse; 
	border-style:solid;
	}

#pageContent table td, #pageContent table th {
	padding:4px;
	margin:0;				
	vertical-align:top;
	}

	#pageContent table tr.tr0 {
	background-color:#ffffff;
	}
	
	#pageContent table tr.tr1 {
	background-color:#F5F5F5;
	}
	
	#pageContent table tr.tr2 {
	background-color:#E5E5E5;
	}
	
	#pageContent table tr.tr3 {
	background-color:#E4DED7;
	}
	
	#pageContent table tr.tr4 {
	background-color:#F6F4F2;
	}
	
	#pageContent table tr.tr1Last td {          /* should only be used if last tr is class tr0 */
	border-bottom: 3px solid #F5F5F5;
	}
	
	#pageContent table tr.tr4Last td {          /* should only be used if last tr is class tr0 */
	border-bottom: 3px solid #F6F4F2;
	}
	
/* Grid Styles */

/*  ----------------------- Lead style - can be used across templates  ----------------------- */
#pageContent .lead {
    width:695px;
    padding:0;
    margin:0;
    height:215px; 
    }

/* ----------------------- 1 column, 8 grids styles  ----------------------- */
 #pageContent .colA8grid {
    width:694px;
    padding: 0;
    margin:0;
    float:left;
    }


/* ----------------------- 2 column, 5/3 grid styles  ----------------------- */
#pageContent .col5gridWrapper {
    background: #fff url(https://www.rei.com/pix/common/dot_vert.gif) 439px 0 repeat-y;
    float:left;}
    

#pageContent .colA5grid {
    width:440px;
    padding: 0 0 10px 0;
    margin:0;
    float:left;
    }

    
#pageContent .colB3grid {
    width:245px;
    padding: 0 0 0 0;
    margin:0 0 0 10px;
    float:left;
    }
    
    #pageContent .colA3grid {
    width:245px;
    padding: 0 0 0 0;
    margin:0 10px 0 0;
    float:left;
    }
    
#pageContent .colB3grid ul {
    padding:0 0px 15px 15px;
    margin:0 0 0 0;
    }
    
#pageContent .colB3grid ul.listStyle0 {
    list-style:none;
    padding:0;
    margin:0;
    }

/* 2 column 5/2 grid for tab content */
#pageContent .tabCol5gridWrapper {
    background: #fff url(https://www.rei.com/pix/common/dot_vert.gif) 439px 0 repeat-y;
    float:left;}
    

#pageContent .tabColA5grid {
    width:440px;
    padding: 0 0 10px 0;
    margin:0;
    float:left;
    }

    
#pageContent .tabColB2grid {
    width:166px;
    padding: 0 0 0 0;
    margin:0 0 0 10px;
    float:left;
    }
/* END tab grid styles */


/*  ----------------------- 2 column, 4/4 grid styles  ----------------------- */

#pageContent .col4gridWrapper {
    background: #fff url(https://www.rei.com/pix/common/dot_vert.gif) 342px 0 repeat-y;
    float:left;}


#pageContent .colA4grid {
    width:333px;   /* if no right padding then width:343px; */
    padding: 0 10px 0 0;
    margin:0;				
    float:left;
    }
    
#pageContent .colB4grid {
    width:342px;
    padding: 0 0 0 0;
    margin:0 0 0 10px;
    float:left;
    }
    
        
/*  ----------------------- 4 column 2/2/2/2 grid styles  ----------------------- */

#pageContent .col6gridWrapper {
    background: #fff url(https://www.rei.com/pix/common/dot_vert.gif) 516px 0 repeat-y;
    float:left;}
    
    
#pageContent .colA6grid {
    width:517px;  /* supposed to be 518 but does not work with colB2grid which is 166, so it becomes 517... */ 
    padding: 0 0 10px 0;
    margin:0;
    float:left;
    }

#pageContent .colA2grid {
    width:166px;
    padding: 0;
    margin:0;				
    float:left;
    }
	
#pageContent .colB2grid, #pageContent .colC2grid, #pageContent .colD2grid {
    width:166px;
    padding: 0 0 0 0;
    margin:0 0 0 10px;
    float:left;
    }
    
/*  Horizontal Dots Styling */   
.horizdots {				
    /*width: 99%;*/
    height:21px;
    background: #fff url(https://www.rei.com/pix/common/dot_horiz.gif) 2px 6px repeat-x;
    padding:0;
    margin: 0 10px 0 0;
    }
    
.horizdots2 {				
    width: 100%;
    height:16px;
    background: #fff url(https://www.rei.com/pix/common/dot_horiz.gif) 2px 8px repeat-x;
    padding:0;
    margin: 0;
    }
    
/* REI.com Button style */
.button {
	zoom:1;  /* IE hack  */
	white-space:nowrap;
	margin:0 0 0 -2px; 
	padding:0;
	float:left;	
}

.button:after {
	display:block;
	clear:both;
	content:'';
}

.button a.btnStyle1 {  /* Orange button */
	float:left;
	/*background:#ff6600 url('https://www.rei.com/pix/common/btn_border_org.gif') no-repeat;*/
	background:transparent url('../../images/common/btn_border_org2.gif') no-repeat;
	cursor:pointer;	
	text-align:center;
	display:block;	
	text-decoration:none;
	margin:3px 2px;
}

#tabContainer .button a.btnStyle1, #tabContainer2 .button a.btnStyle1 {
           
         /*   z-index:99;        */
          }

/*  for hover on button */
.button a.btnStyle1:hover {	
	text-decoration:none;
}

.button a.btnStyle1 span {
	padding:1px 10px 5px 7px;	
	text-align:center;
	position:relative;
	left:2px;
	top:1px;
	display:block;
	text-decoration:none;
	/*background:url('https://www.rei.com/pix/common/btn_border_org.gif') right bottom no-repeat;*/
	background:url('../../images/common/btn_border_org2.gif') right bottom no-repeat;
	color:#ffffff;
	font-weight:bold;
	font-family:verdana;
	font-size:11px;
	line-height:13px;
} 
/* END button style */



/*begin print style*/

@media print
{
body { 
	background : #fff; 
	color:#000;
	 }
	 
.noPrint {
                display:none;
                }
	 
#printPage, #sidebarWrapper, #footerWrapper{
	display:none;
	}	
#headerWrapper {
                border:none;
                top:-80px;
                height:75px;
                }

#headerWrapper #logo {
            display:block;
            padding-left:0;
            }
#container {border:none; margin:0;}
#wrapper {top:65px;}
#coreWrapper, #corewrapper {border:none;}
#pageContent {
	float: left;
	margin:0;
	padding:0;
	}	
#pageContent a, #pageContent p, #pageContent ul li, #pageContent td, #pageContent th, #pageContent h1, #pageContent h2, #pageContent h3  {color:#000;}
}

/*end print style*/

