@charset "UTF-8";
/* Prevent override of jQuery Fancybox */
.fancybox-title-inside {
    position: absolute;
    top: 3px;
    left: 10px;
    padding: 10px 30px;
}

.fancybox-title-outside {
    position: absolute;
    padding-top: 5px;
}

.fancybox-title-over {
    position: absolute;
}

.fancy-bg {
    position: absolute;
    padding: 0;
    margin: 0;
    border: 0;
    width: 20px;
    height: 20px;
    z-index: 1001;
}

/*Jon Cheng's stab at reusable css*/
.vertical_center{
   margin: 0 auto;
}

/* layout.css */
#wrapper {
	width: 100%;
	margin: 0 auto -280px;
}

/* General Rules */

.clear {
	clear: both;
}

.clearNone {
	clear: none;
}

p.footnote {
   width: 96%;
   margin: 10px auto;
}

.dividerWhite {
	background: url(../images/divider-white.png) no-repeat 0 0;
	width: 1px;
	height: 14px;
	margin: 0 10px;
}

.dividerWhite.friendsHide {
	display: none;
}

.dividerWhite.left {
	float: left;
}

.dividerWhite.right {
	float: right;
}

.noneContainer .mainText span {
   position: absolute;
   width: 100%;
   height: 31px;
}

.fitnessClassHeader span {
   position: absolute;
   width: 495px;
   height: 27px;
}

.profile #leftColumn .username span {
   position: absolute;
   width: 100%;
   height: 31px;
}

.profile #leftColumn .username span.setUsername {
   position: relative;
}

/* Custom Elements - CLEAN ME UP */

/* toggle */

