#mygroups-bkgd { background: #e1e1e1;}

#mygroups {width: 775px; margin: 0 auto 0 auto; font: 12px Helvetica, Arial, san-serif; list-style-type: none;}
#mygroups a:link, a:visited {  text-decoration: none; }
#mygroups a:hover, a:active { text-decoration: underline; }
#mygroups a img { width: 100px; height: 100px; border: #000 1px solid; display: block; }
#mygroups a.button { margin: 4px 8px 4px 0; padding: 4px 12px; background-color: #09f; color: #fff; }
#mygroups h1 { padding: 5px 0; color: #fff; font-size: 18px; text-indent: 15px; background: #333; margin-top:4px;}
#mygroups h2 { color: #000; font-size: 18px; font-weight: bold; }
#mygroups h3 { color: #000; font-size: 16px; font-weight: bold; width:325px; overflow:hidden; word-wrap:break-word;}
#mygroups a b { width: 90px; margin: 5px auto; padding: 5px 12px; color: #999; border: #ccc 1px solid; text-decoration: none; text-align: center; }


#mygroups #left { width: 210px; padding: 15px; margin-right: 20px; float: left; }
#mygroups #left strong {font-weight: bold;}
#mygroups #left #top { margin-bottom: 24px; }
#mygroups #left #top ul a { width: 210px; height: 58px; padding-top: 15px; text-decoration: none; background: #fff; border-bottom: #e1e1e1 1px solid; display: block; }
#mygroups #left #top ul a:hover { color: #fff; background: #09f;}
#mygroups #left #top ul a h2 { color: #000; }
#mygroups #left #top ul a:hover h2, a:active h2 { color: #fff; }
#mygroups #left #top ul a:hover span.desc, a:active span.desc { color: #fff; }
#mygroups #left #top ul a span.desc { color: #000; }
#mygroups #left #top ul li { list-style-type:none;}
#mygroups #left #top ul a span.num { width: 60px; padding: 5px 20px 0 10px; color: #09f; font: bold 28px/30px Helvetica, Arial, sans-serif; text-align: right; display: block; float: left; }
#mygroups #left #top ul a:hover span.num, a:active span.num { color: #fff; }
#mygroups #left #top ul li p {background-color: #fff; padding: 6px 15px;}
#mygroups #left #top ul li p a {display: inline; padding: 0; border: none; color:#09f;}
#mygroups #left #top ul li p.head {padding-top: 24px; font: bold 18px/20px Helvetica, Arial, sans-serif;}
#mygroups #left #top ul li p.bottom {padding-bottom: 24px; border-bottom: 1px solid #ddd;}

#mygroups #left #bottom { margin-top: 4px; height: auto; background: #fff; }
#mygroups #left #bottom a img#grouppic { margin: 0 auto; clear: both; }
#mygroups #left #bottom li{list-style-type:none;}
#mygroups #left #bottom li h1 { height: 20px; }
#mygroups #left #bottom li h3 { width: 185px; text-align: left; margin: 14px auto; }
#mygroups #left #bottom li h3 a{ color:#09f;}
#mygroups #left #bottom li h3 a:visited{ color:#09f;}
#mygroups #left #bottom a:hover, a:active { text-decoration: underline; }
#mygroups #left #bottom a:link, a:visited { text-decoration: none; }
#mygroups #left #bottom a b { display: block; }
#mygroups #left #bottom a.active b { color: #fff; border: none; background-color: #09f; text-align: center; display: block; }
#mygroups #left #bottom ul#ownlinks { width: 180px; margin-bottom: 10px; padding: 15px; }
#mygroups #left #bottom ul#ownlinks li a { width: 180px; padding: 5px 0; text-indent: 10px; }
#mygroups #left #bottom ul#ownlinks li a.edit:link, a.edit:visited { border-bottom: #e1e1e1 1px solid; display: block; color:#09f; }
#mygroups #left #bottom ul#ownlinks li a.edit:hover, a.edit:active { color: #fff; font-weight: bold; text-decoration: none; background: #09f; }
#mygroups #left #bottom ul#ownlinks li em{ color:#f00; font-style:italic;}

