@import url("/stylesheets/my_widget/components/widget.css");

body { background: #05090f url(http://cache.gydget.com/images/my_widget/bg_blue_gradient.png) repeat-y top center }

#ie #head { background-image: url(http://cache.gydget.com/images/my_widget/head_bar_dark_bg.gif) }
html > body #ie #head, html > body #head { background-image: url(http://cache.gydget.com/images/my_widget/head_bar.png) }

#left, #main, #right { 
	float: left;
	margin-top: 17px;
}
#left, #right { width: 220px }

#main {
  width: 425px;
	float: left;
	margin: 17px;
}

#widget { width: 425px }

#promo, #artists, #fans, #advertisers {
	float: left;
	clear: left;
	margin-bottom: 8px;
}

#promo div, #artists div, #fans div, #advertisers div { line-height: 15px }

#promo a {
	display: block;
	text-indent: -5000px;
	width: 153px;
	height: 28px;
	background: transparent url(http://cache.gydget.com/images/my_widget/create_your_own.png) no-repeat bottom left;
	margin: 0 auto;
}

.boxtop, .boxbottom, .boxmiddle {
	width: 206px;
	padding: 7px;
	float: left;
	clear: left;
}

.boxtop { background: transparent url(http://cache.gydget.com/images/my_widget/home_box_top.gif) no-repeat 0 0 }
html > body .boxtop { background-image: url(http://cache.gydget.com/images/my_widget/home_box_top.png) }

.boxbottom {
	background: transparent url(http://cache.gydget.com/images/my_widget/home_box_bottom.gif) no-repeat left bottom;
	min-height: 30px;
	padding-top: 0;
}

html > body .boxbottom { background-image: url(http://cache.gydget.com/images/my_widget/home_box_bottom.png) }

.boxmiddle { background-color: #fff }

h1.boxtop, h1.boxmiddle {
	color: #f16521;
	font-size: 16px;
	line-height: 16px;
}

#left .boxbottom div { 
	color: #3E5587;
	background-color: #fff;
	font-size: 12px;
}

#left .boxbottom div img { 
	float: right;
	margin-left: 5px;
	vertical-align: bottom;
}

#left #artists img {
	position: relative;
	right: 0;
	bottom: -8px;
}

.orange_bottom { background: transparent url(http://cache.gydget.com/images/my_widget/home_box_bottom_orange.gif) no-repeat left bottom }
.orange_bottom a { 
	font-size: 10px;
	color: #fff;
	
}
.orange_top {	
	background: transparent url(http://cache.gydget.com/images/my_widget/home_box_top_orange.gif) no-repeat left top;
	padding-bottom: 0;
}
html > body .orange_bottom { background-image: url(http://cache.gydget.com/images/my_widget/home_box_bottom_orange.png) }
html > body .orange_top {	background-image: url(http://cache.gydget.com/images/my_widget/home_box_top_orange.png) }
h1.orange_top { 
	color: #fff;
	font-size: 12px;
	font-weight: bold;
}

h1.orange_top span { font-weight: normal; }
h1.orange_top span span { font-size: 10px }


#left .orange_bottom div { 
	color: #fff;
	background-color: #f16521;	
}

#left a { 
	font-size: 10px;
	font-weight: bold;
	text-decoration: underline;
}

#featured {
  float: left;
  width: 220px;
}

#featured h1.category { 
	margin-top: 8px;
	font-size: 18px;
}

#top_views, #top_grabs {
	padding-left: 7px;
	width: 206px;
	clear: left;
	float: left;
}

#top_grabs { width: 206px }
	
.top_view, .top_grab { 
  float: left;
  margin: 0 10px 10px 0;
}

#ie .top_view, #ie .top_grab { 
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/my_widget/featured_frame_ie.png');
  background: none;
}

#featured .right { margin-right: 0 }
#featured .bottom { margin-bottom: 0 }

.top_view a, .top_grab a {	
  border: 1px solid #3e5587;
	display: block;
  width: 60px;
  height: 60px;
  line-height: 60px;
	overflow: hidden;
}

.top_view img, .top_grab img { 
  width: 60px;
  height: 60px;
	border: 0;
}

#footer, #footer a { color: #3E5587 }

#footer { 
	background: transparent url(http://cache.gydget.com/images/my_widget/footer_bg.gif) no-repeat left top;
	padding: 0 0 0 10px;
	width: 896px;
	height: 36px;
}

html > body #footer { background-image: url(http://cache.gydget.com/images/my_widget/footer_bg.png) }

#footer .background {
	color: #3E5587;
	padding: 9px 10px 1px 0;
	height: 20px;
	display: block;
}

#main h1 a { 
	color: #3E5587;
	text-decoration: underline;
}