.toggleItem {
	display: inline;
	float: left;
	padding: 2px 4px;
	cursor: pointer;
	margin: 0;
	background: rgb(246,246,246); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(246,246,246,1) 0%, rgba(233,233,233,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,246,246,1)), color-stop(100%,rgba(233,233,233,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(233,233,233,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(233,233,233,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(233,233,233,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(246,246,246,1) 0%,rgba(233,233,233,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#e9e9e9',GradientType=0 ); /* IE6-9 */
	color:#444;
	text-shadow: 0px 1px 2px #FFFFFF;
    filter: dropshadow(color=#FFFFFF, offx=0, offy=1);
	text-align: center;
}

.toggleItem.selected,
.toggleItem.selected:hover {
	background-color:#ccc;
	cursor: default;
	color:#fff;
}

.toggleItem.left {
	margin-left: 4px;
	padding: 2px 4px 2px 2px;
	position: relative;
}

.toggleItem.left .toggleCap {
	position: absolute;
	top: 0;
	left: -4px;
	width: 4px;
	height: 20px;
	background: url(../images/toggle-l-small.png) no-repeat 0 0;
}

.toggleItem.left:hover .toggleCap {background: url(../images/toggle-l-small.png) no-repeat  0 -20px;}
.toggleItem.left:active .toggleCap {background: url(../images/toggle-l-small.png) no-repeat  0 -40px;}

.toggleItem.left.selected .toggleCap,
.toggleItem.left.selected:hover .toggleCap {
	background: url(../images/toggle-l-small-selected.png) 0 0;
}

.toggleItem.right {
	margin-right: 2px;
	padding: 2px;
	position: relative;
}

.toggleItem.right .toggleCap {
	position: absolute;
	top: 0;
	right: -4px;
	width: 4px;
	height: 20px;
	background: url(../images/toggle-r-small.png) no-repeat 0 0;
}

.toggleItem.right:hover .toggleCap {background: url(../images/toggle-r-small.png) no-repeat  0 -20px;}
.toggleItem.right:active .toggleCap {background: url(../images/toggle-r-small.png) no-repeat  0 -40px;}
.toggleItem.right.selected .toggleCap,
.toggleItem.right.selected:hover .toggleCap {background: url(../images/toggle-r-small-selected.png) 0 0;}

.toggleDivider {
	display: inline;
	float: left;
	background: url(../images/toggle-small-divider.png) no-repeat 0 0;
	width: 1px;
	height: 16px;
	margin: 0;
	padding: 2px 0;
}

.toggleTextMain {
	display: inline;
	vertical-align: middle;
	position: relative;
	margin: 0 2px;
}

.toggleTextSecondary {
	display: inline;
	position: relative;
	top: -3px;
}

.toggleArrow {
	background: url(../images/dropdownArrowGrey.png) no-repeat 0 0;
	display: block;
	width: 16px;
	height: 16px;
}

.selected .toggleArrow {
	background: url(../images/dropdownArrowWhite.png);
}

/* checkbox */

.checkbox {
   height: 20px;
   position: relative;
}

.checkbox .toggleItem {
	display: inline;
	float: left;
	background: url(../images/toggle-m-small.png) repeat-x 0 0;
	height: 20px;
	width: 12px;
	cursor: pointer;
	margin: 0;
	padding: 0;
	position: relative;
}

.checkbox:hover {
   cursor: pointer;
}

.checkbox:hover .toggleItem {background: url(../images/toggle-m-small.png) repeat-x 0 -20px;}
.checkbox:active .toggleItem {background: url(../images/toggle-m-small.png) repeat-x 0 -40px;}
.checkbox.selected .toggleItem {background: url(../images/toggle-m-small-selected.png) repeat-x 0 0;}

.checkbox .toggleTextMain {
	width: 16px;
	height: 16px;
	position: absolute;
	display: block;
	margin: 0;
	top: 2px;
	left: -1px;
	z-index: 20;
}

.checkbox.selected .toggleItem .toggleTextMain {background: url(../images/toggleCheckmark.png) no-repeat 0 0;}

.checkbox .toggleCapLeft {
	position: absolute;
	top: 0;
	left: -4px;
	width: 4px;
	height: 20px;
	background: url(../images/toggle-l-small.png) no-repeat 0 0;
}

.checkbox:hover .toggleCapLeft {background: url(../images/toggle-l-small.png) no-repeat  0 -20px;}
.checkbox:active .toggleCapLeft {background: url(../images/toggle-l-small.png) no-repeat  0 -40px;}
.checkbox.selected .toggleCapLeft,
.checkbox.selected:hover .toggleCapLeft {background: url(../images/toggle-l-small-selected.png) 0 0;}

.checkbox .toggleCapRight {
	position: absolute;
	top: 0;
	right: -4px;
	width: 4px;
	height: 20px;
	background: url(../images/toggle-r-small.png) no-repeat 0 0;
}

.checkbox:hover .toggleCapRight {background: url(../images/toggle-r-small.png) no-repeat  0 -20px;}
.checkbox:active .toggleCapRight {background: url(../images/toggle-r-small.png) no-repeat  0 -40px;}
.checkbox.selected .toggleCapRight,
.checkbox.selected:hover .toggleCapRight {background: url(../images/toggle-r-small-selected.png) 0 0;}

.checkbox .checkboxText {
   margin-left: 20px;
   position: relative;
   top: 3px;
}

/* greyBox */

.greyBox {
	position: relative;
}

.greyBorder {
	z-index: 10;
}


/* greyBox w/ shadow */

.greyBorder.shadow.tl {
	background: url(../images/greyBorder-tls.png) no-repeat 0 0;
}

.greyBorder.shadow.t {
	background: url(../images/greyBorder-ts.png) repeat-x 0 0;
	height: 6px;
}

.greyBorder.shadow.tr {
	background: url(../images/greyBorder-trs.png) no-repeat 0 0;
}

.greyBorder.shadow.r {
	background: url(../images/greyBorder-rs.png) repeat-y 0 0;
	width: 5px;
}

.greyBorder.shadow.br {
	background: url(../images/greyBorder-brs.png) no-repeat 0 0;
}

.greyBorder.shadow.b {
	background: url(../images/greyBorder-bs.png) repeat-x 0 0;
	height: 6px;
}

.greyBorder.shadow.bl {
	background: url(../images/greyBorder-bls.png) no-repeat 0 0;
}

.greyBorder.shadow.l {
	background: url(../images/greyBorder-ls.png) repeat-y 0 0;
	width: 5px;
}

/* blackBox */

.blackBox {
	position: relative;
}

.blackBox-content {
	background: url(../images/blackBox-m.png) repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	margin: 10px 0;
}

.blackBox-tl {
	background: url(../images/blackBox-tl.png) no-repeat 0 0;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 0;
	left: 0;
}

.blackBox-t {
	background: url(../images/blackBox-m.png) repeat 0 0;
	height: 10px;
	position: absolute;
	top: 0;
	margin: 0 10px;
}

.blackBox-tr {
	background: url(../images/blackBox-tr.png) no-repeat 0 0;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 0;
	right: 0;
}

.blackBox-br {
	background: url(../images/blackBox-br.png) no-repeat 0 0;
	width: 10px;
	height: 10px;
	position: absolute;
	bottom: 0;
	right: 0;
}

.blackBox-b {
	background: url(../images/blackBox-m.png) repeat 0 0;
	height: 10px;
	position: absolute;
	bottom: 0;
	margin: 0 10px;
}

.blackBox-bl {
	background: url(../images/blackBox-bl.png) no-repeat 0 0;
	width: 10px;
	height: 10px;
	position: absolute;
	bottom: 0;
	left: 0;
}

/* shadowBox */

.shadowBoxContainer {
	position: relative;
	background-color: #ffffff;
	border-radius:15px;
}

.shadowBox-bg {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 5;
}

.shadowBox {
	z-index: 10;
}

.shadowBoxContent {
	position: relative;
	z-index: 20;
}

.shadowBoxContent.dialog {
	position: relative;
	z-index: 20;
}


.shadowBoxContent.dialog h3 {
	width: 288px;
}

.shadowBoxContent h3 div {
	float: right;
	position: relative;
	top: 2px;
}

.shadowBoxContent input[type="file"] {
   width: 288px;
}

.shadowBox.tl {
	background: url(../images/shadowBox-tl.png) no-repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	height: 20px;
}

.shadowBox.t {
	background: url(../images/shadowBox-t.png) repeat-x 0 0;
	position: absolute;
	height: 20px;
	margin: 0 20px;
	top: 0;
	left: 0;
}

.shadowBox.tr {
	background: url(../images/shadowBox-tr.png) no-repeat 0 0;
	position: absolute;
	top: 0;
	right: 0;
	width: 20px;
	height: 20px;
}

.shadowBox.r {
	background: url(../images/shadowBox-r.png) repeat-y 0 0;
	position: absolute;
	top: 20px;
	right: 0;
	width: 20px;
}

.shadowBox.br {
	background: url(../images/shadowBox-br.png) no-repeat 0 0;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 20px;
	height: 20px;
}

.shadowBox.b {
	background: url(../images/shadowBox-b.png) repeat-x 0 0;
	position: absolute;
	bottom: 0;
	height: 20px;
	margin: 0 20px;
	left: 0;
}

.shadowBox.bl {
	background: url(../images/shadowBox-bl.png) no-repeat 0 0;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 20px;
	height: 20px;
}

.shadowBox.l {
	background: url(../images/shadowBox-l.png) repeat-y 0 0;
	position: absolute;
	top: 20px;
	left: 0;
	width: 20px;
}

.shadowBoxContainer.arrowTop .shadowBoxArrow {
	background: url(../images/shadowBox-arrow-top.png) no-repeat 0 0;
	position: absolute;
	top: -13px;
	left: 100px;
	width: 45px;
	height: 22px;
	z-index: 12;
}

.shadowBoxContainer.arrowRight .shadowBoxArrow {
	background: url(../images/shadowBox-arrow-right.png) no-repeat 0 0;
	position: absolute;
	top: 30px;
	right: -12px;
	width: 25px;
	height: 46px;
	z-index: 12;
}

.shadowBoxContainer.arrowBottom .shadowBoxArrow {
	background: url(../images/shadowBox-arrow-bottom.png) no-repeat 0 0;
	position: absolute;
	bottom: -16px;
	left: 170px;
	width: 49px;
	height: 25px;
	z-index: 12;
}

.shadowBoxContainer.arrowLeft .shadowBoxArrow {
	background: url(../images/shadowBox-arrow-left.png) no-repeat 0 0;
	position: absolute;
	top: 30px;
	left: -12px;
	width: 21px;
	height: 40px;
	z-index: 12;
}

/* Step Selector */

.steps {
	position: relative;
	height: 30px;
	width:560px;
	margin: 7px auto 17px auto;
}

.stepSelector-medium {
	position: relative;
	float: right;
	height: 30px;
	font-weight:bold;
	color:#666;
}
.stepSelector-medium.skipIt {
	opacity:.3;
}

.stepSelector-medium:hover {
	cursor: pointer;
}

.stepSelector-medium .l {
	background: url(../images/stepSelector-left.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	left: 0;
	width: 15px;
	height: 30px;
}

.stepSelector-medium:hover .l {
	background: url(../images/stepSelector-left.png) no-repeat 0 -30px;
}

.stepSelector-medium:active .l {
	background: url(../images/stepSelector-left.png) no-repeat 0 0;
}

.stepSelector-medium.selected .l {
	background: url(../images/stepSelector-left.png) no-repeat 0 -90px;
}

.stepSelector-medium .m {
	background: url(../images/stepSelector-middle.png) repeat-x 0 -60px;
	margin: 0 15px;
	height: 30px;
}

.stepSelector-medium:hover .m {
	background: url(../images/stepSelector-middle.png) repeat-x 0 -30px;
}

.stepSelector-medium:active .m {
	background: url(../images/stepSelector-middle.png) repeat-x 0 0;
}

.stepSelector-medium.selected .m {
	background: url(../images/stepSelector-middle.png) repeat-x 0 -90px;
}

.stepSelector-medium .m .mainText {
	position: relative;
	line-height:30px;
	color:#fff;
}

h3 .stepSelector-medium .m .mainText span {
   position: relative;
   width: inherit;
   height: inherit;
   background: none;
}

.stepSelector-medium .r {
	background: url(../images/stepSelector-right.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	right: 0;
	width: 15px;
	height: 30px;
}

.stepSelector-medium:hover .r {
	background: url(../images/stepSelector-right.png) no-repeat 0 -30px;
}

.stepSelector-medium:active .r {
	background: url(../images/stepSelector-right.png) no-repeat 0 0;
}

.stepSelector-medium.selected .r {
	background: url(../images/stepSelector-right.png) no-repeat 0 -90px;
}

.stepSelector-medium.left .m {
	margin: 0 16px 0 15px;
}

.stepSelector-medium.left .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	right: 0;
	width: 16px;
	height: 30px;
}

.stepSelector-medium.left:hover .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -30px;
}

.stepSelector-medium.left:active .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 0;
}

.stepSelector-medium.left.selected .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -90px;
}

.stepSelector-medium.middle .m {
	margin: 0 16px 0 8px;
}

.stepSelector-medium.middle .m .mainText {
	position: relative;
	left: 3px;
	z-index: 20;
	margin-right: 4px;
}

.stepSelector-medium.middle .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	right: 0;
	width: 16px;
	height: 30px;
}

.stepSelector-medium.middle:hover .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -30px;
}

.stepSelector-medium.middle:active .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 0;
}

.stepSelector-medium.middle.selected .r {
	background: url(../images/stepSelector-dividerRight.png) no-repeat 0 -90px;
}

.stepSelector-medium.middle .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	left: -10px;
	width: 18px;
	height: 30px;
}

.stepSelector-medium.middle:hover .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -30px;
}

.stepSelector-medium.middle:active .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 0;
}

.stepSelector-medium.middle.selected .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -90px;
}

.stepSelector-medium.right .m {
	margin: 0 15px 0 8px;
}

.stepSelector-medium.right .m .mainText {
	position: relative;
	left: 4px;
	z-index: 20;
}

.stepSelector-medium.right .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -60px;
	position: absolute;
	top: 0;
	left: -10px;
	width: 18px;
	height: 30px;
}

.stepSelector-medium.right:hover .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -30px;
}

.stepSelector-medium.right:active .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 0;
}

