/**
 * Application.css
 */

@media print { #sidebar { display: none; }
               #content { float: none; width: 90%; } }

body { background: #e1e1e1; font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
}

h1,h2,h3,h4,h5,h6 { font-family: helvetica, arial, sans-serif; }

h1 { font-size: 28px; margin-bottom: 15px; }
h2 { font-size: 18px; margin-bottom: 15px; }
h3 { font-size: 17px; margin-bottom: 15px; }

input  { font: normal 12px "lucida grande", verdana, sans-serif; }
textarea { font: normal 12px "bitstream vera sans mono", monaco, "courier new", courier, monospace; }

code, pre { font: normal 80% "bitstream vera sans mono", monaco, "courier new", courier, monospace; }

abbr { border: none; }
cite { font-style: normal; }

img { border: none; }

a { text-decoration: underline; padding: 1px; }

a:link,
a:visited { color: #03c; }

a:hover,
a:active { color: #fff; background: #000; text-decoration: none; }

a.cancel,
a.cancel:link,
a.cancel:visited { color: #c00; }

a.delete,
a.delete:link,
a.delete:visited { color: #990000; }

hr { visibility: hidden; clear: both; }


/*==================================================
 * Definitions for layout (positioning, width, height, margin, padding)
 *
 * #application
 *   #header
 *   #page
 *     #content
 *     #sidebar
 *   #footer
 ==================================================*/

body { text-align: center; margin: 0; padding: 0; }

/*
#header { float: left; width: 100%; }
*/
#header {
	background: #722;
	height: 118px;
	margin-top: 10px;
	margin-left: 0px;
	text-align: left;
	padding-top: 0px;
}

#header .container, #footer { width: 800px; margin: auto; }
#header .statusbar { margin: auto; padding: 4px 12px; height: 16px; }
#header .statusbar .logo { float:left; }
#header .statusbar .menu { float:right; }

#page {
  width: 759px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5px;
  padding: 16px;
  text-align: left;
  clear: both;
}

#content { float: right; width: 650px; min-height: 360px; }

#footer { text-align: left; clear:both; }


/*==================================================
 * Definitions for the tabbed interface
 * Tab colors are meant to be customized to your liking
 ==================================================*/

#header .statusbar {
  color: #ddd; background: #333;
  font-size: 11px;
  border-bottom: 2px solid #272727;
}

#header { background: #722; }

/*-------------------------------------------------
 The background color of all tabs
 -------------------------------------------------*/
#header .tabs li { background: #272727; }

/*-------------------------------------------------
 The text color of all tabs
 -------------------------------------------------*/
#header .tabs a { color: #fff; }

/*-------------------------------------------------
 The hover color of all tabs
 -------------------------------------------------*/
#header .tabs a:hover { 
  background: #fff;
  color: #090;
}

/*-------------------------------------------------
 The colors of a selected tab
 -------------------------------------------------*/
#header .tabs a.selected,
#header .tabs a.selected:hover {
  background: #fff;
  color: #222;
  font-weight: bold;
}

/*-------------------------------------------------
 Tab dimensions and layout properties
 -------------------------------------------------*/
#header .tabs ul {
  margin: 0 16px; padding: 0;
  list-style-type: none;
}

#header .tabs li {
  float: left;
  margin: 0; padding: 0;
  display: inline;
}

#header .tabs a {
  float: left;
  margin: 0; padding: 0.5em 1.8em;
  text-decoration: none;
}


/*==================================================
 * Main interface definitions
 * Everything other than 'layout' and 'tabs'
 ==================================================*/

/*-------------------------------------------------
 Header
 -------------------------------------------------*/

#header .statusbar .menu a:link,
#header .statusbar .menu a:visited { color: #ddd; text-decoration: none; }
#header .statusbar .menu a:hover,
#header .statusbar .menu a:active { color: #fff; }
#header .statusbar .menu a.selected { color: #fff; font-weight: bold; }

#header .statusbar .logo strong { color: #fff; font-size: 12px; }

/*-------------------------------------------------
 Page
 -------------------------------------------------*/

#page { background: #fff; 
        border-bottom: 4px solid #ccc;
        border-right:  4px solid #ccc;
        border-left:   4px solid #ccc; }

/*-------------------------------------------------
 Content
 -------------------------------------------------*/

#content h1 { margin-top: 0; }

#content ul { list-style: square; padding-left: 20px; }

/* list items */
#content .item {
  margin: 0 0 0.75em 0; padding: 0.2em 0.8em 0.8em 0.8em;
  border: 1px solid #c1c1c1; background: #f6f6f6;
}

#content .item h3 {
  margin: 0 0 0.3em 0; padding: 0.2em 0;
  border-bottom: 1px dotted #bbb;
  font-size: 20px;
  background: #fff;
}

#content .item h3 a { padding: 3px; }          

#content .item h3 a:link,     
#content .item h3 a:visited  { color: #000; text-decoration: none; }
#content .item h3 a:hover    { background: none; text-decoration: underline; }

