/**
 * stylesheet.module.myprofile.css
 * Clubbyclub module MyProfile stylesheet
 *
 * Works with: FF, IE6, IE7, Safari, Opera
 *
 * SOME RULES IF YOU EDIT THIS STYLESHEET:
 * #1		Try to keep it working for FF, IE6, IE7, Safari and Opera
 * #2		Try to use as less CSS hacks as possible! If you need to apply hacks, first try other ways of styling! The need to apply a lot of hacks is mostly caused by bad styling!
 * #3		Do not mix id's and classnames! id's should be unique names to elements, classnames to style!
 * #4		Keep things tidy
 * #5		Give the sheet a logical order
 * #6		Do not change the standard properties of items! (Like giving all divs a display : inline :S)
 */

/* MODULE */
div.moduleMyProfile
{
	width					: 440px;
}

/* MYPROFILE MENU  */
div.myProfileMenuBlock
{
	padding					: 0px;
	
}

div.myProfileMenuBlock ul
{
	text-transform 			: none;
	
	margin					: 0px;
	margin-top				: 10px;

	padding					: 0px;	
	padding-left			: 20px;
	
	list-style-type			: circle;
	list-style-image		: url('../graphics/icons/dot-orange.gif');
}

div.myProfileMenuBlock ul li.category
{
	margin-left				: -14px;
	
	list-style-type			: none;
	list-style-image		: none;
	
	font-weight				: bold;
}

div.myProfileMenuBlock ul a
{
	display					: block;
	
	padding-top				: 5px;
	
	_padding 				: 0;
	_margin-top 			: 5px;
	_height 				: 12px;
	
	text-decoration			: none;
}

div.myProfileMenuBlock a.active
{
	color					: #FF9900;
}

div.myProfileMenuBlock ul  li.active a
{
	color					: #FF9900;
}

div.myProfileMenuBlock span.details
{
	display					: block;
	width					: 100%;
	text-align				: center;
}

div.myProfileMenuBlock span.imageWrap
{
	display					: block;
	width					: 75px;
	height					: 75px;
	
	margin-left				: auto;
	margin-right			: auto;	
	
	background-color		: #000000;
}

div.myProfileMenuBlock span.ieFix
{
	_width					: 0; 
	_height					: 100%; 
	_display				: inline-block;
	_vertical-align			: middle;
}

*:first-child+html div.myProfileMenuBlock span.ieFix
{
	width					: 0; 
	height					: 100%; 
	display                 : inline-block;
	vertical-align			: middle;
}

div.myProfileMenuBlock span.image
{
	display					: table-cell;
	width					: 75px;
	height					: 75px;
			
	vertical-align			: middle;
	text-align				: center;
	
	_width					: 100%; 
	_height					: auto;
	_display				: inline-block;
	_margin-top				: -2px;
	_margin-bottom 			: -4px;
}

*:first-child+html div.myProfileMenuBlock span.image
{
	width					: 100%; 
	height					: auto;
	display					: inline-block;
	margin-top				: -2px;
	margin-bottom 			: -4px;
}

div.myProfileMenuBlock span.details font.small
{
	font-size				: 12px;
	color					: #000000;
}

/* MYPROFILE > GROUPS > GROUPS */
div.moduleMyProfileImoduleGroupsCaseGroups
{

}

div.moduleMyProfileImoduleGroupsCaseGroups span.detailsWrapper
{
	margin-top				: 5px;
	display					: block;
	width					: 98px;
	height					: 110px;
	text-align				: center;
	float					: left;
	margin-left				: 4px;
	margin-right			: 3px;

	_margin-top	 			: 0px;
	_margin-left 			: 3px;
	_margin-right 			: 3px;
    _width                  : 100px;

	word-wrap				: break-word;    
}

div.moduleMyProfileImoduleGroupsCaseGroups span.detailsWrapper a
{
	
}

div.moduleMyProfileImoduleGroupsCaseGroups span.details
{
	display					: block;
	width					: 75px;
	height					: 110px;
	text-align				: center;
	float 					: left;
}

div.moduleMyProfileImoduleGroupsCaseGroups span.imageWrap
{
	display					: block;
	width					: 75px;
	height					: 75px;
	
	margin-left				: auto;
	margin-right			: auto;		
	
	background-color		: #000000;
	
	cursor					: pointer;
}