.stepSelector-medium.right.selected .l {
	background: url(../images/stepSelector-dividerLeft.png) no-repeat 0 -90px;
}

.stepSelector-medium.left.selected,
.stepSelector-medium.middle.selected,
.stepSelector-medium.right.selected {
	cursor: default;
}

/* notification bar */

#notificationBar {
   display: none;
   position: fixed;
   bottom: -111px;
   opacity: 0.0;
   left: 0;
   width: 100%;
   height: 111px;
   background: url(../images/growl-bg.png) repeat-x 0 0;
   z-index: 10000;
}

#notificationBar:hover {
   background: url(../images/growl-bg.png) repeat-x 0 -111px;
   cursor: pointer;
}

#notificationBar:active {
   background: url(../images/growl-bg.png) repeat-x 0 -222px;
   cursor: pointer;
}

#notificationContent {
   height: 100px;
   display: block;
   margin: 11px 0 0 0;
   padding: 0 50px;
   position: relative;
}

#notificationContent .icon {
   width: 64px;
   height: 63px;
   display: block;
   float: left;
   margin-right: 24px;
   position: relative;
   top: 18px;
   left: 0;
}

#notificationContent.success .icon {
   background: url(../images/icon-notificationSuccess.png) no-repeat 0 0;
}

#notificationContent.error .icon {
   background: url(../images/icon-notificationError.png) no-repeat 0 0;
}

#notificationContent.message .icon {
   background: url(../images/icon-notificationMessage.png) no-repeat 0 0;
}

#notificationContent .mainText {
	line-height:100px;	
	margin:0;
}
#notificationContent .mainText.hasSubText {
	line-height:50px;
}

#notificationContent .subText {
   	position: relative;
}

#notificationContent .action {
   width: 41px;
   height: 41px;
   display: block;
   float: right;
   position: relative;
   top: 31px;
   left: 0;
   background: url(../images/icon-notificationClose.png) no-repeat 0 0;
}

#notificationContent.message .action {
   background: url(../images/icon-notificationAction.png) no-repeat 0 0;
}

/* Notification */

#notificationBox {
	display: none;
	width: 980px;
	margin: 0 auto;
	z-index: 50;
	height: 34px;
}

#notification {
	display: none;
	position: relative;
	float: right;
	z-index: 50;
	height: 34px;
}

#notification .l {
	background: url(../images/notification-l.png) no-repeat 0 -6px;
	width: 13px;
	height: 34px;
	position: absolute;
	top: 0;
	left: 0;
}

#notification .m {
	background: url(../images/notification-m.png) repeat-x 0 -6px;
	height: 34px;
	margin: 0 13px;
}

#notification .m .icon {
	width: 24px;
	height: 24px;
	margin-right: 5px;
	position: relative;
	top: 2px;
	left: -2px;
	float: left;
}

#notification.success .m .icon {
	background: url(../images/notification-success.png) no-repeat 0 0;
}

#notification.error .m .icon {
	background: url(../images/notification-error.png) no-repeat 0 0;
}

#notification.warning .m .icon {
	background: url(../images/notification-warning.png) no-repeat 0 0;
}

#notification.warning {
	width: 980px;
}

#notification.warning #resendEmailLink {
	float: right;
	display: block;
	position: relative;
	top: 6px;
	z-index: 40;
	margin-right: 4px;
}

#notification.success #resendEmailLink {
	display: none;
}

#notification.error #resendEmailLink {
	display: none;
}

#notification .m .mainText {
	position: relative;
	top: 6px;
	float: left;
	z-index: 40;
	margin-right: 4px;
}

#notification .r {
	background: url(../images/notification-r.png) no-repeat 0 -6px;
	width: 13px;
	height: 34px;
	position: absolute;
	top: 0;
	right: 0;
}

/* Profile Navigation */
.profileBoxSmall {
	width: 230px;
	margin: 0 20px 0 0;
	float: left;
}

.avatar img {
	width:100%;
}

.avatarContainer {
   position: relative;
   float: left;
}

.avatarContainer img.eliteImg {
   position: absolute;
   right: 1px;
   bottom: 2px;
}

.avatarSmall {
	float: left;
	margin-right: 15px;
	position: relative;
	z-index: 10;
	overflow: hidden;
	border: none;
}

.avatarSmall a {
	height: 0px;
	padding: 0;
	margin: 0;
}

.profileBoxText {
   float: left;
}

.profileBoxSmall .username {
	position: relative;
	text-overflow: ellipsis;
}

.profile .profileBoxSmall .username {
	margin-top: 3px;
}

.profileBoxSmall .username.smallText {
	top: 4px;
	margin-bottom: 4px;
}

.profileBoxSmall .username.extraSmallText {
	top: 4px;
	margin-bottom: 4px;
}

.profileBoxSmall #monthlyActivities {
	position: relative;
	top: 14px;
	text-overflow: ellipsis;
	white-space: nowrap;
	position: absolute;
	top: 34px;
	left: 65px;
}

.icon-elite.small {
   display: block;
   position: absolute;
   bottom: 5px;
   right: 3px;
   width: 25px;
   height: 13px;  
   z-index: 10;
}

.profileBoxSmall .icon-elite.small {
   bottom: 10px;
}

.icon-elite.normal {
   display: block;
   position: absolute;
   bottom: 6px;
   right: 2px;
   width: 58px;
   height: 29px;  
}

#profileDropdownBox .icon-elite {
   display: none;  
}

#postActivityButton {
	float: left;
	position: absolute;
	top: 5px;
	right: 0px;
	z-index: 10;
}
#activityDetailSummary h2 {
	line-height:65px;
	margin:0;
	padding:0;
}

/* Main Content */

.twoColumn #leftColumn {
	width: 230px;
	margin: 0 20px 0 0;
	float: left;
	clear: left;
	position: relative;
}
.twoColumn #mainColumn {
	margin: 0;
	float: left;
}
.twoColumn #rightColumn {
	display: none;
}
.twoColumnRight.thin #leftColumn {
	display: none;
}

.twoColumnRight.thin #mainColumn {
	width: 440px;
	margin: 0;
	float: left;
}

.twoColumnRight.thin #rightColumn {
	width: 200px;
	margin: 0 0 0 30px;
	float: left;
	position: relative;
}
.twoColumn.thin #leftColumn {
	width: 200px;
	margin: 0 40px 0 0;
	float: left;
	clear: left;
	position: relative;
}
.twoColumn.thin #mainColumn {
	margin: 0;
	float: left;
}

.threeColumn #leftColumn {
	width: 200px;
	margin: 0 10px 0 0;
	float: left;
}

.threeColumn #mainColumn {
	width: 230px;
	margin: 0;
	float: left;
}

.threeColumn #rightColumn {
	width: 200px;
	margin: 0 0 0 10px;
	float: right;
}

#subContent {
	background: url(../images/subContent-bg.png) repeat 0 0;
	width: 100%;
	position: relative;
	margin: -90px 0 0 0;
}

#subContentTop {
	background: url(../images/subContent-bg-top.png) repeat-x 0 0;
	width: 100%;
	position: relative;
	min-height: 500px;
}

#subContentBody {
	width: 990px;
	position: relative;
	top: 150px;
	margin: 0 auto 150px auto;
}

.leftListContainer {
   margin: 0;
   background: #FFF;
   padding: 8px 0;
}

.leftListItem {
   margin: 0;
   padding: 5px;
   position: relative;
}

.leftListItem:hover {
   background: #EEE;
   cursor: pointer;
}

.leftListItem .icon {
   width: 25px;
   height: 25px;
   margin-right: 10px;
   float: left;
}

.leftListItem .icon img {
   width: 25px;
   height: 25px;
}

.warningLightboxSelectionList .warningLightboxSelectionItem.leftListItem .icon img,
.friends .leftListItem .icon img {
   width: 50px;
   height: 50px;
}

.profile .leftListItem .icon {
   width: 50px;
   height: 50px;
   margin-right: 10px;
   float: left;
}

.leftListItem .mainDetailsBox .leftListArrow {
   background: url("../../oceanus/images/disclosure_arrow_small.png") no-repeat scroll 0 0 transparent;
   margin-top: -6px;
   position: absolute;
   right: 10px;
   top: 50%;
   width: 9px;
   height: 14px;
}

