/* Custom CSS Document for 
~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*/


/* new styles for 09 */
#wrapper {
    width: 716px;
    margin: 0 auto;
		height: auto;
		clear: both;
}

#intro {
    padding-bottom: 10px;
}

h2 {
    margin: 0;
    margin-bottom: 14px;
    padding: 0;
}

#slider {
    width: 716px;
    margin: auto;
		margin: 10px 2px 2px 2px;
    position: relative;
		font-family: arial, Helvetica, Sans Serif;
		font-size: 11px;
		font-weight: bold;
		
}

.scroll {
    height: 210px;
		color: #AFAFAF;
    width: 716px;
    overflow: auto;
    overflow-x: hidden;
    position: relative;
    clear: left;
    background: #cccccc url(images/content_pane-gradient.gif) repeat-x scroll left bottom;
}

.scrollContainer div.panel {
    padding: 0px 5px 0px 5px;
		background: #000000;
    height: 210px;
    width: 706px;
}

#shade {
    background: #EDEDEC url(images/shade.jpg) no-repeat 0 0;
    height: 50px;
}

.navigation {
background: #EDEDEC url(../images/layout/09-main-top-back.jpg) no-repeat 0 0;
    height:19px;
		color: #AFAFAF;
		
		
}

ul.navigation {
		top:5px;
		color: #AFAFAF;
    list-style: none;
    margin: 0px;
		padding: 5px;
}

ul.navigation li {
		padding: 5px 5px 5px 0px;
		display: inline;
		color: #AFAFAF;
    margin-right: 2px;
		}

ul.navigation a {
    padding: 2px;
    color: #AFAFAF;
    text-decoration: none;
			
}

.navigation a:link {color: #d2d2d2; text-decoration: none;}

ul.navigation a:hover {
    background-color: #4B4B4B;
		padding: 2px;
		padding-bottom:10px;
		text-decoration: none;
		
}

ul.navigation a.selected {
    background-color: #000000;
		padding: 2px;
		 color: #ffffff;
		padding-bottom:22px;
		text-decoration: none;
}

ul.navigation a:focus {
    outline: none;
}

.hide {
    display: none;
}


.roundTop1 {
background: #E5E5E5 url(../images/layout/09-corners-top.jpg) no-repeat 0 0;

}

#side-panels {
width:238px;
float: right;
position: relative;

}


/* rounded corners */
/* here's the box... the image is the upper-left corner */
.round-csc {
  background : #E5E5E5 url(../images/layout/09-corner-tl.jpg) no-repeat;
  width : 238px;
  height : auto;
  position: relative;
	margin-top: 10px;
}

.round-cscWC {
  background : #E5E5E5 url(../images/layout/2010-world-cup.png) no-repeat;
  width : 238px;
  height : 103px;
  position: relative;
	margin-top: 10px;
	margin-bottom: -10px;
	color: #FFFFFF;
}


.round-top {
	position : absolute;
  background : transparent url(../images/layout/09-top-corners.png) no-repeat;
  top : 0;
  right : 0;
	width: 238px;
	height: 10px;
	display: block;
}

.round-topWC {
	position : absolute;
  background : transparent url(../images/layout/2010-world-cup.png) no-repeat;
  top : 0;
  right : 0;
	width: 238px;
	height: 103px;
	display: block;
}

.round-bottom {
	position : absolute;
  background : transparent url(../images/layout/09-bottom-corners.png) no-repeat;
  bottom : -10;
  right : 0;
	width: 238px;
	height: 10px;
	display: block;
	
}

.spacerDiv {
width: 100%px;
padding: 0px;
margin: 0px;
position: relative;
}

.round-inside {
position: relative;
width:222px;
padding:8px;
}

