/* $Id: style.css,v 1.38.2.2 2009/12/20 01:11:21 goba Exp $ */

/**
 * Button Menu
 * Benjamin Frederick Sullivan, niimae [dot] com
 * Povides an asthetic vertical navigation menu
 */

 .solidblockmenu{
margin: 0;
padding: 0;
float: left;
font: bold 13px Arial;
width: 100%;
overflow: hidden;
margin-bottom: 1em;
border: 1px solid #86A2B6;
border-width: 1px 0;
background: white url(blockdefault.gif) center center repeat-x;
}

.solidblockmenu li{
display: inline;
}

.solidblockmenu li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
}

.solidblockmenu li a:visited{
color: white;
}

.solidblockmenu li a:hover, .solidblockmenu li .current{
color: white;
background: transparent url(blockactive.gif) center center repeat-x;
}

 
 
 
 
 
.aerobuttonmenu{ /*container that holds a row of aero buttons*/
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: auto;
background: #F7F7F7; /*menu strip background*/
border: 2px solid #86A9C4;
padding: 4px 0;
border-width: 2px 0;
margin-left: auto;
margin-right: auto;
}

* html .aerobuttonmenu{ /*IE6 and below hack. Set explicit strip width*/
width: 100%;
}

.aerobuttonmenu a.aero{ /*aero button CSS*/
background: transparent url('aeroleft.gif') no-repeat top left;
display: block;
float: left;
font: bold 13px Verdana, Trebuchet MS; /* Change 13px as desired */
line-height: 23px; /* This value + 8px should equal height of button background (default is 31px) */
height: 31px; /* Height of button background height */
padding-left: 10px; /* Width of left menu image */
text-decoration: none;
margin-right: 5px; /*spacing between buttons*/
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90); /*this and next two rules control opacity of buttons before hover*/
opacity: 0.9;
-moz-opacity: 0.9;
}

.aerobuttonmenu a.aero:link, .aerobuttonmenu a.aero:visited, .aerobuttonmenu a:active{
color: white; /*button text color*/
}

.aerobuttonmenu a.aero span{
background: transparent url('aeroright.gif') no-repeat top right;
display: block;
padding: 4px 10px 6px 0; /*Set 10px here to match value of 'padding-left' value above*/
}

.aerobuttonmenu a.aero:hover{ /* Hover state CSS */
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /*this and next two rules control opacity of buttons during hover*/
opacity: 1;
-moz-opacity: 0.99;
}

.aerobuttonmenu a.aero:hover span{ /* Hover state CSS (for text) */
color: #EE9700;
}

.black a.aero{
background-image: url('media/aeroleftblack.gif');
}

.black a.aero span{
background-image: url('media/aerorightblack.gif');
}

.aerobuttonmenu .rightsection{
float: right;
width: 100px;
position: relative;
top: 3px;
padding-right: 5px;
text-align: right;
}

.aerobuttonmenu .rightsection a{
color: navy;
}

/**
 * List Menus for Drupal 6.x
 * Benjamin Frederick Sullivan, niimae [dot] com
 * Povides an asthetic vertical navigation menu
 */

#listmenu{
width:185px;
float:left;
text-align:left;
position:relative;
top: -10px
}

#listmenu a{
text-decoration:none
}

#listmenu_browse_content,#listmenu_browse_content_o{
background:#F1FAFE url(menubottom.gif) no-repeat right bottom;
width:185px;
padding-bottom:11px;
margin:0
}

#listmenu_browse_content{
margin-bottom:12px
}

#listmenu_browse_content li,  #listmenu_browse_content_o li{
border-bottom:1px solid #D0F2FD;
padding:2px 0 2px 13px;
font-family:Arial,Helvetica,sans-serif;
font-size:13px;
color:#FFFFFF;
}

#listmenu_browse_content .listmenu_browse_content_title,  #listmenu_browse_content_o .listmenu_browse_content_title{
padding:0px;
margin:0px;border:0px;
margin-left:-14px;
background:url(menutop.gif) no-repeat left top;
height:30px
}

#listmenu_browse_content_o div, #listmenu_browse_content div{
color:#FFF;
font-size:14px;
font-weight:bold;
padding-left:13px;
padding-top:4px
}

#listmenu_browse_content li a, #listmenu_browse_content_o li a{
color:#494949;
display:block;
text-decoration:none
}

#listmenu_browse_content li a:hover{
color:#FFF
}

#listmenu_browse_content li:hover{
background-color:#FEFEE9
}

#listmenu_browse_content li:hover a{
color:#0080FF
}

#listmenu_browse_content_o .listmenu_browse_content_sub_title{
background:#19364D url(http://assets.bukisa.com/img/left_browse_content_sub_array.gif) no-repeat right 10px;
color:#FFF
}