.leftListItem .leftListText {
   width: 130px;
   float: left;
}

.profile .leftListItem .leftListText {
   width: 100px;
   float: left;
}

.warningLightboxSelectionList .warningLightboxSelectionItem.leftListItem .leftListText {
   width: 270px;
   float: left;
}

.leftListItem .leftListText .mainText {
   margin-bottom: 5px;
}

.leftListItem .leftListText .subText {
   margin-bottom: 4px;
}

.leftListItem .leftListText .subText.date {
   margin-bottom: 0;
}

.leftListContainer .border {
   border-top: 1px solid #EEEEEE;
   height: 1px;
   margin: 8px 0;
}

/* Lightbox */

/* popout */

.popout-tl {
   background: url(../images/popout-tl.png) no-repeat 0 0;
   width: 23px;
   height: 23px;
}

.popout-t {
   background: url(../images/popout-t.png) repeat-x 0 0;
   height: 23px;
}

.popout-tr {
   background: url(../images/popout-tr.png) no-repeat 0 0;
   width: 23px;
   height: 23px;
}

.popout-r {
   background: url(../images/popout-r.png) repeat-y 0 0;
   width: 23px;
}

.popout-br {
   background: url(../images/popout-br.png) no-repeat 0 0;
   width: 23px;
   height: 23px;
}

.popout-b {
   background: url(../images/popout-b.png) repeat-x 0 0;
   height: 23px;
}

.popout-bl {
   background: url(../images/popout-bl.png) no-repeat 0 0;
   width: 23px;
   height: 23px;
}

.popout-l {
   background: url(../images/popout-l.png) repeat-y 0 0;
   width: 23px;
}

/* Footer */

#push {
	height: 310px; /* .push must be the same height as .footer */
	clear: both;
}

.socialIcon.twitter {
	background: url(../images/icon-twitter-20.png) no-repeat 0 0;
}

.socialIcon.twitter:hover {
	background: url(../images/icon-twitter-20.png) no-repeat 0 -20px;
}

.socialIcon.twitter:active {
	background: url(../images/icon-twitter-20.png) no-repeat 0 -40px;
}

.socialIcon.facebook {
	background: url(../images/icon-facebook-20.png) no-repeat 0 0;
}

.socialIcon.facebook:hover {
	background: url(../images/icon-facebook-20.png) no-repeat 0 -20px;
}

.socialIcon.facebook:active {
	background: url(../images/icon-facebook-20.png) no-repeat 0 -40px;
}

p.empty span {
   display: block;
   margin-bottom: 8px;
}

#popup_cancel.blueButton-medium .m .mainText {
   top: 6px;
}

/* Welcome */

#welcome {
	background: #EDF5FC;
	border: 1px solid #369;
	padding: 10px;
	width: 950px;
	margin: 20px auto;
	position: relative;
}

#welcome h3 {
	border-bottom: none;
	margin-top: 16px;
}

#welcome .icon {
	width: 200px;
	height: 200px;
	float: left;
	margin-right: 20px;
}

#welcomeClose {
	display: block;
	position: absolute;
	top: 10px;
	right: 10px;
}

textarea {
   border: 2px solid #eeeeee;
}

.wrapper-bg-top {
   background: url(../images/wrapper-bg-top.png) repeat-x 0 0;
   position: absolute;
   top: 54px;
   left: 0;
   width: 100%;
   height: 30px;
}

.wrapper-bg-top.loggedout {
   top: 115px;
}

.wrapper-bg-bottom {
   background: url(../images/wrapper-bg-bottom.png) repeat-x 0 0;
   position: absolute;
   bottom: -70px;
   left: 0;
   width: 100%;
   height: 30px;
}

/* Raised Header */

.raisedHeaderContainer {
	height: 29px;
	background: url(../images/pNav-bg.png) repeat-x 0 2px;
	position: relative;
}

.raisedHeaderLeft {
	display: block;
	background: url(../images/homeNav-bg-l.png) no-repeat 0 0;
	position: absolute;
	bottom: 0;
	left: -15px;
	height: 27px;
	width: 50px;
}

.raisedHeaderRight {
	background: url(../images/homeNav-bg-r.png) no-repeat 0 0;
	position: absolute;
	bottom: 0;
	right: -15px;
	height: 27px;
	width: 50px;
}

.raisedHeaderMiddle {
	height: 29px;
}

/* .progressBar */

.progressBar {
   position: relative;
}

.progressBar.garmin {
   width: 240px;
   height: 37px;
   margin: 20px auto;
}

.progressBar .container {
   width: 100%;
   position: absolute;
   z-index: 200;
   height: 37px;
}

.progressBar .container .l {
   background: url(../images/progressBarContainer-l.png) no-repeat 0 0;
   width: 20px;
   height: 37px;
   position: absolute;
   top: 0;
   left: 0;
}

.progressBar .container .m {
   background: url(../images/progressBarContainer-m.png) repeat-x 0 0;
   width: 200px;
   margin: 0 20px;
   height: 37px;
}

.progressBar .container .r {
   background: url(../images/progressBarContainer-r.png) no-repeat 0 0;
   width: 20px;
   height: 37px;
   position: absolute;
   top: 0;
   right: 0;
}

.progressBar .bar {
   width: 100%;
   position: absolute;
   z-index: 200;
   height: 37px;
}

.progressBar .bar .l {
   background: url(../images/progressBar-l.png) no-repeat 0 0;
   width: 20px;
   height: 37px;
   float: left;
}

.progressBar .bar .m {
   background: url(../images/progressBar-m.png) repeat-x 0 0;
   width: 0px;
   height: 37px;
   float: left;
}

.progressBar .bar .r {
   background: url(../images/progressBar-r.png) no-repeat 0 0;
   width: 20px;
   height: 37px;
   float: left;
}

.notViewable .actions {
   width: 770px;
   float: left;
   clear: none;
}

.viewableBox {
   width: 970px;
   margin: 40px auto 20px;
}

.viewableBox .icon {
   width: 150px;
   height: 150px;
   float: left;
   margin-right: 50px;
}

.reportNotViewable .viewableBox {
	width:auto;
	margin:0;
}

.reportNotViewable .viewableBox .icon {
	width:40px;
	height:40px;
	margin-right:50px;
}
.notViewable .actions p {
   float: left;
}

.notViewable .actions a {
   position: relative;
}

.notViewable .actions p.signup {
   margin-bottom: 10px;
}

.notViewable .actions forms input[type='submit'] {
   background: none;
   border: 0;
   cursor: pointer;
   color: #1596D2;
   font-size: 13px;
}

.fitnessClass .noneContainer .mainText {
   margin: 30px 0;
}

.fitnessClass .noneContainer .subText {
   margin-top: 30px;
}

/* Ensure Facebook Connect Styling */
#ensureFacebookConnect {
	width: 350px;
	height: 140px;
	visibility: hidden;
}
#fancybox-inner #ensureFacebookConnect {
	visibility: visible;
}

#fancybox-inner #ensureFacebookConnect hr {
	border: 0;
	border-top: 1px solid #CCC;
}

#fancybox-inner #ensureFacebookConnect #connectOptions {
	margin-top: 10px;
}

#fancybox-inner #ensureFacebookConnect #connectOptions #skipConnect {
	float: right;
	padding-top: 7px;
}

/* BEGIN from about.css */
#sideNav {
   width: 200px;
}

/* END from about.css */

/* List Widget */

.listWidget .title,
.fitnessClassList .title {
   padding: 5px;
   -webkit-border-top-left-radius: 10px;
   -webkit-border-top-right-radius: 10px;
   -moz-border-radius-topleft: 10px;
   -moz-border-radius-topright: 10px;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
   background-color: #eeeeee;
   border: 1px solid #CCC;
   font-weight:bold;
}

.listWidget .listContainer,
.fitnessClassList .listContainer {
   border-right: 1px solid #CCC;
   border-left: 1px solid #CCC;
   position: relative;
}

#pendingInvitations.listWidget .listContainer {
   padding: 5px;
}