div.moduleMyProfileImoduleGroupsCaseGroups span.ieFix
{
	_width					: 0; 
	_height					: 100%; 
	_display				: inline-block;
	_vertical-align			: middle;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseGroups span.ieFix
{
	width					: 0; 
	height					: 100%; 
	display					: inline-block;
	vertical-align			: middle;
}

div.moduleMyProfileImoduleGroupsCaseGroups span.image
{
	display					: table-cell;

	width					: 75px;
	height					: 75px;
		
	vertical-align			: middle;
	text-align				: center;
	
	cursor					: pointer;

	_width					: 100%; 
	_height					: auto;
	_display				: inline-block;
	_margin-top				: -2px;
	_margin-bottom 			: -4px;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseGroups span.image
{
	width					: 100%; 
	height					: auto;
	display					: inline-block;
	margin-top				: -2px;
	margin-bottom 			: -4px;
}

/* MYPROFILE > GROUPS > MANAGE */
div.moduleMyProfileImoduleGroupsCaseManage
{

}

div.moduleMyProfileImoduleGroupsCaseManage span.detailsWrapper
{
	margin-top				: 5px;
	display					: block;
	width					: 91px;
	height					: 110px;
	text-align				: center;
	float					: left;
	margin-left				: 10px;
	margin-right			: 5px;
	
	_margin-top	 			: 0px;
	_margin-left 			: 6px;
	_margin-right 			: 7px;
	
	word-wrap				: break-word;
}

div.moduleMyProfileImoduleGroupsCaseManage span.detailsWrapper a
{
    _float                  : right;
}

div.moduleMyProfileImoduleGroupsCaseManage span.details
{
	display					: block;
	width					: 75px;
	height					: 110px;
	text-align				: center;
	float 					: left;
}

div.moduleMyProfileImoduleGroupsCaseManage span.details a
{
    _text-align				: center;
}

div.moduleMyProfileImoduleGroupsCaseManage span.imageWrap
{
	float 					: left;
	display					: block;
	width					: 75px;
	height					: 75px;
	
	background-color		: #000000;
	
	cursor					: pointer;	
}

div.moduleMyProfileImoduleGroupsCaseManage span.ieFix
{
	_width					: 0; 
	_height					: 100%; 
	_display				: inline-block;
	_vertical-align			: middle;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseManage span.ieFix
{
	width					: 0; 
	height					: 100%; 
	display					: inline-block;
	vertical-align			: middle;
}

div.moduleMyProfileImoduleGroupsCaseManage span.image
{
	display					: table-cell;
	width					: 75px;
	height					: 75px;
	
	vertical-align			: middle;
	text-align				: center;
	
	cursor					: pointer;
	
	_width					: 100%; 
	_height					: auto;
	_display				: inline-block;	
	_margin-top				: -2px;
	_margin-bottom 			: -4px;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseManage span.image
{
	width					: 100%; 
	height					: auto;
	display					: inline-block;
	margin-top				: -2px;
	margin-bottom 			: -4px;
}

/* MYPROFILE > GROUPS > INVITES */
div.moduleMyProfileImoduleGroupsCaseInvites
{

}

div.moduleMyProfileImoduleGroupsCaseInvites span.invite
{
	display					: block;
	width					: 420px;
	height					: 110px;
}

div.moduleMyProfileImoduleGroupsCaseInvites span.details
{
	display					: block;
	width					: 75px;
	height					: 110px;
	text-align				: center;
	float 					: left;
}

div.moduleMyProfileImoduleGroupsCaseInvites span.imageWrap
{
	display					: block;
	width					: 75px;
	height					: 75px;

	margin-left				: auto;
	margin-right			: auto;

	background-color		: #000000;
}

div.moduleMyProfileImoduleGroupsCaseInvites span.ieFix
{
	_width					: 0;
	_height					: 100%;
	_display				: inline-block;
	_vertical-align			: middle;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseInvites span.ieFix
{
	width					: 0;
	height					: 100%;
	display                 : inline-block;
	vertical-align			: middle;
}

div.moduleMyProfileImoduleGroupsCaseInvites span.image
{
	display					: table-cell;
	width					: 75px;
	height					: 75px;

	vertical-align			: middle;
	text-align				: center;

	_width					: 100%;
	_height					: auto;
	_display				: inline-block;
	_margin-top				: -2px;
	_margin-bottom 			: -4px;
}

*:first-child+html div.moduleMyProfileImoduleGroupsCaseInvites span.image
{
	width					: 100%;
	height					: auto;
	display					: inline-block;
	margin-top				: -2px;
	margin-bottom 			: -4px;
}

div.moduleMyProfileImoduleGroupsCaseInvites span.actions
{
	display 				: block;
	margin-left				: 100px;
	vertical-align			: middle;
}

div.groupMembersMouseover
{
	display					: none;
	position				: absolute;
	background-color		: #FFFFFF;
}

/* MYPROFILE > PERSONALDETAILS > PROFILE */
div.moduleMyProfileImodulePersonalDetailsCaseProfile
{
}

div.moduleMyProfileImodulePersonalDetailsCaseProfile table
{
	width					: 100%;
}

div.moduleMyProfileImodulePersonalDetailsCaseProfile table th
{
	text-align				: left;
}

/* MYPROFILE > PERSONALDETAILS > PROFILE */
div.moduleMyProfileImodulePersonalDetailsCasePassword table
{
	width					: 100%;
}

/* MYPROFILE > PERSONALDETAILS > PICTURE */
div.moduleMyProfileImodulePersonalDetailsCasePicture
{
}

div.moduleMyProfileImodulePersonalDetailsCasePicture table
{
	width					: 100%;
}

div.moduleMyProfileImodulePersonalDetailsCasePicture td.image
{
	width					: 150px;
	height					: 150px;
	background-color		: #000000;
	vertical-align			: middle;
	text-align				: center;
}

div.moduleMyProfileImodulePersonalDetailsCasePicture td.image img
{
	vertical-align			: middle;
	text-align				: center;
}

div.moduleMyProfileImodulePersonalDetailsCasePicture div#progressBar
{
	display					: none;
}

/* MYPROFILE > TOOLS > SUGGESTIONS */
div.moduleMyProfileImoduleToolsCaseSuggestions textarea
{
    width                   : 352px;
    height                  : 200px;

    font-family				: Arial, Helvetica, sans-serif;
    font-size               : 12px;
}

/* MYPROFILE > TOOLS > TELLAFRIEND */
div.moduleMyProfileImoduleToolsCaseTellAFriend input
{
    width                   : 208px;
}

div.moduleMyProfileImoduleToolsCaseTellAFriend textarea
{
    width                   : 425px;
    height                  : 200px;

    font-family				: Arial, Helvetica, sans-serif;
    font-size               : 12px;
}