#listmenu_browse_content_o .listmenu_browse_content_sub_title a{
color:#FFF
}

#listmenu_browse_content_o .listmenu_browse_content_sub_title a:hover{
color:#e1edf6
}

#listmenu_browse_content_o .listmenu_browse_content_sub{
background:#d6e8f5 url(http://assets.bukisa.com/img/left_browse_content_sub_pl.png) no-repeat 11px 7px;
padding-left:21px
}

#listmenu_browse_content_o .listmenu_browse_content_sub a{
color:#234c6a
}
#listmenu_browse_content_o .listmenu_browse_content_sub a:hover{
color:#657179;
font-weight:bold
}

#listmenu_browse_content_o .listmenu_browse_content_sub_active{
color:#234c6a;
font-weight:bold;
background:#BAE2FE url(http://assets.bukisa.com/img/left_browse_content_sub_pl.png) no-repeat 11px 7px;
padding-left:21px
}

.ajhv  li:hover{
color:#fff;
background-color:#1586d8
}

#listmenu_browse_content_o .ajhvh a:hover{
color:#fff}#twitter_div{
background:#e8f0f6 url(http://assets.bukisa.com/img/left_browse_content_end_bg.gif) no-repeat left bottom;
width:181px;
padding-bottom:12px;
overflow:hidden}#twitter_div li{
border-bottom:1px solid #0080FF;
padding:8px 5px 4px 11px;
font-family:Arial,Helvetica,sans-serif;
font-size:13px;
color:#333}#twitter_div .twitter-title{
padding:0px;
margin:0px;
border:0px;
background:url(http://assets.bukisa.com/img/left_browse_content_h2_bg.gif) no-repeat left top;
height:24px;
text-align:center;
padding-top:5px
}
/**Overides and replaces default menu leaf**/
ul li, ul.menu li, .item-list ul li, li.leaf {
  padding: 0 0 .2em 1.5em;
  list-style-type: none;
  list-style-image: none;
  background: none;
}

/**ROUND CORNERED BOX**/

.roundcont {
	width: 100%;
	background-color: #19364D;
	color: #fff;
}

.roundcont p {
	margin: 0 10px;
}

.roundtop { 
	background: url(tr.gif) no-repeat top right;
}

.roundbottom {
	background: url(br.gif) no-repeat top right;
}

img.corner {
   width: 15px;
   height: 15px;
   border: none;
   display: block !important;
}

 /**
  *use this php code to integrate the menu:

<link href="http://www.niimae.com/niimae/listmenus/listmenus.css" rel="stylesheet" type="text/css" />
<div id="listmenu">
<div id="listmenu"><h2>Browse</h2>
<li class="listmenu_sub">
<a href="/art-entertainment">Art &amp; Entertainment<br /></a></li>
<li class="listmenu_sub">
<a href="/business-financial">Business &amp; Financial<br /></a></li>
<li class="listmenu_sub">
<a href="/computer-internet">Computer &amp; Internet<br /></a></li>
<li class="listmenu_sub">
<a href="/fashion-beauty"><span>Fashion &amp; Beauty</span></a></li>
<li class="listmenu_sub">
<a href="/events"><span>Events</span></a></li>
<li class="left_browse_content_sub">
<a href="/health"><span>Health</span></a></li>
<li class="left_browse_content_sub">
<a href="/hobbies"><span>Hobbies</span></a></li>
<li class="left_browse_content_sub">
<a href="/home-garden"><span>Home &amp; Garden</span></a></li>
<li class="left_browse_content_sub">
<span id="regular-categories"><a href="/news" title="Software">News</a></span></li>
<li class="left_browse_content_sub">
<a href="/relationships"><span>Relationships</span></a></li>
<li class="left_browse_content_sub">
<a href="/reviews"><span>Reviews</span></a></li>
<li class="left_browse_content_sub">
<a href="/science-technology"><span>Science &amp; Technology<br />
</span></a></li>
<li class="left_browse_content_sub">
<a href="/shopping"><span>Shopping</span><br /></a></li>
<li class="left_browse_content_sub">
<a href="/travel">Travel</a></li>
</div><!-- /listmenus -->

 *
 **/
 
 /**
 * Display Cases
 * Benjamin Frederick Sullivan, niimae [dot] com
 * Povides asthetic diplay of content within drupal core blocks
 */
 
