/*
 * Stylesheet for SxipMonkey Profile application.
 * Images are in ../images
 */

body { color: #666; background-color: inherit; }
table th { color: #000; background-color: inherit; font-weight: normal; }
b, strong { font-weight: normal; color: #000; background-color: inherit; }
a:link { color: #00b3e3; }
a:visited { color: #0083a3; }
a:hover {  text-decoration: underline; }

#menu { text-align: right; }
#nav li.active { color: #000; background-color: inherit; }
#nav li.active a { color: #000; background-color: inherit; border-bottom: solid 2px #00b3e3; padding: 4px 0px; }
#nav li.last { padding-right: 0px; }
#nav a:hover { text-decoration: none; }

/* Reset some rules from tryitout.css */
#header { height: 90px; }

#feedback-btn { float: right; }
#feedback #email,
#feedback #subject,
#feedback #comment { width: 400px;}
#feedback #captcha { width: 195px; }
#feedback img.captcha { vertical-align: bottom; }

/* li { margin: default; padding: default; text-indent: default; } */
li { margin: inherit; padding: inherit; text-indent: inherit; }
ul li { list-style: disc; }
ol li { list-style: decimal; }

.footer_feed img { padding-top: 2px; vertical-align: top; }

#sidebar { float: right; margin-bottom: 50px; }

label .required { color: #f00; font-weight: bold; }

/* wrapper width: 850px */
table { border-collapse: collapse; border-width: 0px; margin: 0px; padding: 0px; }
table caption { font-size: 12px; text-align: right; }
table th, table td { text-align: left; vertical-align: top; padding: 4px; }

table.map { width: 850px; clear: both; }
table.map tbody tr { border-top: 1px solid #ccc; }
table.map th, table.map td { vertical-align: top; padding: 4px; }
table.map th { border-bottom: solid 1px #ccc; cursor: pointer; }
table.map th.sorted-up {
    background-image: url("../images/arrow_up.png");
    background-repeat: no-repeat;
    background-color: #E6F5FA;
}
table.map th.sorted-down {
    background-image: url("../images/arrow_down.png");
    background-repeat: no-repeat;
    background-color: #E6F5FA;
}
table.map th.url { background-position: 412px 50%; }
table.map th.type { background-position: 144px 50%; }
table.map th.credit { background-position: 94px 50%; }
table.map th.credited-user { background-position: 144px 50%; }
table.map th:hover {
    background-repeat: no-repeat;
    background-image: url("../images/arrow_dwn_gray.png");
    background-color: #eee;
}
table.map th.sorted-down:hover {
    background-repeat: no-repeat;
    background-image: url("../images/arrow_down.png");
    background-color: #E6F5FA;
}
table.map td.url { width: 418px; }
table.map td.type { width: 150px; }
table.map td.credit { width: 100px; }
table.map td.credited-user { width: 150px; }
table.map td.sorted { background-color: #eee; }
.sort-btn { color: #00f; cursor: pointer; }

/* User Levels */
.level-expert,
.level-advanced,
.level-intermediate,
.level-novice,
.level-beginner,
.level-expert:hover,
.level-advanced:hover,
.level-intermediate:hover,
.level-novice:hover,
.level-beginner:hover {
    text-decoration: none;
}

.level-expert .box,
.level-advanced .box,
.level-intermediate .box,
.level-novice .box,
.level-beginner .box {
  /*
  display: inline-block;
  width: 0.6em;
  height: 0.6em;
  */
  font-size: 0.7em;
  padding-left: 0.3em;
  padding-right: 0.4em;
  border: 1px solid;
  position: relative;
  top: -0.2em;
}

.level-expert .nickname,
.level-advanced .nickname,
.level-intermediate .nickname,
.level-novice .nickname,
.level-beginner .nickname {
  margin-left: 0.6em;
  margin-right: 0.1em;
}

.level-expert .box { color: #fff; background-color: #000; border-color: #999; }
.level-advanced .box { color: #fff; background-color: #542806; border-color: #542806; }
.level-intermediate .box { color: #000; background-color: #3D9E00; border-color: #3D9E00; }
.level-novice .box { color: #000; background-color: #F5BF00; border-color: #F5BF00; }
.level-beginner .box { color: #000; background-color: #fff; border-color: #999; }
#level-names .level-expert .box,
#level-names-horiz .level-expert .box { border-color: #fff; }
#level-names .level-beginner .box,
#level-names-horiz .level-beginner .box { border-color: #fff; }

#levels { }
#level-indicator { float: left; }
#level-indicator img { display: none; background-color: #fff; border: 0px; padding: 0px; }
#level-indicator img.level-expert { display: block; margin-top: 7px; }
#level-indicator img.level-advanced { display: block; margin-top: 32px; }
#level-indicator img.level-intermediate { display: block; margin-top: 57px; }
#level-indicator img.level-novice { display: block; margin-top: 82px; }
#level-indicator img.level-beginner { display: block; margin-top: 107px; }
#level-names { width: 120px; margin-left: 20px; color: #fff; background-color: #666; -moz-border-radius: 6px; -webkit-border-radius: 6px; padding: 5px; }
#level-names div { height: 20px; margin-bottom: 5px; }
#level-names div.last { margin-bottom: 0px; }
#level-names img { display: block; }
#level-names .nickname { color: #fff; background-color: inherit; margin-right: 0.2em; }
/* level name image height: 25px */
/* indicator height: 17px */

#level-names-horiz { float: right; color: #fff; background-color: #666; -moz-border-radius: 6px; -webkit-border-radius: 6px; padding: 5px; font-size: 80%; margin-bottom: 1em; }
#level-names-horiz div { float: left; margin-right: 10px; }
#level-names-horiz div.last { margin-right: 0px; }
#level-names-horiz .level-expert .box,
#level-names-horiz .level-advanced .box,
#level-names-horiz .level-intermediate .box,
#level-names-horiz .level-novice .box,
#level-names-horiz .level-beginner .box {
    top: -0.1em;
}

/* Edit form for logged in users */
/* #edit-form { position: absolute; top: 100px; left: 400px; } */
/*#edit-form { float: right; margin-left: 0px; } */
#edit-form form { padding: 0px; margin: 0px; }

#profile-edit-form { width: 550px; padding: 0px; margin: 0px; }
#profile-edit-form th label { white-space:  nowrap; }
#profile-edit-form input.text { width: 450px; }
#profile-edit-form textarea { width: 450px; }
#profile-edit-form td.submit { text-align: right; }
#profile-edit-form td p { font-size: 80%; }

#top-mappers { float: left; margin-right: 20px; margin-bottom: 50px; }
#top-mappers h2 { margin-top: 0px; }
#top-mappers table { width: 315px; }
#active-mappers table { width: 315px; }
/*
#active-mappers { float: left; margin-right: 20px; margin-bottom: 50px; }
#active-mappers h2 { margin-top: 0px; }
*/

/* #formsubmit { display: none; } */

#contact-link { }

#contact-form {
    display: none;
    position: absolute;
    top: 120px;
    /* left: 100px; */
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    height: 300px;
    color: #fff;
    background-color: #666;
    padding: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}
#contact-form a,
#contact-form table th,
#contact-form table td { color: #fff; }
#contact-form table th label .required,
#contact-form table td label .required, { color: #f00; font-weight: bold; }
#contact-form td.submit { text-align: right; }
#contact-form .close-btn { width: 17px; float: right; }
#contact-form .close-btn a { color: #fff; text-decoration: none; }
#contact-form form { clear: both; display: none; }
#contact-form form input.text { width: 350px; }
#contact-form form textarea { width: 350px; }

#contact { width: 500px; padding: 0px; margin: 0px; }
#contact th label { white-space:  nowrap; }
#contact input.text { width: 400px; }
#contact textarea { width: 400px; }
#contact td.submit { text-align: right; }