#mygroups #left #bottom ul#no-own { padding: 15px; }
#mygroups #left #bottom ul#no-own li { padding-bottom: 5px; } /* for FireFox & Safari fix */
#mygroups #left #bottom ul#no-own li a { margin-top: 8px; padding: 8px 10px; width: 100px; background-color: #09f; color: #fff; border: none; display: block; clear: both; }


#mygroups #right { /*padding: 15px 15px 0 0;*/ padding:0 15px 0 0; margin-left: 260px; }
#mygroups #right h1 { width: 502px; margin-top:19px;}
#mygroups #right h2 { margin-bottom: 12px;}
#mygroups #right ul { float: left; }
#mygroups #right .group-block {width: 470px; clear: both; padding: 15px; background: #fff; margin-top: 12px; display: block; float: left;}
#mygroups #right .group-block li {height: auto; width: 440px; border: 1px solid #ccc; padding: 15px; float: left; margin-bottom: 15px; list-style-type:none;}
#mygroups #right .group-block li img {float: left; width: 100px; height: 100px; margin-right: 12px; border: #000 1px solid ;}
#mygroups #right .group-block li h3 a {font: bold 18px/120% Helvetica, Arial, sans-serif; text-decoration: none; color: #09f; }
#mygroups #right .group-block li h3 a:hover{text-decoration: underline;}
#mygroups #right .group-block li p {float: left; width: 307px; line-height: 24px;}
#mygroups #right .group-block li p a {color: #09f; font-weight: bold; text-decoration: none; }
#mygroups #right .group-block li p a:hover, #mygroups #right .group-block ul li h3 a:hover {text-decoration: underline;}
#mygroups #right .group-block li p a.unjoin {padding-left: 12px; margin-left: 6px; font-weight: normal; border-left: 1px solid #ccc;}
#mygroups #right .group-block li p span.unjoin { padding-left: 12px; margin-left: 6px; font-weight: normal; border-left: 1px solid #ccc; color:#ccc; }
#mygroups #right .group-block li p a.active b {background-color: #09f; color: #fff; border: none; }
#mygroups #right .group-block li p a.updates {color: #000; font-weight: normal;}
#mygroups #right .group-block li p a.updates:hover { text-decoration:none;}
#mygroups #right .group-block li p input {margin-right: 6px;}
#mygroups #right .group-block .disabled:hover{ text-decoration:none;}

#mygroups #right #no-group {width: 502px; background: #fff; margin-top: 12px; display: block; float: left; padding:15px 0 15px;}

#mygroups #right #no-group li { list-style-type:none; text-align:left;  padding:0 15px; }
#mygroups #right #no-group li a { margin:8px 0; padding: 8px 10px;  list-style-type:none;  width: 90px; text-align:left; background-color: #09f; color: #fff; border: none; display: block; clear: both; }


#mygroups #right .page-nav {height: 25px; width: 470px; clear: both; padding: 15px; background: #fff}
#mygroups #right .page-nav a:hover {text-decoration: underline;}
#mygroups #right .page-nav ul {float: left; width: 260px; font: 12px/25px Arial, sans-serif; list-style-type: none;}
#mygroups #right .page-nav li {float: left; padding: 2px 0; margin: 0 2px 0 0;}
#mygroups #right .page-nav li a {text-decoration: none; padding: 2px 6px; color: #09f; border: 1px solid #09f;}
#mygroups #right .page-nav li a.active {color: #999; border: 1px solid #999;}
#mygroups #right .page-nav p {float: right; text-align: right; width: 200px; line-height: 25px;}
#mygroups #right .page-nav p a {color: #09f; text-decoration: none;}
#mygroups #right .page-nav p a.disabled {color: #999;}
#mygroups #mtdiv { clear:both; height:20px; width: 775px;}
#mygroups #left #bottom a.disabled, #mygroups #left #bottom ul.disabled, #mygroups #right #no-group.disabled, #mygroups #right .group-block.disabled, #mygroups #right .page-nav.disabled {}