.round-inside a:link {font-family: arial; color: #000000; text-decoration: none; font-weight: bold;}
.round-inside a:visited {font-family: arial; color: #000000; text-decoration: none; font-weight: bold;}
.round-inside a:active {font-family: arial; color: #000000; text-decoration: none; font-weight: bold;}
.round-inside a:hover {font-family: arial; color: #454545; text-decoration: none; font-weight: bold;}


/* End rounded corners */

.feat-brand1 {
position: relative;
float: left; 
width:152px; 
z-index: 3;
}

p.feat-brand1 {
padding:4px;
}

.feat-brand2 {
position: relative;
float: left; 
width:236px; 
background-color:#e5e5e5; 
z-index: 3;
margin: 2px;
height: 100%;
}

.feat-brand2-inside {
position: relative;
float: left;
padding: 4px;
}

.feat-brand3 {
position: relative;
float: left; 
width:476px; 
z-index: 3;
margin: 2px;
}

.brand-item {
width: 120px;
position: relative;
float: left;
}

/* begin styles for RSS Feed 
     This is the most basic style to use for a list with no bullets */

.rss_box {
	 width: 200px;
	 margin-top:8px;
	
}

.rss_title, rss_title a {
	margin: 0px 0;
	padding: 0;
}

.rss_items {
       list-style:none;
       margin:0;
       padding:0;
}

.rss_item  {
  font-size: x-small;
  margin-bottom: 1em;;
}
.rss_item a:link, .rss_item a:visited, .rss_item a:active {
	}

.rss_item a:hover { 
	}
.rss_date {
	font-size: xx-small;
	}

/* end rss style */

.container-PR {
background: #ffffff;
width: 716px;
position: relative;
height: 220px;
padding-top: 35px;
}

p.paragraph-PR {
width:450px;
position: relative;
float: left;
margin: 10px;
background: trainsparent;
}

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

li#twitter_update_list  {
list-style: none;
padding: 0;
margin: 0;
} 

#twitter_div {
list-style: none;
padding: 10px 0 0 0;
margin: 0;
} 




/* end new styles for 09 */


h1.logoText {
font: 10px Arial, sans-serif;
color: #000000;
display: inline;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

/* Top Sub Menu Rollover */

a.topSubrollover  {
	display: block;
	width: 103px;
	height: 74px;
	text-decoration: none;
	background: url("../images/layout/09-top-blog.gif");
	}

a.topSubrollover:hover {
	background-position: 0 -74px;
	}

.displace {
	position: absolute;
	left: -5000px;
	}
/* END rollover */



.topSubMenuLinks {
text-align: right;
float: right;
font-weight: bold;
font: bold 11px/26px Arial, sans-serif;
}



/* Global Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

h1 {font:24px Arial, Helvetica, sans-serif;}
h2 {font:bold 18px Arial, Helvetica, sans-serif;}
h3 {font:bold 14px Arial, Helvetica, sans-serif;}



/* TopSubBanner Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#TopSubBannerCell { text-align:left;}
#TopSubBanner1_SimpleSearch1_Panel1 {margin: 0; padding:0 0 0 15px; float:none;}


/* RightColumnNav Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#RightColumnCell {}

/* Footer Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#FooterCell {}

/* Default Page Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Search & Cart Control Styles 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#cartwrap {margin: 0; padding: 0;}

/* Price 
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.price { font-family: Arial; font-weight: bold; color:#000000; font-size:17px;}
.td.price {padding: 8px;}

/* SEarchpage
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.searchpage {vertical-align:top; padding:2 ;}
.td.searchpage { border-right:1px solid #ccc; }
.tr.searchpage { border-bottom:1px solid #ccc; }
.tr.DescSpace  { border-bottom:1px solid #ccc;}
.ImageSpace {padding: 4px;}
.DetailSpace { border-left:1px solid #ccc;}







/* CONTROL THE FONT AND FORMAT OF THE VALIDATION ERROR CONTROLS */

.SignInError
{
	font-weight: bold;
	font-size: 11px;
	color: gold;
	font-family: arial, Helvetica, Sans Serif;
	cursor: hand;
	cursor: pointer;
}

div.captionText {
	font-size: 10px;
	color: #5A5A5A;
	font-family: arial, Helvetica, Sans Serif;
	float:left;
	position:relative;
}


.salePrice1 {
color: #ff0000;
font-size: 11px;
font-weight: bold;}

.salePrice2 { font-family: Arial; font-weight: bold; color:#ff0000; font-size:18px;}

/* STYLES FOR THE NEW FRONT PAGE */

h1 { 
color: #ffffff;
font-size: 20px;
font-family: arial;
font-weight: strong;
}

.clear {
clear:both;
height:1px;
font-size:1px;
line-height:1px;
}

.clearfix:after {
        content:".";
        display:block;
        height:0;
        clear:both;
        visibility:hidden;
				line-height: 0;
				}

div.container {
position; absolute;
margin-top: 2px;
padding: 0px;
width: 720px;
z-index: 1;
display: block;
}

div.couponContainer {
position; absolute;
margin: 0px;
width: 950px;
height:80px;
border: #000000 0px solid;
background-color:#000000; 
background-image:url(../images/layout/couponContainer-back.jpg); 
z-index: 1;
vertical-align:middle;
}

.couponLink {
position: relative;
color: #FCFF00;
bottom: 30px;
padding: 0px;
z-index: 50;
font-size: 16px;
font-family: arial;
font-weight: bold;
}

.couponLink a:link {color: #FCFF00; text-decoration: none;}
.couponLink a:visited {color: #FCFF00; text-decoration: none;}
.couponLink a:active {color: #FCFF00; text-decoration: none;}
.couponLink a:hover {color: #FFD800; text-decoration: underline;}

div.main_content {
position: relative;
float: left;
width:716px;
border: 0px;
background-color:#ffffff; 
margin: 0px;
z-index: 5;
}

div.title {
background: url(http://www.onionbag.com/bg_title.png);
position: absolute;
padding: 0px;
height: 50px;
top: 160px;
left: 0px;
width: 716px;
color: #ffffff;
font-size: 18px;
font-family: arial;
font-weight: bold;
text-align: left;
z-index: 45;
}

div.title-text1 {
position: absolute;
color: #FFFFFF;
top: 165px;
left: 15px;
padding: 0px;
z-index: 50;
font-size: 24px;
font-family: arial;
font-weight: bold;
text-align: left;
}

.title-text1 a:link {color: #FFFFFF; text-decoration: none;}
.title-text1 a:visited {color: #FFFFFF; text-decoration: none;}
.title-text1 a:active {color: #FFFFFF; text-decoration: none;}
.title-text1 a:hover {color: #EDEDED; text-decoration: underline;}

.title-text1 h1 {
font-size: 24px;
font-family: arial;
font-weight: bold;
margin-top:0px;
padding-top:0px;
margin-bottom:0px;
padding-bottom:0px;
}

div.title-text2 {
position: absolute;
color: #FFFFFF;
top: 165px;
right: 15px;
padding: 0px;
z-index: 50;
font-size: 12px;
font-family: arial;
text-align: right;
}

.title-text2 a:link {color: #FFFFFF; text-decoration: none;}
.title-text2 a:visited {color: #FFFFFF; text-decoration: none;}
.title-text2 a:active {color: #FFFFFF; text-decoration: none;}
.title-text2 a:hover {color: #EDEDED; text-decoration: none;}

.title-text2 h2 {
font-size: 12px;
font-family: arial;
margin-top:0px;
padding-top:0px;
margin-bottom:0px;
padding-bottom:0px;
}


.title-text3 {
top: 5px;
color: #FFFFFF;
padding: 0px;
z-index: 50;
font-size: 20px;
font-family: arial;
font-weight: bold;
margins: 0px;
}

a.title-text3:link {
font-weight: bold; color: #ffffff;
}
a.title-text3:visited {
font-weight: bold; color: #ffffff;
}
a.title-text3:active {
font-weight: bold; color: #ffffff;
}
a.title-text3:hover {
font-weight: bold; color: #cccccc; text-decoration: none;
}

div#featured-item { 
background: url(http://www.onionbag.com/images/adbox/featured-item031009.jpg);
position: relative;
float: left;
z-index: 2;
height: 250px;
width: 190px;
color: #ffffff;
padding: 0px;
margin: 0px;
font-size: 12px;
font-family: arial;
align: center;
}

p.featured-item {
position: absolute;
top: 30px;
height: 200px;
left: 10px;
width: 170px;
color: #ffffff;
padding: 0px;
margin: 0px;
font-size: 11px;
font-family: arial;
margin-left: auto;
margin-right: auto
}
a.featured-item:link { font-weight: bold; color: #ffffff;}
a.featured-item:active {font-weight: bold;  color: #ffffff;}
a.featured-item:visited {font-weight: bold;  color: #ffffff;}
a.featured-item:hover { font-weight: bold; color: #CCCCCC; text-decoration: none;}

div.read-more {
position: absolute;
bottom: 0px;
right: 0px;
z-index: 60;
}

div.item-box { 
position: relative;
float: left; 
width:156px; 
background-color:#cccccc; 
margin: 2px;
z-index: 3;
}

div.item-box2 { 
position: relative;
float: left; 
width:236px; 
background-color:#cccccc; 
z-index: 3;
margin: 2px;
}

div.thumb-box-container {
position: relative;
width: 188px;
height: 300px;
float: left;
border-left: 1px solid #CCCCCC;
border-right: 1px solid #CCCCCC;
margin-top: 4px;
}


div.thumb-box {
position: relative;
float: left;
width: 188px;
height: 90px;
text-align: left;
padding: 3px;
font-size: 11px;
font-family: Verdana;
}

div.front-video {
position: relative;
float: left;
width: 380px;

}

div.video-title {
position: absolute;
left: 0;
top: 0;
height: 20px;
font-family: arial;
font-weight: bold;
text-align: right;
z-index: 50;
}


p.inner_content {
padding:15px;
}



div.item-title {
background: url(http://www.onionbag.com/bg_title.png);
position: absolute;
bottom: 1px;
right: 1px;
width: 100%;
height: 40px;
color: #ffffff;
font-size: 11px;
font-family: arial;
font-weight: bold;
text-align: right;
z-index: 50;
}

.item-title h2 {
font-size: 11px;
font-family: arial;
font-weight: bold;
line-height: 1.5;
margin-top: 0px;
padding-top: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
}

.item-title a:link {color: #FFFFFF; text-decoration: none;}
.item-title a:visited {color: #FFFFFF; text-decoration: none;}
.item-title a:active {color: #FFFFFF; text-decoration: none;}
.item-title a:hover {color: #EDEDED; text-decoration: none;}


div.bottom-container {
position: relative;
float: left;
width: 100%;
height: 250px;
background-color: #666666;
color: #ffffff;
}

div.blog2 { 
float: left;
width: 260px;
color: #ffffff;
text-align: left;
padding: 10px;
font-size: 11px;
font-family: Verdana;
}

.blog2 a:link {color: #FFFFFF; text-decoration: none;}
.blog2 a:visited {color: #FFFFFF; text-decoration: none;}
.blog2 a:active {color: #FFFFFF; text-decoration: none;}
.blog2 a:hover {color: #EDEDED; text-decoration: none;}


div.printRoom {
position: relative;
float: right;
width: 390px;
z-index: 2;
height: 250px;
color: #ffffff;
text-align: left;
vertical-align: bottom;
font-size: 11px;
font-family: Verdana;
}

.printRoom a:link {color: #FFFFFF; text-decoration: none;}
.printRoom a:visited {color: #FFFFFF; text-decoration: none;}
.printRoom a:active {color: #FFFFFF; text-decoration: none;}
.printRoom a:hover {color: #EDEDED; text-decoration: underline;}

.bottom-title {
color: #ffffff;
font-size: 20px;
font-family: arial;
font-weight: bold;
text-align: right;
}

.spacer {
float: left;
}

.blogFeeds {
width: 560px;
float: left;
}

.specialOffers {
position: absolute;
left: 20px;
bottom: 10px;
width: 500px;
border-top: 1px solid #CCCCCC;
font-size: 11px;
font-family: verdana;
}

.specialOffers a:link {color: #FFFFFF; text-decoration: none;}
.specialOffers a:visited {color: #FFFFFF; text-decoration: none;}
.specialOffers a:active {color: #FFFFFF; text-decoration: none;}
.specialOffers a:hover {color: #EDEDED; text-decoration: none;}

div#premier-league-bar { 
background: url(http://www.onionbag.com/images/08/premier-league-numbers.jpg);
position: relative;
float: left;
z-index: 2;
height: 50px;
width: 950px;
color: #ffffff;
padding: -5px;
margin: 0px;
font-size: 12px;
font-family: arial;
align: center;
}