html {
	height: 100%;
    display: table;
    margin: auto;
	background-repeat: no-repeat;
    background-attachment: fixed;
    background-color:#329BDE; /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(170deg, #329BDE, #9d6d29) fixed; /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(170deg, #329BDE, #9d6d29) fixed; /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(170deg, #329BDE, #9d6d29) fixed; /* For Firefox 3.6 to 15 */
	background: linear-gradient(170deg, #329BDE, #9d6d29) fixed; /* Standard syntax */

}

#header {
	color: #EEE;
/* 	font-family: "Rockwell Extra Bold", "Rockwell Bold", Rockwell, "Courier Bold", Courier, Georgia, serif; */
/* 	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif; */
/* 	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; */
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	font-size: 65px;
	font-style: light;
	font-variant: small-caps;
	font-weight: 300;
	line-height: 70px;
	width:100%;
	height:75px;
	text-align:center;
	background-color:clear;
}

body {
	height: 100%;
    margin: 0;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	font-size: 30px;
	line-height: 40px;
/* 	font-family: Rockwell, "Courier Bold", Courier, Georgia, serif; */
}

#contentWrapper {
	width:900px;
    display: table-cell;
	vertical-align:middle;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	background-color:rgba(0,0,0,0.1) 
}

#contentWrapperPhone {
	width:580px;
    display: table-cell;
	vertical-align:middle;
	margin-left:auto;
	margin-right:auto;
	background-color:rgba(0,0,0,0.1) 
}

#breadCrumb {
	color: #EEE;
	width:100%;
	overflow: hidden;
	font-size: 20px;
	line-height: 25px;
	padding:0px;
}

#breadCrumb li {
	float:left;
	text-align: center;
	display: block;
	padding: 5px 5px 5px 5px; 
}

#breadCrumb li a {
	color: #EEE;
    display: block;
    text-align: center;
    text-decoration: none;
}

#lastCrumb {
/*     font-weight: 400; */
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
}

#filter {
	width:100%;
	padding-top:5px;
}

#filter ul {
	list-style-type: none; /*to remove bullets*/
    text-align: center;
    margin: 0 auto;
    padding: 0px;
    display:table;
    overflow: hidden;
}

#baseFilter {
	float:left;
	text-align: center;
	display: block;
	width: 170px;
    margin-left: 5px;
    margin-right: 5px ;
	padding: 20px 0px;
	font-size: 25px;
	line-height: 30px;
}



#difficultyFilter {
	float:left;
	text-align: center;
	display: block;
	width: 130px;
    margin-left: 5px;
    margin-right: 5px ;
	padding: 20px 0px;
	font-size: 20px;
	line-height: 25px;

}

#filter span {
	display: block;
    text-align: center;
    text-decoration: none;
    padding: 5px 5px 5px 5px;
}

#filter li a {
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,0.19);
    border-radius: 4px;
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 5px 5px 5px 5px;
    border:1px solid #222;
}

#selectedFilter {
	color: #DDD;
	background: #222; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#333, #111); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#333, #111); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#333, #111); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#333, #111); /* Standard syntax */
}

#naturalFilter {
	color: #222;
	background: #EEE; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#FFF, #DDD); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#FFF, #DDD); For Opera 11.1 to 12.0
    background: -moz-linear-gradient(#FFF, #DDD); For Firefox 3.6 to 15
    background: linear-gradient(#FFF, #DDD); Standard syntax

}

#content {
	width:580px;
	float:left;
	height:100%;
/* 	background-color:rgba(255,255,255,0.3) */
	background-color:#FFF;
}

#channels {
	width:300px;
	float:right;
	height:100%;
}

#channelsPhone {
	width:300px;
	margin: 0 auto;
}

#channels p {
	text-align:center;
	font-family: "Comic Sans MS", sans-serif; 
	font-size: 20px;
	line-height: 22px;
	padding: 5px 10px;
	color:#444;
}

#channelsPhone p {
	text-align:center;
	font-family: "Comic Sans MS", sans-serif; 
	font-size: 20px;
	line-height: 22px;
	padding: 5px 10px;
	color:#444;
}

#fbBox {
	background-color:#FFF;
}

#appBanner {
	width:300px;
	background-color:#FFF;
}

#appBanner p{
	margin:0px;
}

#ytFrame {
	padding:20px 60px;
}

#exerciseList {
	text-align: center;
	padding:0px;
	margin:10px 0px 20px 0px;
}