.listWidget .endCap,
.fitnessClassList .listContainer {
   padding: 5px;
   min-height: 3px;
   -webkit-border-bottom-left-radius: 10px;
   -webkit-border-bottom-right-radius: 10px;
   -moz-border-radius-bottomleft: 10px;
   -moz-border-radius-bottomright: 10px;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   background: #eeeeee;
   border: 1px solid #CCC;
}

#friendsContainer.listWidget .endCap,
#pendingSTRequests.listWidget .endCap,
#suggestedFriends.listWidget .endCap {
   height: inherit;
}


.listWidget .divider,
.fitnessClassList .divider {
   height: 0;
   border-bottom: 1px solid #EEE;
}

.listWidget .divider:first-child {
   display: none;
}

.listWidget .listContainer .listItem {
   padding: 7px;
   position: relative;
}

.listWidget .listContainer .listItem:hover {
   background: #EEE;
   cursor: pointer;
}

.listWidget .listContainer .listItem:active {
   background: #CCC;
}

.listWidget .listContainer .listItem .place {
   float: left;
   padding: 6px 0 0 0;
   width: 25px;
   margin-right: 10px;
}

.listWidget .listContainer .listItem .icon {
   width: 30px;
   height: 30px;
   float: left;
   margin-right: 10px;
}

.listWidget .listContainer .listItem .details {
   float: left;
   position: relative;
   height: 30px;
}

.listWidget .listContainer .listItem .details span {
   position: absolute;
   top: 50%;
   margin-top: -8px;
}

.listWidget .listContainer .listItem .avatarContainer {
   width: 50px;
   height: 50px;
   float: left;
   margin-right: 10px;
}

.mostPopularContainer .listContainer .categoryNavBox p {
   margin: 5px;
}

.listWidget .listContainer .listItem ul {
   padding-left: 20px;
   list-style: disc;
}

.listWidget .listContainer .listItem ul li {
   margin-top: 8px;
}

.listWidget .listContainer .listItem ul li:first-child {
   margin-top: 0;
}

.navTab {
   position: relative;
   height: 33px;
   top: -4px;
}

.navTab .l {
   position: absolute;
   top: 0;
   left: 0;
   width: 15px;
   height: 33px;
}

.navTab .m {
   position: relative;
   height: 33px;
   margin: 0 15px;
}

.navTab .m .text {
   position: relative;
   padding: 5px 0;
}

.navTab .r {
   position: absolute;
   top: 0;
   right: 0;
   width: 15px;
   height: 33px;
}

.navTab.grey .l {
   background: url(../images/navTab-grey-l.png) no-repeat 0 0;
}

.navTab.grey:hover .l {
   background: url(../images/navTab-grey-l.png) no-repeat 0 -33px;
}

.navTab.grey:active .l {
   background: url(../images/navTab-grey-l.png) no-repeat 0 -66px;
}

.navTab.grey .m {
   background: url(../images/navTab-grey-m.png) repeat-x 0 0;
}

.navTab.grey:hover .m {
   background: url(../images/navTab-grey-m.png) repeat-x 0 -33px;
}

.navTab.grey:active .m {
   background: url(../images/navTab-grey-m.png) repeat-x 0 -66px;
}

.navTab.grey .r {
   background: url(../images/navTab-grey-r.png) no-repeat 0 0;
}

.navTab.grey:hover .r {
   background: url(../images/navTab-grey-r.png) no-repeat 0 -33px;
}

.navTab.grey:active .r {
   background: url(../images/navTab-grey-r.png) no-repeat 0 -66px;
}

.paperContainer {
   position: relative;
   margin: 0;
}

.paperContainer .paperTop {
   height:243px;
   background: url(../../oceanus/images/paper-top-2.png) no-repeat center 20px;
}
.paperContainer .paperContent {
	padding: 0 15px;
	margin:0 15px;
	background-color:#f9f9f9;
}
.paperContainer .paperContentStats {
	position:relative;
	top:-120px;
}
.paperContainer .paperContent .exerciseRow {
	margin-top:20px;
}
.paperContainer .paperContent .exerciseRow h4 {
	margin-top:0;
}
.paperContainer .paperContent .strengthHeaders h4 {
	border-bottom:1px solid #e9e9e9;
}

.paperContainer .paperBottom {
   height: 258px;
   background: url(../../oceanus/images/paper-bottom-2.png) no-repeat center 0;
}

/* Invite Widget */

.spinner
{
   position:absolute;
   left:0;
   top:36px;
   width: 640px;
   height: 410px;
   background: #FFF;
   opacity: 0.6;
   z-index: 1000;
}

.spinner img
{
   position:absolute;
   left:50%;
   top:50%;
   margin: -15px 0 0 -15px;
   width: 31px;
   height: 31px;
   z-index: 1001;
}
#friendsStepOneContents
{
   margin-top:10px;
}
.friendsStepContents .appsBox
{
   border: 1px solid #DDD;
   padding: 10px;
   width: 618px;
   overflow: auto; 
   height: 200px;
}

.friendWidgetSiteList
{
   
}
.friendsSiteListItemLogo
{
   display: block;
   float: left;
   height: 64px;
   width: 64px;
   margin: 0 5px 5px 0;       
}
.friendWidgetSiteName
{
   display:inline; 
   float:left;
   padding-top:20px;  
}
.friendsSiteListItem
{
   height: 75px;     
}
.friendsSiteListItemLink
{
   display: inline;
}
.friendsSiteListItemName
{
   display: inline;  
   padding-left:5px;
}
.friendsContactList
{
    width: 100%;
}
.friendWidgetContactListSiteLogo
{
   background-color:#e7e8ea;
   padding: 5px;
   border-bottom:4px solid #929699;
}
.friendWidgetContactListSiteSection {
   margin-top: 15px;
}
.friendWidgetContactListSiteSection:first-child {
   margin-top: 0;
}
.friendsContactSiteSection
{
   padding-bottom:3px;
}
.friendWidgetContact
{
   border-top: 1px solid #CCC;
   padding: 5px;
}

.friendWidgetContact.clickable:hover
{
   background: #EEE;
}

.friendWidgetContact.clickable:active
{
   background: #DDD;
}

.friendWidgetContact:first-child
{
   border-top: none;
}

.friendWidgetContact img
{
   width: 20px;
   height: 20px;
   float: left;
   margin-right: 10px;
}

.friendWidgetContact .contactName
{
   float: left;
   position: relative;
   top: 3px;
   margin-right: 8px;
}
.friendWidgetContact .contactEmail
{
   float: left;
   position: relative;
   top: 2px;
}
.friendWidgetContact img
{
   height:20px;
   width:20px;
   display:inline;
}
.friendWidgetContact input
{
   float:right;
}
.friendWidgetIsContact
{
   height:20px;
   width:20px;
}

.friendsStepContents .linkedAccounts .settingsTableRow div.linkedStatus {
   width: 520px;
   position: relative;
}

.friendsStepContents .appItemContainer .icon {
   float: left;
   width: 50px;
   height: 50px;
   margin-right: 20px;
}

.friendsStepContents .appItemContainer .details div.linkedStatus .name {
   display: block;
}

.friendsStepContents .settings .statusText {
   margin-top: 8px;
}

.friendsStepContents .appItemContainer {
   min-height: 50px;
   padding: 5px;
}

.friendsStepContents .divider {
   height: 1px;
   margin: 10px auto;
   border-top: 1px solid #CCC;
}

.friendsStepContents #facebookStatus {
   height: inherit;
   padding: 0;
}
#facebookStatus button {
	float:right;
	position:relative;
	top:-16px;
}

.friendsStepContents .emailTagBox {
   margin-top: 15px;
}

.friendsStepContents .emailTagEntryContainer {
   padding: 15px 0;
}

#fancybox-inner .friendsStepContents p.note {
   position: absolute;
   left: 0;
   bottom: -8px;
   width: 300px;
}

.friendsStepContents #selectableEmailTagContainer {
   margin-bottom: 15px;
}

.friendsStepContents .appItemContainer .details {
   width: 520px;
   float: left;
}