/* controls */
#content .item p.controls { font-size: smaller; }
#content .item p.controls a { color: green; }
#content .item p.controls a:hover { color: #fff; }

/* email friend */
#content #email_friend { background: #ffc; padding: 0.5em; }

/*-------------------------------------------------
 Footer
 -------------------------------------------------*/

#footer { color: #666; font-size: 11px; }

#footer a:link,
#footer a:visited { color: #666; }
#footer a:hover { color: #fff; background: #333; }

/**
 * Definitions for fields, buttons, and forms
 * 
 * Fieldsets can be nested; those containing radio buttons
 * or checkboxes can be given a class of 'radio'
 */

form { margin: 0; padding: 0; }

/*-------------------------------------------------
 Labels
 -------------------------------------------------*/

form label { color: #222; font-weight: bold; margin: 0 0.8em 0.3em 0; }

form label span { font-weight: normal; font-size: 10px; }

/*-------------------------------------------------
 Input and text elements
 -------------------------------------------------*/

form input,
form select { font-size: 14px; }

form input[type=submit] { font-size: 15px; }

form input.large {
  font-size: 18px; font-weight: bold; 
  width: 80%;
  padding: 4px;
}

form input.huge {
  font-size: 22px; font-weight: bold;
  width: 90%;
  padding: 4px;
}

form textarea {
  width: 97%;
  padding: 0.3em;
  display: block;
  clear: both;
}

#user_name, #user_login, #user_email, #user_email_confirmation, #user_password, #user_password_confirmation, #user_birthday, #user_height, #user_goal_weight, #user_goal_size {
	width:100%;
}



input, textarea {
	border: 3px double #333;
}

table {
	border:0;
	border-collapse:collapse;
	font: normal 12px 'Lucida Grande',Verdana,sans-serif;
}

td, tr {
	padding: 6px;
}

td {
	border-bottom: 1px solid #666;
}

tr {
	background: #DDDDDD;
}

fieldset {
	margin: 0 0 10px 0;
	padding: 5px;
	border:1px solid #333;
}

legend {
	background-color: #DDDDDD;
	margin: 0;
	padding:5px;
	border-style:solid;
	border-width:1px;
	border-color:#FFF #AAA #666 #FFF;
}


/**
 * Rules for ActionPack's generated selectors
 */
 
/*-------------------------------------------------
 Error explanations
 -------------------------------------------------*/

div.errorExplanation {
  border: 2px solid #f00;
  padding: 7px 7px 12px 7px;
  margin-bottom: 20px;
  background-color: #fff;
}

div.errorExplanation h2 {
  color: #fff !important; font-size: 12px; font-weight: bold; text-align: left;
  background: #c00;
  padding: 5px 5px 5px 15px;
  margin: -7px;  
}

div.errorExplanation p {
  color: #333;
  padding: 5px;
  margin-bottom: 0;
}

div.errorExplanation ul li {
  font-size: 12px;
  list-style: square;
}

/*-------------------------------------------------
 Fields containing errors
 -------------------------------------------------*/

div.fieldWithErrors { display: inline; }

div.fieldWithErrors input,
div.fieldWithErrors select { background: #ffc; }

/*-------------------------------------------------
 Flash Messages
 -------------------------------------------------*/
 
div.flash {
  font-size: 12px; font-weight: bold;
  color: #390;
  background: #ffc;
  margin: 0 0 1em 0; padding: 0.3em;
  border: 1px solid #fc0;
}

div.flash h2 { margin-top: 0; }

#sidemenu {
	font-size: 80%;
	float: left;
	width: 200px;
	padding: 0;
}

#sidemenu ul {
	list-style: none;
	margin-left: 0px;
	padding: 0;
	line-height: 2.5em;
}

#container {
	width: 860px;
	min-width: 760px;
	margin: 0 auto;
	padding: 0px;
}

.header_table {
	width: 860px;
	margin-bottom: 0;
	border-collapse: collapse;
}

.header_table td {
	border-bottom: 0;
}

.header_table tr {
	background-color: #FBB;
	color: #111;
}


#t_show_user {font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;}
#t_show_user *.c1 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c2 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c3 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c4 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c5 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c6 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c7 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c8 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c9 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c10 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c11 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c12 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c13 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c14 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.c15 { font-weight: bold; background-color: #AAF; font-size:0.9em; } /* Selecting cells in column */
#t_show_user *.c16 { background-color: #BBF;  } /* Selecting cells in column */
#t_show_user *.odd *.c1 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c2 { background: #BBB;}
#t_show_user *.odd *.c3 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c4 { background: #BBB;}
#t_show_user *.odd *.c5 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c6 { background: #BBB;}
#t_show_user *.odd *.c7 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c8 { background: #BBB;}
#t_show_user *.odd *.c9 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c10 { background: #BBB;}
#t_show_user *.odd *.c11 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c12 { background: #BBB;}
#t_show_user *.odd *.c13 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c14 { background: #BBB;}
#t_show_user *.odd *.c15 { background:#AAA; } /* Alternating Row Background */
#t_show_user *.odd *.c16 { background: #BBB;}