#exerciseButton {
	list-style-type:none;
	padding:5px 0px;
}

#exerciseButton a{
	text-decoration:none;
	color:#222
}

#exerciseButton img{
	vertical-align: text-top;
	padding:0px 10px 0px 0px;
    opacity:0.6;
}

#sectionHeader {
	text-align: center;
	padding:10px 0px 0px 0px;
	text-decoration:underline;
	color:#666;
}

#exerciseImage {
	float:left;
	padding:25px;
	opacity:0.6;
}

#exerciseTitle {
	padding-top:10px;
}

#exerciseQuickFact {
	color:#444;
	font-size: 20px;
	line-height: 22px;
}

#exerciseDescription {
	clear:both;
	padding-left:20px;
	padding-right:20px;
	text-align:justify;
	font-size: 20px;
	line-height: 22px;
}

@keyframes anim2FadeInOut {
	0% {
		opacity:0.6;
	}
	45% {
		opacity:0.6;
	}
	55% {
		opacity:0;
	}
	100% {
		opacity:0;
	}
}

#anim2 {
	float:left;
	position:relative;
	width:60px;
	height:60px;
	padding:25px;
}

#social {
	float:left;
	position: absolute;
	position:fixed;
	top: 20;
	left: 20;
}

#social_1 {
	float:left;
	position: absolute;
	position:fixed;
	top: 60;
	left: 20;
}


#anim2 img.top {
	position: absolute;
	top: 0;
	left: 0;
	padding:25px;
	animation-name: anim2FadeInOut;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 3s;
	animation-direction: alternate;
}

#anim2 img.bottom {
	position: absolute;
	top: 0;
	left: 0;
	padding:25px;
	animation-name: anim2FadeInOut;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 3s;
	animation-direction: alternate-reverse;
}

#anatomy {
	position:relative;
	float:left;
	clear:left;
	width:400;
	height:300;
}

#anatomy img{
	position: absolute;
	top: 0;
	left: 0;
}

#muscles {
	float:right;
	width:180;
	padding:0px;
}

#muscles .title {
	padding-top:15px;
	padding-bottom:5px;
	font-size:20px;
	line-height:22px;
}
#muscles .muscle {
	font-size:18px;
	line-height:20px;
	padding:0px;
}

#anatomy .primary {
	opacity:1;
}
#anatomy .secondary {
	opacity:0.66;
}
#anatomy .other {
	opacity:0.33;
}

#progression {
	text-align:center;
	font-size: 20px;
	line-height: 22px;
}

#exerciseSectionHeader {
	clear:both;
	text-align:center;
	font-size: 25px;
	line-height: 27px;
	padding-top:15px;
	padding-bottom:5px;
	color:#666;
}

#backButton a{
	text-decoration:none;
	color:#222;
	padding:10px;
	padding-bottom:0px;
	display:block;
	font-size: 20px;
	line-height: 22px;
}

#backButton input {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	text-decoration:none;
	color:#222;
	padding:8px;
	padding-bottom:0px;
	display:block;
	font-size: 20px;
	line-height: 22px;
	background:none;
	border:none;
}



