/* ----- Tab styles above tombstone information block ----- */
#groupTabs {width:485px; /*height:24px;*/ margin:0 0 16px 0; padding:0; /*border:1px solid #c2c2c0; border-left:0; border-right:0;*/ float:left;}
	#groupTabs ul {margin:3px 0 8px 0; padding:0 0 0 4px; text-transform:uppercase; float:left;}
	#groupTabs li {margin:1px 0 0 0; padding:0 0 0 2px; height:24px; list-style-type:none; /*display:inline;*/ float:left; /*border:1px solid #c2c2c0; border-left:0;*/}
	#groupTabs li a {margin:0 0 0 -4px; padding:5px 4px 5px 5px; height:14px; color:#2d648a; border:1px solid #c2c2c0; border-left:0; text-decoration:none;}
	#groupTabs li a:link, #groupTabs li a:visited {text-decoration:none; color:#2d648a;}
	#groupTabs li a:hover, #groupTabs li a:active, #groupTabs li a.current {text-decoration:none; color:#FFF; background-color:#2d648a;}


/* ----- group pages ----- */
#usergroupContainer {margin-top:20px;}
	#usergroupContainer h2 {font-size:16px; margin:5px 0 0 0; padding:0;}
#usergroupAvatarContainer {float:left;}
#usergroupDetailContainer {clear:left;}
#usergroupDescriptionContainer {float:left; padding:0 0 10px 0; border-bottom:1px dotted #2d648a; margin-bottom:6px; width:100%;}
	#usergroupDescriptionContainer p {margin:0; padding:0; float:left;}
	#usergroupRelationshipContainer {clear:left;}


/* ACTIVITY STREAM content */
/* in this example the activity stream column is to the LEFT of a narrower column
   that containts the GROUPS LIST and FRIENDS LIST ... if required, 
   this div can be made the full 570 wide and have the float:left; removed
   so that the div with the small groups list div and friends list div can be moved
   below this area ... note that in MOST CASES the activity stream content is MORE IMPORTANT
   for a user than the group list and activity list ... add font styles as needed */

/* for a two column page */
#actionLogContainer {float:left; margin:0 10px 0 0; padding:0; width:485px;}
#actionLogContainer .actionLogIcon {display:none;}
#actionLogContainer #actionLogItemSummary {float:left; clear:left;}
	#actionLogContainer ul {margin:0; padding:0;}
	#actionLogContainer li {margin:0; padding:8px 5px; list-style-type:none; list-style-position:inside;}
		#actionLogContainer li .heading {/*font-weight:bold; font-size:12px;*/}
		#actionLogContainer li .heading a {text-decoration:none;} /* in case you want to make the headline link a different color */
		#actionLogContainer li .actionLogTitle {padding-left:7px; margin-top:2px;}
		#actionLogContainer li .date {color:#999;}
		#actionLogContainer li a {color:#3784aa; text-decoration:underline; font-weight:normal;}
		#actionLogContainer li img {width:50px; height:50px; border:1px solid #c2c2c2; margin:8px 5px 0 0;}
			#actionLogContainer img a {border:0;}
   	#actionLogContainer .even {background-color:#FFF;} /* alternating row style for every second one if needed */


/******************************************************************************
    Group lising page
******************************************************************************/
#usergroupContainer ul.usergroupList {margin:0 0 5px 0; padding:0; font:11px/10px Arial, Helvetica, sans-serif; color:#2d648a;}
#usergroupContainer ul li {text-align:left; margin:0; padding:7px 0 8px 10px; border-bottom:1px solid #3784aa; width:475px; font:12px/15px Arial, Helvetica, Geneva, san-serif; list-style-type:none; list-style-position:inside; float:left; clear:left;}
#usergroupContainer ul li a {font:12px Arial, Helvetica, Geneva, san-serif; float:left; clear:left; margin:0; color:#3784aa;}
#usergroupContainer .usergroupIcon { float: left; margin:0 5px 5px 0; }
#usergroupContainer .usergroupName {float:left; clear:left;}
#usergroupContainer .usergroupDescription {float:left; clear:left; margin:0; padding:0;}

#usergroupMemberListContainer ul {margin:8px 0 0 5px; padding:0;}
#usergroupMemberListContainer ul li {margin:0; padding:3px 0 2px 0; border-bottom:1px dotted #3784aa;}


li.usergroupMinimal { display: inline; margin-left: 10px; }
li.usergroupMinimal a img.usergroupIcon { display: inline; }
li.usergroupMinimal a p.usergroupName { display: inline; }
li.usergroupMinimal a p.usergroupDescription { display: none;  }
li.usergroupMinimal a p.usergroupMemberCount { display: none;  }

/******************************************************************************
    Group details page
******************************************************************************/
#usergroupAvatarImage { float: left; margin: 0 10px 7px 0px; border:1px solid #2d648a;}
#usergroupMemberListContainer { clear: both; }
#usergroupMemberListContainer h2 {margin-left:5px;}

/* ----- Media contributions ----- */
.mediaTypesHeader {font:16px Arial, Helvetica, sans-serif; font-weight:bold; margin:25px 0 6px 8px; padding:0; clear:left;}

/** PHOTOS **/
.member .member-profile-content h2.mediaTitle {color:#2d648a; font-size:12px; margin:0; padding:0;}
.member-profile-content .byline {margin:-12px 0 0 0; padding:0;}
#comments p.meta {margin:6px 0 0 0; padding:0; color:#000;}
#comments .comment {border-bottom: 1px dotted #2d648a;}
 
#photo-container{ float:left; margin-bottom:12px;}
#photo-container a.photo{  float: left; margin-left: 6px; }
#photo-container a.photo img{  padding: 2px; border: 1px solid #ccc; width: 70px; height: 70px; }

#add-photo-container, #add-video-container, #add-blog-container {float:left; clear:left; margin:0 0 16px 0; padding:10px; border:1px dotted #2d648a; width:485px;}

#add-photo-container label, #add-video-container label, #add-blog-container label {margin:6px 0 0 0;}
#add-photo-container select, #add-video-container select, #add-blog-container select {margin:0 6px 0 0;}
#add-photo-container input, #add-video-container input, #add-blog-container input {margin:0 6px 0 0;}

/** VIDEOS ... basically the same as photos **/
#video-container{ float:left; margin-bottom:12px;}
#video-container a.video{  float: left; margin-left: 6px; }
#video-container a.video img{  padding: 2px; border: 1px solid #ccc; width: 100px; height: 75px; }

#video-player-container{  }
#video-player-container object{ width: 485px; /*height: 485px;*/ padding: 4px; }

/** BLOGS ... basically the same as photos **/
#blog-container{ float:left; margin-bottom:12px;}
#blog-container ul li a{ float:none;}

#blog-player-container{  }
#blog-player-container object{ width: 485px; padding: 4px; }

/** VIDEOS ... basically the same as photos **/
#video-container{  }
#video-container a.video{  float: left; margin-left: 6px; }
#video-container a.video img{  padding: 2px; border: 1px solid #ccc; width: 100px; height: 75px; }

#video-player-container{  }
#video-player-container object{ width: 485px; padding: 4px; }