/* Color schemes to try out:
   http://www.hypergurl.com/?color=FFF075
   http://www.hypergurl.com/?color=FFD8D6
   http://www.hypergurl.com/?color=C5E6FF
   http://www.hypergurl.com/?color=DEF0FF */

/* Global margin / padding reset */
*
{ 
  margin: 0px;
  padding: 0px;
}

/* Generic typeface stuff */
h1, h2, h3, h4, h5, h6
{ 
  font-family: tahoma, verdana, arial, sans-serif;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  color: #484848;
}

h1 { font-size: xx-large; }
h2 { font-size: x-large; }
h3 { font-size: large;  }
h4 { font-size: medium; font-weight: 400;}
h5 { font-size: small; }
h6 { font-size: small; font-weight: 400;}

p
{ 
  font-family: tahoma, verdana, arial, sans-serif;
  font-size: 10pt;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  color: #484848;
}

a 
{ 
  color: #3D3DFF;
  font-family: tahoma, verdana, arial, sans-serif;
  text-decoration: none; 
}

a:link {  }
a:visited { }
a:hover 
{ 
  text-decoration: underline;
}
a:active { }


/* Other generic initial conditions */
ul
{ 
  list-style-type: none;
}

body
{ 
  background: url('images/stripes_gray.png');
}

/* Generic div classes */
.header 
{ 
  /*background-image: url("banner.gif");
  background-repeat: no-repeat;
  background-position: top left;
  background-attachment: scroll;
  padding: 100px 0px 0px 0px; */
  width: 100%;
  text-align: left;
  height: 91px;
  width: 830px;
  margin: 0px auto 0px auto;
  padding-left: 8px;
  background: url('images/banner.png') no-repeat top left !important;
  background: url('images/banner.gif') no-repeat top left;
}