#display-cases {
float:right;
width:200px;
margin:-5px
}
#display1,#display2,#display3 {
margin-bottom:20px;
background-image:url(bottom.gif);
background-position:left bottom;
background-repeat:no-repeat
}
#display1 h2,#display2 h2,#display3 h2 {
text-align:center;
text-decoration: none;
color:#FFFFFF;
padding:0px 30px 9px 0;
margin:0 0 0 -1px;
background:url(boxtop.gif) top no-repeat #ececec;
font-weight:200
}
#display1 p,#display2 p,#display3 p {
padding:9px 19px 24px 12px;
margin:0
}

 /**
  *use this php code to integrate this display:

<link href="http://www.niimae.com/niimae/displaycases/displaycases.css" rel="stylesheet" type="text/css" />
<div id="display-cases">
<div id="display1"><h2>Heading 2</h2>
<p>Dummy text...</p>
</div>
<div id="display2"><h2>Heading 2</h2>
<p>Dummy text...</p>
</div>
<div id="display3"><h2>Heading 2</h2>
<p>Dummy text...</p>
</div>
</div><!-- /display-cases -->

 *
 **/
 
 /**
 * CSS style for sub-menu tabs.
 */

#navigation a{
color: #FFFFFF;
background: #0C171D url(../submenutabs/left-tab.gif) left top no-repeat;
text-decoration: none;
padding-left: 5px
}

#navigation a span{
background: url(../submenutabs/right-tab.gif) right top no-repeat;
padding-right: 5px
}

#navigation a, #navigation a span{
display: block;
float: left
}

/* Hide from IE5-Mac \*/
#navigation a, #navigation a span{
float: none
}
/* End hide */

#navigation a:hover{
color: #fff;
background: #044173 url(../submenutabs/left-tab-hover.gif) left top no-repeat;
padding-left: 5px
}

#navigation a:hover span{
background: url(../submenutabs/right-tab-hover.gif) right top no-repeat;
padding-right: 5px
}

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

#navigation li{
float: left;
margin: 0;
} 

 /**
 * Header Display
 * Benjamin Frederick Sullivan, niimae [dot] com
 * Povides an image background for text headers
 */
 
#headerdisplay{
width:425px;
margin-left: auto;
margin-right: auto;
text-align:left;
position:relative;
top:14px
}

#headerdisplay a{
text-decoration:none
}

#header_views_display,#header_views_display_o{
width:425px;
padding-bottom:0px;
margin-left: auto;
margin-right: auto;
}

#header_views_display{
margin-bottom:0px
}

#header_views_display li,  #header_views_display_o li{
border-bottom:1px solid #D0F2FD;
padding:2px 0 2px 13px;
font-family:Arial,Helvetica,sans-serif;
font-size:13px;
color:#FFFFFF;
}

#header_views_display .header_views_display_title,  #header_views_display_o .header_views_display_title{
padding:0px;
margin-left: auto;
margin-right: auto;
border:0px;
margin-left:0px;
background:url(headertop.gif) no-repeat center top;
height:30px
}

#header_views_display_o div, #header_views_display div{
color:#FFF;
font-size:14px;
font-weight:bold;
padding-left:13px;
padding-top:4px
}

#header_views_display li a, #header_views_display_o li a{
color:#494949;
display:block;
text-decoration:none
}

#header_views_display li a:hover{
color:#FFF
}

#header_views_display li:hover{
background-color:#FEFEE9
}

#header_views_display li:hover a{
color:#0080FF
}

#header_views_display_o .header_views_display_sub_title{
background:#19364D url(http://assets.bukisa.com/img/left_browse_content_sub_array.gif) no-repeat right 10px;
color:#FFF
}

#listmenu_browse_content_o .header_views_display_sub_title a{
color:#FFF
}

#header_views_display_o .header_views_display_sub_title a:hover{
color:#e1edf6
}

#header_views_display_o .header_views_display_sub{
background:#d6e8f5 url(http://assets.bukisa.com/img/left_browse_content_sub_pl.png) no-repeat 11px 7px;
padding-left:21px
}

#header_views_display_o .header_views_display_sub a{
color:#234c6a
}
#header_views_display_o .header_views_display_sub a:hover{
color:#657179;
font-weight:bold
}

#header_views_display_o .header_views_display_sub_active{
color:#234c6a;
font-weight:bold;
background:#BAE2FE url(http://assets.bukisa.com/img/left_browse_content_sub_pl.png) no-repeat 11px 7px;
padding-left:21px
}

.ajhv  li:hover{
color:#fff;
background-color:#1586d8
}


<p>
	<link href="http://www.niimae.com/niimae/listmenus/listmenus.css" rel="stylesheet" type="text/css" /></p>
<div id="leftside">
	<ul id="navigation">
		<li>
			<a href="/node" target="_self"><span>Articles</span></a></li>
		<li>
			<a href="/photos"><span>Photos<br />
			</span></a></li>
		<li>
			<a href="/blogs"><span>Blogs<br />
			</span></a></li>
		<li>
			<a href="/members"><span>Members</span></a></li>
		<li>
			<a href="/topic-hubs"><span>Hubs<br />
			</span></a></li>
	</ul>
</div>