@charset "UTF-8";
/* CSS Document */

*{
margin:0px;
padding:0px;
list-style:none;
text-decoration: none;
}

body{
	background-image:url(../images/bg-tile.jpg);
	font-family:Arial, Helvetica, sans-serif;
	color: #95b2b2;
}
h1{color: #202929; font-size: 30px;}
h5{font-family: 'Oswald', sans-serif;}

.shadow{
	-moz-box-shadow: 0px 2px 2px #ccc;
 	-webkit-box-shadow: 0px 2px 2px #ccc;
  	box-shadow: 0px 2px 2px #ccc;
}

.round{
	-moz-border-radius: 15px;
	border-radius: 5px;	
}

.logo{margin-bottom: 20px;}

.button-green{
	background-image:url(../images/button-bg-green.jpg);
	height: 17px;
	width: 140px;
	padding:10px;
	text-align:center;
	display: block;
	}
a.button-green:hover{background-color: #7bbcac; background-image:none;}


.button-red{
	background-image:url(../images/button-bg-red.jpg);
	height: 17px;
	width: 140px;
	padding:10px;
	text-align:center;
	display: block;
	}
a.button-red:hover{background-color: #de5d5d; background-image:none;}

.button-black{
	background-image:url(../images/button-bg-black.jpg);
	height: 17px;
	width: 140px;
	padding:10px;
	text-align:center;
	display: block;
	}
a.button-black:hover{background-color: #454343; background-image:none;}


#top{height: 5px; background-color:#4a5959; margin-bottom: 10px;}

#header{}
#header #header-right{float: right; text-align:right;margin-top: 18px;}
#header #header-right .nav{float: right;}
#header #header-right .nav li{float: left;margin-left: 20px; text-align:right; }

#header #header-right h4{font-size: 18px; background-color: white; padding:5px; width: 195px; float: right; clear: both;}
#header #header-right .user{color: #202929;}
#header #header-right a.user:hover{color: #95b2b2;}
#header #header-right .logout{color: #fb6f6f;}
#header #header-right a.logout:hover{color: #95b2b2;}

#popupContact{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:200px;
width:300px;
background:#FFFFFF;
border:2px solid #cecece;
z-index:2;
padding:12px;
font-size:13px;
}
#popupContact h2{ border-bottom: thin solid  #95b2b2; font-size: 18px; color: #202929; padding:10px 0px 15px 0px; margin-bottom: 15px;}
#popupContact h3{margin-bottom: 10px;}
#popupContact p{margin-bottom: 10px;}
#popupContact a{color: #fb6f6f;}
#popupContact a:hover{color: #202929;}

#backgroundPopup{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:100%;
width:100%;
top:0;
left:0;
background:#000000;
border:1px solid #cecece;
z-index:1;
}


#overlay  { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/bg-overlay.png); z-index: 9998; }
html>body #overlay  { *display: none; }

#header .nav{
	clear:both;
	margin-top: 15px;
	
	font-size: 14px;
	background-color: white;
	padding: 5px;
	width: 240px;
	}
#header .nav li a{color: #5e5d5d;}
#header .nav li a:hover{color: #252525;}
#stats-nav{
	clear: both;
	height: 37px;
	padding: 5px 0px 5px 0px;
	border-top: thin solid #c8d8d8;
	border-bottom: thin solid #c8d8d8;
	margin-top: 30px;
	display: block;
}
#stats-nav img{margin-bottom: -5px;}
#stats-nav h3{padding-top: 6px;}

#stats-nav .stats-nav-buttons{margin-right: -30px; float: right;}
#stats-nav a {color: white; font-weight:bold;}
#stats-nav .stats-nav-buttons li{float:left; margin-left: 10px;}

.stats-container{
	background-color: white; 
padding: 35px 0px 15px 15px; 
margin: 30px 0px 30px 0px; 
height: 350px;}

.stats-container img{margin-right: 15px; float: left;}
.stats-container p{font-size: 18px;}
.big-number{clear:both;}

.stats-left {text-align:center; border-right: thin solid #c8d8d8;}
.stats-left img {margin-left: 100px;}
.stats-left h5{font-size: 116px; clear:both;}

.stats-center{ border-right: thin solid #c8d8d8; padding: 0px 15px 0px 45px;}
.stats-center h5 {font-size: 60px;}
.stats-sleep{margin-bottom: 20px;display: block;}
.stats-sleep li{float: left;}
.stats-hand{ clear: both; padding-top: 20px;}
.stats-hand li{float: left;}


.stats-right{padding-left: 45px;}
.stats-right h5 {font-size: 60px;}

.stats-drinks li{float: left;}
.stats-food{ clear: both; padding-top: 20px;}
.stats-food li{float: left;}

#last-week{
	background-image: url(../images/bg-dark.jpg);
	height: 60px;
	padding: 10px 0 10px 0px;
}

#last-week li{float: left; margin-left: 40px;}
#last-week h2{margin-top: 15px; margin-left: -35px;}
.pointer{margin-top: 20px; margin-left: -25px;}

#enter{}
#enter form input.button-red{
	background: #fd7070 url(../images/button-bg-red.jpg) bottom repeat-x;
	height: 45px;
	width: 140px;
	padding:10px;
	color: white;
	font-size: 22px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align:center;
	display: block;
	border: none;
	display: inline;
	}

#enter form input.button-red:hover{background: #de5d5d; }

#enter .textfield{
	border: #e5e5e5 thin solid;
	width: 129px;
	height: 45px;
	padding: 0px 10px 0px 10px;
	font-size: 11px;
	color: #999; 
	margin-right: 60px;
	margin-bottom: 15px;
	cursor: pointer;
	}
#enter form .submit{}
#enter img{margin-bottom:-7px; margin-right: 10px;}
#enter h1{margin:25px 0px 25px 0px;}
#enter #share{background:#e6eeee; height: 80px; padding: 10px; text-align:center;}
#enter #share ul{margin-left: 0px;}
#enter #share ul li{float: left; padding-left: 10px; margin-top: 10px;}


#friends{
	clear: both;
	background-image: url(../images/bg-dark.jpg);
	height: 275px;
	margin-top: 160px ;
	display: block;
	font-weight:bold;
}
#friends h2{padding:20px 0px 10px 0px;}
#friends .separator{
	width: 100%;
	margin-left: -3px;
	background-color: black; 
	height: 1px;
	-moz-box-shadow: 0px 1px 1px #3d3d3d;
 	-webkit-box-shadow: 0px 1px 1px #3d3d3d;
  	box-shadow: 0px 1px 1px #3d3d3d;
	}
#friends h4{color: white; font-weight:bold; margin: 20px 0px 20px 0px; vertical-align:middle;}
#friends p{padding-bottom: 10px;}
#friends .name{color: #ee6868;}
#friends .date{}
#friends .sleep{}

#footer{}
#footer p{color: #192020; font-weight: bold; font-size: 12px;}
#footer p a{color: #192020; font-weight: bold; font-size: 12px;}
#footer p a:hover{color: #6d978c;} 
#footer .footer-container{
	background: #9dcdc1; 
	padding: 20px;
	height: 15px; 
	margin-top: 20px; 
	margin-bottom:20px;
	-moz-box-shadow: 0px 1px 2px #33433f;
 	-webkit-box-shadow: 0px 1px 2px #33433f;
  	box-shadow: 0px 1px 2px #33433f;
	}
#footer ul{float: right; margin-top: -13px;}
#footer ul li{float: left; margin-left: 20px;}