/* 
body {
	margin:0px;
	padding:0px;
	background: #333333;
	
}

body, textarea {
	font-family: Arial, Helvetica, sans-serif
}

#header {
	height:105px;
	color: #EEEEEE;
	font-weight:bold;
}

#header a {
	width:100px;
	height:17px;
	margin-top:3px;
	display:block;
	color: #EEEEEE;
	text-decoration:none;
	text-align:center;
	background-color:#555555;
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
    -webkit-border-radius:2px 2px 2px 2px;
}


#headerSmall {
	height:30px;
	color: #EEEEEE;
	font-weight:bold;
}

#headerSmall .logout{
	float: right;
	margin-top:5px;
}

.logout a{
	padding:1px 5px 1px 5px;
	text-decoration:none;
	color: #DDDDDD;
	background-color: #555555;
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
    -webkit-border-radius:2px 2px 2px 2px;
}

#headerSmall .loggedIn{
	float: right;
	margin:5px 5px 0px 0px;
}

#counter {
	padding:0px 20px 0px 20px;
	font-weight:normal;
	color:#666666;
}

.hide {
	display:none;
}

#content-wrapper, #header, #headerSmall{
	margin-left:auto;
	margin-right:auto;
	width:970px;
	background-color:#333333;

}

#content-wrapper{
	min-height:1000px;
}

//index
#login-form{
	float:right;
	height:100%;
	width:180px;
	margin-right:0px;
}

#login-form input{
	margin:0px 0px 0px 5px;
}

#login-form input.field{
	width:100px;
	height:19px;
}

#login-form input.wrongfield{
	width:100px;
	height:19px;
	background-color:#FF0000;
	color:#FFFFFF;
}

#login-form input.button{
	width:100px;
	height:22px;
	border:none;
	font-weight:bold;
	color: #EEEEEE;
	background-color:#558844;
	padding:1px 5px 1px 5px;
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
    -webkit-border-radius:2px 2px 2px 2px;
}

#login-form submit{
	height:30px;
	margin:0px 0px 0px 5px;
}

#login-form p{
	float:right;
	font-size:12px;
	clear:both;
	margin:0px;
	padding:0px;
	height:20px;
	margin:5px 0px 0px 0px;
}

//menu
#menu{
background:#EEEEEE;
	width:100%;
}

#menu ul{
	margin: 0px;
	padding: 0px;
}

#menu li{
	float: left;
	list-style-type:none;
	
	// this ensures that the li element widths doesn't change with the borders
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

.loggedIn li {
	width:20%;
}

.loggedOut li {
	width:33.33%;
}

#menu a{
	line-height:40px;
	text-align:center;
	text-decoration:none;
	font-weight: bold;
	color:#EEEEEE;
	width:100%;
	margin:0px;
	display:block;
}

.leftMenu a{
	border-radius:7px 0px 0px 7px ;

}
.rightMenu a{
	border-radius:0px 7px 7px 0px ;
}

.leftMenu {
	border-right: 1px solid #4F4440;

}

.normalMenu {
	border-right: 1px solid #4F4440;
	border-left: 1px solid #4F4440;
}
.rightMenu  {
	border-left: 1px solid #4F4440;
}
.active-menu{
	margin:0px;
	background-image:url('img/grad2.png');
}

.passive-menu{
	background-image:url('img/grad.png');
}

#content{
	border-radius:7px 7px 7px 7px;
	float:left;
	width:100%;
	min-height:100px;
	padding:0px;
	margin:0px;
	margin-top:10px;
	background:#D8D8C0;
}

#content h2, p {
	padding:0px 10px 0px 20px;
}

#subMenu{
background:#D8D8C0;
	width:100%;
}

#subMenu ul{
	margin: 0px;
	padding: 0px;
}

#subMenu li{
	float: left;
	list-style-type:none;
	
	// this ensures that the li element widths doesn't change with the borders
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width:25%;
	z-index:0;
}

.active-subMenu{
	margin:0px;
	background:#D8D8C0;
		padding-bottom: 2px;
}

.passive-subMenu{
	background:#DDDDDD;
	border-bottom: 2px solid #cccccc;

}

#subMenu a{
	line-height:40px;
	text-align:center;
	text-decoration:none;
	font-weight: bold;
	color:#222222;
	width:100%;
	margin:0px;
	display:block;
	position:relative;
	z-index:0;
}

.leftSubMenu a{
	border-radius:7px 0px 0px 0px ;
}

.rightSubMenu a{
	border-radius:0px 7px 0px 0px ;
}

.normalSubMenu{
	border-right: 1px solid #bbbbbb;
	border-left: 1px solid #bbbbbb;
}

.rightSubMenu {
	border-left: 1px solid #bbbbbb;
}
.leftSubMenu {
	border-right: 1px solid #bbbbbb;
}

//registration form

#registrationTable {
	margin:20px 0px  0px 20px;
}

input.empty, textarea.empty {
	background-color:#FF0000;
	color:#FFFFFF;
}

input.existingUser {
	background-color:#FFFF00;
}

#registrationTable {
	padding:10px;
}

// AUCTION TABLE
#auctionTable {
	float:left;
	padding: 20px;
	border-spacing: 0px 5px;
}

#newTR{
	background-color:#869b6c;
}

#oldTR {
	background-color:#a6bb8c;
}

#headerTR {
	font-size:12px;
	color:#777777;
	background-color:#CCCCCC;
}

#auctionTable td{
	padding:5px;
	//width:100px;
	border-left:1px  solid #96ab7c;
}

#auctionTable td:first-child{
	border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
    -webkit-border-radius:4px 0px 0px 4px;
	border-left:0px  solid #96ab7c;
}

#auctionTable td:last-child {
	border-radius: 0px 4px 4px 0px;
	-moz-border-radius: 0px 4px 4px 0px;
    -webkit-border-radius:0px 4px 4px 0px;
}

#auctionTable a{
	text-decoration:none;
	color:#000000;

}

.auctionImageCell a{
	height:150px;
	width:200px;
    display:block;
}

.auctionImageCell img{
	max-width: 100%;
}

#auctionTable .auctionDescriptionCell {
	width:300px;
	text-align:justify;
}

.auctionImage {
	max-width:100%;
	max-height:100%;
}

// UPLOAD FORM

#uploadTable {
	padding: 20px;
	border-spacing: 0px 2px;
}

#uploadTable p{
	padding: 0px;
}

#formWarning {
	color:#dd2222;
	font-size:10px;
	padding-left:10px;
	padding-top:8px;
}

#backButton {
	display:block;
	float:left;
	clear:both;
	margin:20px 0px 0px 10px;
	padding:5px 0px 0px 10px;
}

#backButton a{
	text-decoration:none;
	border:none;
	font-weight:bold;
	color: #EEEEEE;
	background-color:#558844;
	padding:1px 5px 1px 5px;
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
    -webkit-border-radius:2px 2px 2px 2px;
}

#deleteFilter {
	display:block;
	float:left;
	margin:20px 0px 0px 10px;
	padding:5px 0px 0px 10px;
}

#deleteFilter a{
	text-decoration:none;
	border:none;
	font-weight:bold;
	color: #EEEEEE;
	background-color:#994433;
	padding:1px 5px 1px 5px;
	border-radius: 2px 2px 2px 2px;
	-moz-border-radius: 2px 2px 2px 2px;
    -webkit-border-radius:2px 2px 2px 2px;
}
.textCleared{
	float:left;
	clear:both;
}
.note {
	font-size:10px;
	color:#444444;
}
#auctionDetails {
	float:left;
	clear:both;
	margin:10px 20px 50px 10px;
	min-height:100px;
}

#detailText {
	min-width:300px;
	max-width:450px;
	float:left;
}
#detailImage {
	min-width:300px;
	max-width:450px;
	float:left;
}
#badge {
	position:absolute;
	top:9px;
	left:210px;
	width:15px;
	z-index:1;
	color: #EEEEEE;
	background-color:#DD3311;
	padding:3px 3px 3px 3px;
	border-radius: 7px 7px 7px 7px;
	-moz-border-radius: 7px 7px 7px 7px;
    -webkit-border-radius:7px 7px 7px 7px;
	line-height:15px;
}

// AUCTION COMMENTS
#comments {
	padding-left: 10px;
}

#commentTable {
	clear:both;
	padding: 10px 10px 10px 20px;
	border-spacing: 0px 2px;
}

#commentRow  td{
	background-color:#a6bb8c;
	padding:5px;
	min-width:100px;
	max-width:500px;
	vertical-align:top;
}

#commentRow td:first-child{
	border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
    -webkit-border-radius:4px 0px 0px 4px;
}

#commentRow td:last-child {
	border-radius: 0px 4px 4px 0px;
	-moz-border-radius: 0px 4px 4px 0px;
    -webkit-border-radius:0px 4px 4px 0px;
}

// GROUP LIST TABLE
#groupTable {
	float:left;
	padding: 20px;
	border-spacing: 0px 2px;
}

#groupTable a{
	text-decoration:none;
	color:black;
	display:block;
	padding:5px;
}

#groupRow  td{
	background-color:#a6bb8c;
	max-width:500px;
	vertical-align:top;
	border:solid #95aa7b 1px;
}

#groupDetails {
	float:left;
	padding: 20px;
	clear:right;
}

#groupMiddleCol {
	width=100px;
}

#groupRow td:first-child{
	border-width:1px 0px 1px 1px;
	border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
    -webkit-border-radius:4px 0px 0px 4px;
}

#groupRow td:last-child {
	border-radius: 0px 4px 4px 0px;
	-moz-border-radius: 0px 4px 4px 0px;
    -webkit-border-radius:0px 4px 4px 0px;
}

#addGroup {
	float:left;
	padding: 20px;
	clear:right;
}

#groupInfo {
	clear:left;
	float:left;
}
// FILTER
#filterForm {
	padding:20px 0px 0px 20px;
}
// DELETE
#deleteForm {
	clear:left;
	padding:0px 0px 0px 20px;
}

// BUY BUTTON
#buyForm, #reserveForm{
	padding-left:20px;
}

#buyFormQuantitiy {
	width:20px;
}

.bold {
	font-weight:bold;
}
 */