.friendsStepContents .appItemContainer.success .details {
   width: 520px;
   float: left;
}

.friendsStepContents .linkedAccounts .settingsTableRow div.linkedStatus .icon {
   right: 0;
   margin-right: 0;
}

.friendsStepContents #googleStatus {
   min-height: 50px;
}

.friendsStepContents .settings #facebookStatus.success .statusText {
   width: 480px;
}

.friendsStepContents .appItemContainer.facebook.success {
   height: inherit;
}

#stawStepTwo .friendsStepContents {
   width: 618px;
   padding: 10px;
   border: 1px solid #CCC;
   overflow: auto;
   height: 100px;
}

#stawStepTwo .inviteFriendsContainer {
   margin-top: 10px;
   width: 640px;
}

#friendWidgetContactListBox {
   height: 100px;
}

#stawStepTwo .customMessageContainer {
   margin: 15px 0;
}

#stawStepTwo #filterFriends {
   width: 628px;
   background: #EEE;
}

#stawStepTwo #filterFriends .filterFriendsInputWrapper {
   background: #FFF;
   display: inline;
}

#stawStepTwo #filterFriends .filterFriendsInputWrapper input {
   width: 556px;
}

.buttonSideText {
   float: right;
   margin-right: 8px;
   top: 8px;
   position: relative;
}

.friendWidgetContact div.checker {
   float: right;
}

.friendsInfo div {
   margin-top: 10px;
   margin-left: 20px;
}

.friendsInfo div a.text {
   display: block;
   float: left;
   position: relative;
   top: 7px;
   cursor:pointer;
}

.friendsInfo img {
   width: 30px;
   height: 30px;
   float: left;
   margin-right: 10px;
}

.friendsInfo h3 {
   margin-bottom: 24px;
}

#friendWidgetCustomMessage {
   width: 632px;
}

#stclbPeopleBox
{
   border: 1px solid #DDD;
   padding: 5px;
   overflow: auto;
   height: 428px;
}

.horizontalThumbnailList img:hover {
   cursor: pointer;
}

/* BEGIN CSS 3 Greydient Box */

.menuItem .bubble {
   position: absolute;
   top: 50%;
   margin-top: -8px;
   right: 3px;
   padding: 2px 8px 3px;
   background: #DDD;
   -webkit-border-radius: 15px;
   -moz-border-radius: 15px;
   border-radius: 15px;
}

.menuItem.selected .bubble {
   border: 1px solid #274E91;
}

/* END CSS 3 Greydient Box */

#signupOrLoginBox {
   width: 620px;
}

#signupContainer,
#loginContainer {
   float: left;
   display: block;
   width: 280px;
   padding-left: 10px;
}

#signupContainer {
   border-right: 1px solid #CCC;
   padding-right: 10px;
   margin-right: 10px;
}

#loginContainer {
}

#signupOrLoginBox label {
   display: block;
   margin: 0;
}

#signupOrLoginBox input[type="text"],
#signupOrLoginBox input[type="password"] {
 margin-right: 10px;
 width: 265px;
}

#signupOrLoginBox h4 {
   margin: 8px 0;
}

#signupOrLoginBox .signupRow,
#signupOrLoginBox .loginRow {
   margin: 8px 0;
   width: 284px;
   position: relative;
}

#signupOrLoginBox .blueButton-medium {
   float: left;
}

#signupOrLoginBox .signupRow.last,
#signupOrLoginBox .loginRow.last {
   padding-top: 20px;
   clear: both;
}

#signupOrLoginBox .loginRow.last {
   padding-top: 105px;
}

#loginFormHeader
{
   width: 100%;
   height: 53px;
   background: url(../images/header-bg.jpg) repeat-x 0 0;
   border-bottom: 1px solid #666;
   position: relative;
   z-index: 100;
}

#friendsContainer.listWidget
{
   width: 200px;
}

#content.home #rightColumn #friendsContainer.listWidget
{
   margin-bottom: 30px;
}

#friendsContainer.listWidget .title,
#pendingSTRequests.listWidget .title,
#suggestedFriends.listWidget .title
{
   width: 188px;
}

#friendsContainer.listWidget .listContainer,
#pendingSTRequests.listWidget .listContainer,
#suggestedFriends.listWidget .listContainer
{
   width: 198px;
}

#friendsContainer.listWidget .listContainer .listItem,
#pendingSTRequests.listWidget .listContainer .listItem,
#suggestedFriends.listWidget .listContainer .listItem
{
   width: 184px;
}

#friendsContainer.listWidget .listContainer .listItem .friendDetails,
#pendingSTRequests.listWidget .listContainer .listItem .friendDetails,
#suggestedFriends.listWidget .listContainer .listItem .friendDetails
{
   width: 124px;
}

#friendsContainer.listWidget .endCap,
#pendingSTRequests.listWidget .endCap,
#suggestedFriends.listWidget .endCap
{
   width: 188px;
}

#bookmarkletlbContents .subTitle
{
   padding-left: 25px;
   padding-top: 20px;
}

#bookmarkletlbContents .content
{
   padding-top:10px;
   padding-left:10px;
   padding-right:10px;
}

/* lightbox */

div#lightboxAfterRedirect.lightbox p {
   margin: 5px 0 10px 0;
}

div#lightboxAfterRedirect.lightbox ul.socialShare {
   display:block;
   list-style-type: none;
   padding-top: 20px;
   margin:0px auto;
   width:225px;
}
div#lightboxAfterRedirect.lightbox ul.socialShare li {
   display: inline-block;
}

/* map stuff */

/* map */

#map_canvas {
    width:100%;
    height: 400px;
}

#mapControls {
    background: url(../images/mapControls-grey.png) repeat-x 0 0;
    width:100%;
    height: 35px;
    position: relative;
    z-index: 7;
    border-radius:6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
}
.activity #mapControls {
	-webkit-border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;
    -moz-border-bottom-left-radius: 0;
    -moz-border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;

}

#mapControls .mapControlItem .buttonText {
    position: relative;
    top: 11px;
    cursor: pointer;
    height: 13px;
}

#mapControls .mapControlItem.instruction .buttonText,
#mapControls .mapControlItem.instruction:hover .buttonText {
    cursor: default;
}

.mapControlItem {
    background: url(../images/mapControls-grey.png) repeat-x 0 0;
    height: 35px;
    padding: 0 10px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
	border-radius:6px;
}

.mapControlItem:hover {
    background: url(../images/mapControls-grey.png) repeat-x 0 -35px;
    cursor: pointer;
}

.mapControlItem:active {
    background: url(../images/mapControls-grey.png) repeat-x 0 -70px;
}

.mapControlItem.selected {
    background: url(../images/mapControls-blue.png) repeat-x 0 0;
}

.mapControlItem.selected:hover {
    background: url(../images/mapControls-blue.png) repeat-x 0 -35px;
}

.mapControlItem.selected:active {
    background: url(../images/mapControls-blue.png) repeat-x 0 -70px;
}

.mapControlItem.left {
    float: left;
}

.mapControlItem.right {
    float: right;
}

#mapControls .dividerGrey.left {
    border-left:1px solid #ccc;
    width:0;
    height: 35px;
    float: left;
}

#mapControls .dividerGrey.right {
    border-right:1px solid #ccc;
    width:0;
    height: 35px;
    float: right;
}

#mapActions {
    float: right;
    width: 100%;
}

#mapEdit.mapControlItem .buttonText {
    background: url(../images/icon-edit.png) no-repeat 0 1px;
    padding: 0 0 0 15px;
}

#mapEdit.mapControlItem:hover .buttonText {
    background: url(../images/icon-edit.png) no-repeat 0 -38px;
    padding: 0 0 0 15px;
}

#mapControls .mapControlItem#showPhotosButton .buttonText {
    position: relative;
    top: 4px;
    width: 33px;
    height: 28px;
    background: url(../images/icon-photos.png) no-repeat 0 0;
}

#mapControls .mapControlItem#showPhotosButton.selected .buttonText {
    background: url(../images/icon-photos.png) no-repeat 0 -28px;
}

#mapRoute,
#mapRace {
    float: left;
    position: relative;
}