.header h1 { color: #5AC3DD; display: inline; font-size: xx-large;}
.header h2 { color: #424242; display: inline; font-size: x-large; position: relative; top: -10px;}

.header .userbox
{ 
  float: right;
  margin: 11px -7px 0px 11px;
  background: transparent url('images/drop_shadow.png') no-repeat right bottom !important;
  background: transparent url('images/drop_shadow.gif') no-repeat right bottom;
  width: 202px;
}

.header .userbox .userbox_popout
{ 
  border: 1px solid #484848;
  position: relative;
  top: -6px;
  left: -6px;
  background-color: #fff;
}

.userbox h4 
{ 
  font-size: 10pt;
  margin-left: 3px;
}

.userbox input
{ 
  margin-right: 3px;
  font-size: 9pt;
}

.userbox table input
{ 
  width: 8em;
}

.userbox p
{ 
  text-align: left;
  margin-bottom: 1px;
  padding-left: 4px;
}

.userbox h5
{                
  background-color: #ff3b3b;
  color: #fff;
  font-weight: 900;
  padding: 0px 0px 1px 3px;
  border-bottom: 1px solid #ccc;
}

.header_nav
{ 
  width: 830px;
  margin: 0px auto;
  padding-left: 8px;
}

.header_nav li
{ 
  float:left;
  text-align: left;
  border-top: 1px solid #999;
  border-left: 1px solid #999;
  border-right: 1px solid #999;
  border-bottom: 1px solid #484848;
  background-color: #ddd;
  margin-right: 2px;
  position: relative;
  top: 1px;
}

.header_nav a
{ 
  color: #424242;
  padding: 0px 9px 2px;
  font-size: medium;
  display: block;
}

.header_nav a:visited
{ 
  color: #424242;
}

.header_nav li:hover
{ 
  background-color: #ffffcc;
}

.header_nav li.selected
{ 
  background-color: #fff;
  border-top: 1px solid #484848;
  border-left: 1px solid #484848;
  border-right: 1px solid #484848;
  border-bottom: 1px solid #fff;
}

.header_nav li.selected:hover
{ 
  background-color: #fff;
}

.header_nav li.selected a
{ 
  color: #424242;
}

.logged_in_header
{ 
  width: 790px;
  background-color: #BBE5FF;
  padding: 1px 5px 3px 5px;
}

.logged_in_float
{ 
  float: right;
}

.ad_unit
{ 
  margin: 5px auto 0px auto;
  text-align: center;
  width: 460px;
}

.footer 
{ 
  margin: 0px auto 0px auto;
  padding: 20px 0px 0px 8px;
  clear: both;
  width: 800px;
}

.footer p
{ 
  max-width: 500px;
}

.footer ul
{ 
  padding-bottom: 3px;
  float: right;  
}
.footer img
{ 
  position: relative;
  top: 4px;
}

.body 
{ 
  margin: 0px auto 0px auto;
  width: 830px;
}

.contentWrapper
{ 
  background-color: #fff;
  border-bottom: 1px solid #484848;
  border-top: 1px solid #484848;
  padding: 15px 0px 10px 8px;
  min-width: 830px;
}

.background
{ 
  background-color: #FFE99C;
}

.clear
{ 
  clear: both;
}


/* a few classes to create those irritating input forms easily */
.input_block 
{ 
  padding: 3px 0px 3px 0px;
}

.input_block h4
{ 
  display: inline;
}

.input_block input
{ 
  display: inline;
}

/* for anchors that link to large images */
.expand_image
{ 
  padding: 0px 0px 5px 18px;
  background: url('images/magnifier_zoom_in.png') no-repeat center left !important;
  background: url('images/magnifier_zoom_in.gif') no-repeat center left;
}

.expand_tag
{ 
  padding: 0px 0px 5px 18px;
  background: url('images/tag_blue_add.png') no-repeat center left !important;
  background: url('images/tag_blue_add.gif') no-repeat center left;
}

.flag
{ 
  padding: 0px 0px 5px 18px;
  background: url('images/flag.png') no-repeat center left !important;
  background: url('images/flag.gif') no-repeat center left; 
}



/* a generic error message box */
.error_box
{ 
  border: 3px dashed  #484848;
  background-color: #FFFFFF;
  margin: 30px 30px 30px 30px;
  padding: 20px 20px 20px 20px;
}

.error
{ 
  color: red;
}

.highlight
{ 
  color: #5AC3DD;
}

/* Different img types */
.x270
{ 
  width: 270px;
  height: 360px;
}

.x120
{ 
  width: 120px;
  height: 160px;
}

.x130
{ 
  width: 130px;
  height: 173px;
}

.x81
{ 
  width: 81px;
  height: 108px;
}

.x57
{ 
  width: 57px;
  height: 76px;
}

.x60
{ 
  width: 60px;
  height: 80px;
}

.x30
{ 
  width: 30px;
  height: 40px;
}

/* for collapsible sections */
.collapsible 
{ 
  display: block;
}

.collapsed
{ 
  display: none;
}

/* Pagination styling */
.page_navigation
{ 
  text-align: center;
  border:1px dashed #999999;
  background-color: #eee;
  padding-bottom: 3px;
}

/* Page-specific styling */
/* index.php */
.announcement 
{
  border: 1px solid #484848;
  text-align: left;
  padding: 5px 5px 5px 5px;
  margin: 5px 0px 15px 7px;
  background-color: #FFFFCC;
  width: 543px;
}

.announcement_dismiss
{ 
  float: right;
}

.announcement_more
{ 
  float: right;
}

.previous_pictures 
{ 
  background-color:#eee;
  border:1px solid #ccc;
  float: right;
  margin: 0px 6px 0px 0px;
  text-align:center;
  width:200px;
}

.previous_pictures h4
{ 
  font-weight: bold;
}

.previous_pictures img
{ 
  border: 0px;
  margin: 2px;
}

.winners, .losers
{ 
  clear: both;
  margin: 2px 0px 2px 0px;
}

.winners h6, .losers h6
{ 
}

.winners .score_mh, .losers .score_mh
{ 
  font-size: xx-large;
}

.winners .score_ranking, .losers .score_ranking
{ 
  font-size: large;
}

.comparison 
{ 
  width: 560px;
  text-align: left;
}

.resultpage
{ 
  float: left;
}

.firstpage
{ 
  margin: 0px auto;
}

.comparison form
{ 
  display: inline;
}

.comparison input
{ 
}

.comparison .comparison_submit
{ 
  float: left;
  display: block;
  margin: 3px auto;
}

.comparison_box
{ 
  display: block;
  text-align: left;
  float: right;
  width: 272px;
  margin: 0px 0px 10px 8px;
}

.comparison_box .filled 
{ 
  border: 1px solid #ccc;
  background-color: #eee;
}

.comparison_box h6
{ 
  position: relative;
  top: -3px;
  text-align: center;
}

.comparison_box h6 .expand_image,
.comparison_box h6 .flag
{ 
  margin-left: 10px;
}
.comparison_box h6.flag_warning
{ 
  text-align: left;
}

.comparison_box h6.flag_warning a
{ 
  padding-left: 20px;
}


.comparison_ad
{ 
  display: block;
  float: left;
  width: 120px;
}

.comparison h6 span
{ 
  width: 60px;
  padding-right: 11px;
}

.text_input_small
{ 
  font-size: 9pt;
  width: 130px;
}

.tag_input_submit
{ 
  width: 62px;
  margin-left: 3px;
}

.sex_select 
{ 
  margin: 10px 0px 0px 0px;
  text-align: center;
  clear: both;
}

.comparison_share
{ 
  background-color:#FFFFCC;
  border-bottom:1px dotted #CCCCCC;
  border-top:1px dotted #CCCCCC;
  clear:both;
  float: right;
  margin:10px 0px 0px;
  padding:5px 10px 10px 0px;
  text-align:center;
  width:540px;
}

.comparison_share h3
{ 
  display: inline;
}

.comparison_share input
{ 
  width: 250px;
  position: relative;
  top: -2px;
  border: 1px solid #ccc;
}

.comparison .comment img
{ 
  width: 30px;
  height: 40px;
}

.comparison .comment h6
{ 
  display: none;
}

/* Comment widget default style */

.comments
{ 
  text-align: left;
}

.comments p 
{ 
}

.comments h6
{ 
  text-align: left;
}

.comments .no_comments
{ 
  border: 1px solid #CCCCCC;
  background-color: #FFFFCC;
  margin:5px 0px 0px;
  padding:2px 0px 4px;
  text-align:center;
}

.comment img
{ 
  width: 57px;
  height: 76px;
  float: left;
  margin: 0px 10px 0px 0px;
  border: 1px solid #484848;
}

.comment
{ 
  border-bottom: 1px solid #ccc;
  padding: 3px 3px 4px 3px;
  clear: left;
  background-color: #eeeeee;
  overflow: hidden;
}

.comment_clear
{ 
  clear: left;
}

.comment_form .comment h6
{ 
  text-align: left;
  font-style: italic;
}
.comment_form a
{ 
  
}

.comment_form .delete
{ 
  float: right;
}
.comment_form
{ 
  text-align: center;
}

.comment_form h6
{ 
  text-align: right;
}

.comment_form .login_message
{ 

  text-align: center;
  background-color:#FFFFCC;
  border:1px solid #CCCCCC;
  margin:5px 0px 0px;
  padding:2px 0px 4px;
}

.comment_form textarea
{ 
  width:100%;
  margin: 5px 0px 4px;
}

.comment_form input
{ 
  float: right;
}

.comment_form h4
{ 
  text-align: left;
}

/* account.php */
.account_picture_container
{ 
  text-align: left;
  padding: 0px;
  margin: 0px;
  width: 480px;
}

.account_picture_container table
{ 
  width: 480px;

}

.account_picture_container td
{ 
  margin-right: 10px;
  width: 130px;
}

.account_picture_container td.thin
{ 
  margin-right: 10px;
  width: 60px;
}

.account_picture_container h2
{ 
  display: inline;
}

.account_picture_container .no_pictures 
{ 
  border: 1px solid #999;
  background-color: #eee;
  margin: 10px 0px 0px 0px;
  padding: 5px 5px 7px 5px;
}

.account_picture
{ 
  position: relative;
}

.account_picture img
{ 
  border: 1px solid #484848;
}

.account_picture_message
{ 
  position: absolute;
  bottom: 10px;
  left: 0px;
  border: 1px solid #484848;
  background-color: #FFFFCC;
  z-index: 50;
  width: 120px;
}

.account_details
{ 
  border-left: 1px dashed #424242;
  padding: 10px 0px;
  width: 270px;
  float: right;
}

.account_ad_box
{ 
  float: right;
  width: 270px;
  text-align: center;
  clear: right;
}

.account_ad_box img 
{ 
  margin: 0px auto;
}

.account_tag_popup
{ 
  z-index: 100;
  position: absolute;
  background-color:   #FFFFCC /*#BEF0FF*/;
  border: 1px solid #484848;
  width: 325px;
  top: 0px;
  left: -50px;
  padding: 7px 7px 7px 7px;
  text-align: left;
}

.account_info
{ 
  margin: 0px auto 0px auto;
}

.account_upload_button
{ 
  display: inline;
  text-align: left;
  float: right;
}

.account_upload_container
{ 
  background-color: #FFFFCC;
  padding: 15px 15px 20px 15px;
  text-align: left;
  border: 1px solid #ccc;
}

.account_upload_container h4
{ 
  font-size: 10pt;
}

.account_upload_container h3
{ 
  font-size: 12pt;
}

.account_upload_container .or
{ 
  text-align: center;
}

.account_upload_container h5
{ 

}

/* showscore.php */
.showscore-nav
{ 
  float: right;
  width: 270px;
  margin: 0px 0px 0px 0px;
}

.vert_list a
{ 
  display: block;
  padding: 2px 0px 4px 0px;
  font-size: small;
  /* width: 80%; */
}

.vert_list a.category
{ 
  float: left;
}

.vert_list a.delete_button 
{ 
  width: auto;
  float: right;
}

.vert_list li
{ 
  border-top: 1px solid #484848;
  padding-bottom: 2px;
}

.vert_list li:hover
{ 
  background-color: #ffffcc;
}

.vert_list li.selected
{ 
  background-color: #ffffcc;
}

.vert_list li.selected:hover
{ 
  background-color: #ffffcc;
}

.showscore
{ 
  text-align: center;
  width: 540px;
}


.showscore .owner_options 
{ 
  text-align: left;
  border: 1px solid #999;
  background-color: #eee;
  margin: 3px 20px 0px 20px;
  padding: 3px 3px 4px 3px;
}

.showscore .owner_options p
{ 
  float: right;
}


.showscore_tag_edit
{ 
  border: 1px solid #999;
  background-color: #eee;
  margin: 10px 0px 0px 0px;
  padding: 5px 0px 7px 2px;
}

.showscore_tag_edit .tag_input_submit
{ 
  width: 55px;
}

.showscore_tag_edit .text_input
{ 
  width: 120px;
}

.showscore_tag_edit span 
{ 
  display: block;
  max-width: 70px;
  float: left;
}

.tag_warning
{ 
  color: #999;
}

#tag_submit_response
{ 
  text-align: center;
}

.showscore_scorebox img 
{ 
  border: 1px solid #484848;
  margin: 3px;
}

.showscore_scorebox
{ 
  text-align: center;
  border: 1px solid #aaaaaa;
  background-color: #FFFFCC;
  padding: 0px;
  margin: 0px 0px 6px 0px;
}

.showscore_scorebox h2
{ 
  padding: 0px 0px 10px 0px;
}

.showscore_scorebox table
{ 
  text-align: left;
  padding: 0px 0px 10px 0px;
  width: 175px;
}

.showscore_scorebox .right
{ 
  text-align: right;
}

.showscore_scorebox .score_mh
{ 
  font-size: xx-large;
}

#showscore_picture
{ 
  max-width: 480px;
  width:expression(this.width > 482 ? 480 : true);
}

.score_graph 
{ 
  padding: 6px;
}

.score_graph div 
{ 
  border: 1px solid #aaaaaa;
  height: 160px;
}


.score_graph iframe
{ 
  width: 254px;
  height: 160px;
  overflow: hidden;
}

.showscore_recent
{ 
  margin: 3px 0px 0px 0px;
}

.showscore_recent img
{  
  border: 1px solid #484848;
  display: block;
}

.showscore_recent h4
{ 
  border-bottom: 1px solid #484848;
  margin: 0px 0px 3px 0px;
}

.showscore_recent .win, .showscore_recent .loss
{ 
  float: left;
  text-align: center;
  margin: 3px 3px 3px 2px;
  padding: 0px;
}

.showscore_recent div span
{ 
  margin: -5px 0px 0px 0px;
  padding: 0px;
  font-family: tahoma, verdana, arial, sans-serif;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  color: #484848;
  display: block;
  font-size: small; font-weight: 400;
}

.showscore_recent .loss
{ 
  background-color: #ff3b3b;
}

.showscore_recent .loss span
{ 
  color: #fff;
}

.showscore_recent .win
{ 
  background-color: #3bff3b;
}

.showscore .comment_form
{ 
  margin: 0px 20px 0px 20px;
}

.showscore .comment_title
{ 
  text-align: left;
  margin: 5px 20px 0px 20px;
  border-bottom: 1px solid #484848;
}

.showscore .flag
{ 
  float: right;
  margin-right: 22px;
  padding-top: 3px;
  padding-bottom: 2px;
  margin-top: 4px;
}

#flagCollapse
{ 
  border: 1px solid #999;
  background-color: #eee;
  text-align: left;
  padding: 2px 4px 4px 4px;
  margin: 5px 20px;
}

.flag_warning a
{ 
  padding-left: 20px;
}

/* cool html graph styles */
.graph 
{ 
  position: relative;
  float: left;
  background-color: #fff;
}

.graph_bar
{ 
  background-color:  #ff0000;
  border-top: 1px solid #000000;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
  position: absolute;
  bottom: 0px;
}

/* picture table style */

.picture_container
{ 
  float: left;
  margin-right: 8px;
  overflow: hidden;
  width: 132px;
}

.picture_container img
{ 
  border: 1px solid #484848;
}

.picture_container .picture_container_text
{ 
  text-align: center; 
  margin: 0px 0px 12px 0px;

}

.picture_container .picture_container_text .score_mh
{ 
  font-size: xx-large;
}

.picture_container .picture_container_text .score_mh a
{ 
  font-size: 14pt;
}


/* login.php */
.login_text
{ 
  float: left;
  margin: 15px 10px 0px 0px;
  padding: 10px 10px 10px 10px;
  width: 320px;
  border: 1px solid #484848;
  background-color: #eee;
  clear: left;
  text-align: center;
}

.login_left_column 
{ 
  float: left;
  text-align: center;
  border: 1px solid #484848;
  margin: 0px 10px 0px 0px;
  padding: 10px 10px 10px 10px;
  background-color: #ffffcc;
  width: 320px;
}

.login_right_column
{ 
  margin: 0px 0px 0px 10px;
  padding: 10px 10px 10px 10px;
}

/* signup.php */

.thick_outline
{ 
  border: 1px solid #484848;
  padding: 10px 10px 10px 10px;
  background-color: #FFFFCC;
}

.thick_outline .input_block
{ 
  padding: 10px 0px 10px 0px;
  clear: both;
}

.thick_outline .input_block h4
{ 
  display: block;
  float: left;
  padding: 0px 0px 0px 30px;
  width: 20%;
}

.thick_outline .input_block input
{ 
  display: block;
  float: left;
  margin: 0px 20px 0px 0px;
  width: 20%;
}

.thick_outline .input_block select
{ 
  display: block;
  float: left;
  margin: 0px 20px 0px 0px;
  width: 20%;
}

.thick_outline .error
{ 
  color: #FF0000;
}

.thick_outline h5
{ 
  float: none;
  font-size: small;
  font-weight: normal;
}

.signup_header
{ 
  padding: 10px 5px 20px 5px;
  width: 540px;
}

.signup_header h5
{ 
  display: inline;
}

.signup_header h2
{ 
  padding: 0px 0px 5px 0px;
}

.signup_header p
{ 
  margin: 0px 0px 5px 0px;
}

/* history.php */

.history
{
  text-align: center;
  clear: both;
  margin-left: 2px;
}

.history img
{ 
  border: 1px solid #484848;
  display: block;
}

.history_entry 
{
  clear: both;
  margin: 20px auto 0px auto;
}

.history_picture
{ 
  float: left;
}

.history_text_block
{ 
  float: left;
  padding: 55px 0px 0px 0px;
  margin: 0px 8px 0px 10px;
  width: 200px;
}

.history_navigation
{ 
  text-align: center;
  width: 490px;
}

/* faq.php */
.faq 
{ 
  margin: 0px 70px 0px 0px;
}

.faq h2
{ 
  margin: 0px 0px 5px 0px;
}

.question
{ 
  margin: 0px 0px 20px 0px;
}

.faq_float
{ 
  text-align: center;
  margin: 10px 0px 10px 0px;
}


/* top.php */
.top
{ 
  text-align: left;
}

.top_picture img
{ 
  display: inline;
  border: 1px solid #484848;
}

.top_menu
{ 
  float: left;
  z-index: 10;
  width: 200px;
}

.top_menu select
{ 
  width: 7em;
}

.top_picture_container_container
{ 
  width: 621px;
  float: right;
  overflow: hidden;
}

.top .error_box
{ 
  float: left;
  width: 450px;
}



/* profile.php */
.profile_pictures
{ 
  float: left;
}

.profile_info
{ 
  float: right;
}

/* stat_browser.php */

.stat_browser .menu { 
  float: left;
  z-index: 10;
  width: 200px;
}

.stat_browser select
{ 
  width: 7em;
}

.stat_browser .remove
{ 
  display: inline;
  float: right;
}

.stat_browser .swatch
{ 
  width: 20px;
  height: 20px;
  border: 1px solid #484848;
  float: left;
  margin: 0px 3px 2px 2px;
}

.stat_browser .vert_list li
{ 
  clear: left;
}

.stat_browser_graph 
{ 
  position: relative;
  float: left;
  width: 480px;
  border: 1px solid #aaaaaa;
  height: 360px;
  margin: 0px 0px 0px 10px;
}

.stat_browser_graph iframe
{ 
  width: 480px;
  border: none;
  height: 360px;
  overflow: hidden;
}

/* new_pictures.php */

.new_picture
{ 
}

.new_picture_container
{ 
  margin-left:-1px;
  margin-right:-9px;
}

.new_picture #sex_select_box 
{ 
  float: right;
  padding-top: 6px;
}

.new_picture h2 
{ 
  width: 50%;
}