#mapRoute #mapRouteLabel,
#mapRace #mapRaceLabel {
    float: left;
    position: relative;
    margin: 0 6px 0 10px;
    line-height:35px;
}

#mapRoute #mapRouteName,
#mapRace #mapRaceName {
    float: left;
    position: relative;
    top: 0px;
    margin: 0 6px 0 10px;
    line-height:35px;
}

#mapRoute #mapRouteActions,
#mapRace #mapRaceActions {
    float: left;
    position: relative;
    top: 10px;
}
#fitnessClassFacepile {
	padding:10px;
}
#fitnessClassFacepile .userGrid {
	margin:0;
}
.userGrid {
	padding-left:5px;
}
.userGrid .avatarContainer {
	margin-right:5px;
}

.userGrid a {
	margin: 0 2px 2px 0;
}

.userGrid a.showMoreButton {
   display: block;
   width: 19px;
   height: 19px;
   float: left;
   background: #CCC;
   margin: 3px 0 0;
   padding: 5px 0 0 5px;
}

.userGrid a.showMoreButton:hover {
   background: #DDD;
}

.userGrid a.showMoreButton:active {
   background: #BBB;
}

.datePickerHidden
{
   display:none;
}

/* Goals widget */

#goalslbContents #shareSettings {
	width:400px;
	margin: 5px auto;
}
#goalslbContents .header
{
   margin-top:10px;
   margin-left:15px;
}

#goalNextButton
{
   margin-right:15px;
}

.goalsNext
{
	padding: 10px 0;
   	position: relative;
}
.goalsNext .ctaButton.component#goalNextButton {
	float:right;
	position:relative;
	top:-12px;
}

#goalCreationWidgetBack
{
   margin-left:15px;
   position: absolute;
   top: 6px;
   left: 4px;
}

.goalslbContents #internalContent .inactive
{
   display:none;
}

#goalslbContents .description
{
   padding-top: 5px;
}
#goalslbContents .selectionBorder
{
   border-style:solid;
   border-width:1px;
   border-color: #BBB;
   margin:15px;
   height:440px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   padding: 10px;
}

#goalslbContents .selectionBorder #step3 p.question
{
   margin-top: 20px;
   clear: both;
}

#goalslbContents .selectionBorder p.question.start,
#goalslbContents .selectionBorder p.question.end
{
   width: 253px;
}

#goalslbContents .selectionBorder #step3 p.question:first-child
{
   margin-top: 0;
}

#goalslbContents .selectionBorder #step3 .middleSelector > span
{
   position: relative;
   top: 2px;
}

#goalslbContents .selectionBorder .goalCalendarBox
{
   float: left;
   margin: 30px 0 0 35px;
}

#goalslbContents .selectionBorder .goalCalendarBox.start
{
   margin-left: 0;
}

#goalslbContents .selectionBorder #weightSelection .goalCalendarBox
{
   margin-top:0px;
}

#goalslbContents .selectionBorder #weightSelection .middleSelector
{
   margin-top:20px;
}

#goalslbContents .selectionBorder .middleSelector.goalCompletionDateText > span
{
   top: 0;
}

#goalslbContents .selectionBorder #step2
{
   position: relative;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.existingWeight
{
   position: absolute;
   top: 1px;
   left: 180px;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.existingWeight div.checker
{
   top: -3px;
}


#goalslbContents label
{
   float:left;
}

#goalslbContents #step2 .middleSelector .inlineOption.shareSettings label
{
   position:relative;
   top: 8px;
   margin-right: 8px;
}
#goalslbContents input[type="text"] {   
   width: 80px;
   margin-right: 6px;
   float:left;  
}
#goalslbContents #goalsFinalWeight {
	font-size:20px;
	font-weight:bold;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.currentWeight,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.weightToLose,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.endWeight
{
   width: 110px;
   float: left;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.currentWeight label,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.weightToLose label,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.endWeight label
{
   float: none;
   display: block;
   margin-bottom: 8px;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.currentWeight span,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.weightToLose span,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.endWeight span
{
   position: relative;
   top: 4px;
   left: 4px;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.currentWeight input[type="text"],
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.weightToLose input[type="text"],
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.endWeight input[type="text"]
{
   margin: 0;
}

#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.plusSign,
#goalslbContents .selectionBorder #step2 .middleSelector .inlineOption.equalsSign
{
   margin: 0 10px;
   float: left;
   padding-top: 30px;
}

#goalslbContents .selectionBorder #step3 .middleSelector .inlineOption.shareSettings
{
   float: none;
   clear: both;
   margin: 20px auto 25px;
   width: 130px;
}

#goalslbContents .selectionBorder .subtitle
{
   margin: 0 0 20px 0; 
}

#goalslbContents .selectionBorder #weightSelection .subtitle
{
   margin: 30px 0 40px 0; 
   float: left;  
   position: relative;
   top: 19px;
}

#goalslbContents .selectionBorder .shareSettingsBox .headline
{
   margin: 100px 0 20px 0;  
}

#goalslbContents .selectionBorder .shareSettingsBox p
{
   margin: 20px auto;
   width: 400px;  
}

.goalslbContents #internalContent .ui-datepicker-header {
   width: 254px;
}

.goalslbContents #internalContent .goalCalendar .ui-datepicker-inline table.ui-datepicker-calendar
{
   width: 254px;
}

.goalslbContents #internalContent .goalCompletionDateText
{
   margin-top: 36px;   
}

#goalslbContents .selectionBorder #step3 .middleSelector.goalCompletionDateText > span
{
   top: 0;
}

#goalslbContents .goalOption
{         
   padding:10px 5px 10px 30px;
   margin: 10px 0;
   position: relative;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}
#goalslbContents .goalOption .radio {
	padding-left:0;
}

#goalslbContents .goalOption:hover
{         
   cursor: pointer;
   background-color:#EEE;
}

#goalslbContents .goalOption:active
{         
   cursor: pointer;
   background-color:#CCC;
}

#goalslbContents .goalOption.selected
{
   background-color:#DDD;
}

#goalslbContents .goalOption .radio
{
   position: absolute;
   top: 50%;
   left:0px;
   margin-top: -11px;
}

#goalslbContents .goalOption .icon
{
   background-color:#444;
   height:20px;
   width:20px;
}

#goalslbContents .radioTitle
{
   margin-left: 30px;
}

#goalslbContents .radioSubText
{
   margin-left: 30px;
   padding-top: 5px;
}

#goalslbContents .goalCreationWidgetSpinner
{
   position:absolute;
   left:0;
   top:36px;
   width: 615px;
   height: 560px;
   background: #FFF;
   opacity: 0.6;
   z-index: 1000;
}

.userGrid a.showMoreButton:hover {
   background: #DDD;
}

.userGrid a.showMoreButton:active {
   background: #BBB;
}
#goalslbContents .goalCreationWidgetSpinner img {
   position: absolute;
   left: 50%;
   top: 50%;
   margin: -15px 0 0 -15px;
   width: 31px;
   height: 31px;
   z-index: 1001;
}

#goalslbContents #internalContent .confirmationSubTitle {
   margin-top: 10px;
}

#goalslbContents #internalContent .certificate {
   width: 491px;
   height: 330px;
   margin: 30px auto;
   position: relative;
   background: url(../images/goalCertificate.png) no-repeat 0 0;
}

#goalslbContents #internalContent .certificate p {
   display:block;
   width:440px;
   position: absolute;
   bottom:29px;
   left:25px;
   height: 95px;
   color:#fff;
   text-align: center;
   line-height:25px;
}

/* ==!==Web sign up===========================================================
Web sign up forms
   ==========================================================================*/

#signupForm .disclaimer,
#facebookSection .disclaimer
{   
   margin-top:10px;
   text-align:center;
}

#signupForm .signupTerms
{
   border-top: solid #e9e9e9 1px;
   padding-top: 10px;
   text-align:center;
}

#rightColumn.activity #signupForm .signupTerms
{   
   width: 210px;
   margin-top: 20px;  
}

#connectionSection
{
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border-radius: 10px;
   border: 2px solid #DDD;
   padding: 10px;
   width: 550px;      
   margin-left: auto;
   margin-right: auto;
}
#friendList
{
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border-radius: 10px;
   border: 2px solid #DDD;
   padding: 10px;
   width: 550px;      
   margin-left: auto;
   margin-right: auto;
   height:320px;
   overflow:auto;
   position: relative;
}

#connectionSection .divider
{   
   margin: 10px auto;
   border-top: 1px solid #CCC;
   width:auto;
}

#connectionSection .appItemContainer
{
   min-height: 56px;
   height: 56px;
   padding: 1px;
}

#connectionSection .appItemContainer #facebookStatus
{
   min-height: 56px;
   height: 56px;
   padding: 1px;
   width: 442px;
}

#connectionSection .appItemContainer .icon
{   
   float:left;
   height: 50px;
   width: 50px;
}

#connectionSection .settingsTableRow div.linkedStatus
{
   width: 300px;
   position: relative; 
}
.settingsTableRow div.linkedStatus.success .icon 
{
   display: none;
}
#connectionSection .settingsTableRow div.linkedStatus .icon
 {   
   height: 31px;
   margin-top: -16px;
   margin-right: 5px;
   position: absolute;
   top: 50%;
   right: 5px;
}

#connectionSection .statusText
{   
   width: 374px;
   margin-top: 12px;
}
#connectionSection .statusText .connectStatusText
{
   margin-bottom: 5px;
}

.emailTagBox h2 {
   margin-bottom: 6px;
}

#friendList #spinner
{
   width: 570px;
   position: absolute;
   height: 342px;   
   left: 0;
}
.middleContainer .emailTagBox h2
{
   margin-bottom:10px;
}

.emailTagEntryContainer input 
{
   border: 1px solid #DDD;
   -moz-border-radius: 3px;
   border-radius: 3px;
}
.emailTagEntryContainer input:focus 
{
    outline: none;
}
.emailTagEntryContainer
{
   padding-bottom:0px;
}
.selectableEmailTagContainer 
{
   margin-top:15px;
}

/*Invite Supporters Light box*/

#supporterInvitelbStorage .internalContent.selectionBorder .spinner
{
   margin-left: auto;
   top: 10px;
   height: 586px;
   width: 620px;
}

#supporterInvitelbStorage .breadcrumbNav
{
	width:auto;
   	padding: 0px 10px;
   	margin:15px auto;
}

#supporterInvitelbStorage .internalContent.selectionBorder
{
   height:500px;
   margin-left: 10px;
   margin-right: 10px;
}

.goalCreationWidgetSupporters
{   
   overflow:auto;
}

/*.inviteFriendsContainer #inviteSupportersFriendList
{
   height:360px
}*/

.inviteFriendsContainer #inviteSupportersFriendList
{
   padding: 10px;
   border: 1px solid #CCC;
   overflow: auto;
   height: 200px;   
}

.inviteFriendsContainer #inviteSupportersFriendList form .inlineOption
{
   margin-top:20px;
}

.inviteFriendsContainer #inviteSupportersFriendList form .inlineOption
{
   height:30px;
}

.inviteFriendsContainer #socialMediaSection 
{  
   padding-top: 15px;
   border-top: 1px solid #CCC;
}

.inviteFriendsContainer #twitterSection 
{  
   margin-top: 20px;
}

.inviteFriendsContainer #twitterSection span 
{  
   display: block;
   float: left;
}

.inviteFriendsContainer #twitterSection a 
{  
   display: block;
   float: left;
   width: 200px;
   height: 31px;
   background: url(../images/connect-twitter.png) no-repeat 0 0;
   position: relative;
   top: -6px;
   left: 5px;
}

#fancybox-inner #supporterInvitelbStorage .friendsstepcontents p.note {
   bottom: 5px;
   left: 15px;
}

/* New Homepage */

.signupContent,
.loginContent {
	margin: 0 auto;
	width: 266px;
}

.mainButton {
	position: relative;
	-webkit-border-radius: .3em;
	-moz-border-radius: .3em;
	border-radius: .3em;
	display: inline-block;
}

.mainButton.signup,
.mainButton.login {
	width: 267px;
	padding: 10px 0 12px;
}

#rightColumn.activity .mainButton.signup,
#rightColumn.activity .mainButton.login {
	width: 207px;
}

.mainButton.toggle {
	width: 58px;
	padding: 4px 0 6px;
	border: 1px solid #888;
	color:#444;
	text-align: center;
}

.mainButton.selected.toggle {
	color:#fff;
}

#resultsDisplayToggle .mainButton.toggle {
	width: 108px;
	padding: 4px 0 5px;
}

#resultsDisplayToggle .mainButton.toggleOfficial {
	width: 92px;
}

button.mainButton {
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
	padding: 6px 12px;
}

button.mainButton:hover {
   cursor: pointer;
}

button.mainButton.runkeeperBlue {
	border: 1px solid rgba(37,58,123,1);
}

button.mainButton.lightGreyBG {
	margin-right: 10px;
	padding: 4px 8px;
	border: 1px solid #999;
}

.mainButton.selected,
.mainButton.lightGreyBG.selected {
	background-color:#31a4d9;
}

.mainButton.selected,
.mainButton.lightGreyBG.selected {
   cursor: default;
}

.mainButton.left {
	-webkit-border-top-right-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	-moz-border-radius-topright: 0;
	-moz-border-radius-bottomright: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right: none;
	z-index: 5;
}

.mainButton.middle {
	-webkit-border-top-right-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	-webkit-border-top-left-radius: 0;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-radius-topright: 0;
	-moz-border-radius-bottomright: 0;
	-moz-border-radius-topleft: 0;
	-moz-border-radius-bottomleft: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-right: none;
}

.mainButton.right {
	-webkit-border-top-left-radius: 0;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-radius-topleft: 0;
	-moz-border-radius-bottomleft: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-left-width: 1px;
}

.runkeeperBlue,
.runkeeperBlue:active {
	background-color:#098ac6;
}

.runkeeperBlue:hover {
	background-color:#31a4d9;
}

.lightGreyBG {
	background-color:#eeeeee;
	border: 1px solid #999;
}

.lightGreyBG:hover {
	background-color:#cccccc;
	cursor: pointer;
}

.lightGreyBG:active {
	background-color:#eeeeee;
	cursor: pointer;
}

.STlandingBox .text,
#rightColumn.activity .STlandingBox .text {
   margin-left: 60px;
}

#disconnectConfirmation p {
   padding: 5px;
}

#disconnectConfirmation .disconnectActions {
   margin: 20px;
}

#disconnectConfirmation .disconnectActions p {
   margin-left: 26px;
   clear: none;
   position: relative;
   top: 2px;
   padding: 0;
}

.disconnectButtons {
	padding-top: 20px;
}

/* Friend request and suggestion container */

.home #pendingSTRequests,
.home #suggestedFriends
{
   width: 200px;
   min-height: 40px;
   position: relative;
   float: left;
   margin-bottom: 30px;
}

.home #pendingSTRequests .friendUsername
{
   margin-bottom: 8px;
}

.home #pendingSTRequests .friendFullName,
.home #suggestedFriends .friendFullName
{
   padding-bottom: 5px;
   margin: 4px 0;
   width: 120px;
   overflow: hidden;
   text-overflow: ellipsis;
   height: 7px;
   white-space: nowrap;
}

.home #pendingSTRequests .friendMonthlyActivities,
.home #suggestedFriends .friendMonthlyActivities
{
   padding-bottom: 3px;
   position: relative;
}

.friends #ConnectSocialText {
   width: 520px;
}

/***************** Friend suggestion page ************/
.friendsSuggestion #ConnectSocialText .rkicon
{
   font-size: 50px;
   margin-bottom: 10px;        
}

#upsellSectionLeft {
	border-top:1px solid #e9e9e9;
}
#upgradeButtonLeft {
	display:block;
	width:100%;
}
#userUpgradeDetailsLeft {
	padding: 10px 15px;
	line-height: 120%;
	text-align: center;
	font-size: 15px;
}
.fitnessClass .leftContentColumn .mainColumnPadding {
	padding-bottom: 10px;
}