/* 
  2011 CSS - for 320width and above
*/

@media only screen and (min-device-width : 320px) and (max-device-width : 524px) {
     html {
        -webkit-text-size-adjust: 100%;
     }
}

* {
  margin:0;
  padding:0;
}

body {
  background:#f2f2f2;
  color:#000;
  font-family:Helvetica,Arial;
  font-size:62.5%;
  text-align:center;
  margin:5px 6px;
}

#body {
  background-color:#FFF;
  margin:0px auto; 
  text-align:left;
  width:100%;  
    border:1px solid #aaa;
  border-radius:8px 8px 0 0;  

}

/* tags */
a {text-decoration:none;}
a:active,
a:link,
a:visited {color:#00D;}
a:hover {
  color:#000;
  text-decoration:none;
}


a img {
  border:1px solid #30F;
}
a:hover img {
  border:1px solid #000;
}

form {
  display:inline;
}

h2,h3,h4,h5,h6 {color:#444;clear:both;padding:0 5px}
p,li {padding:0 5px;}

h2 {
  border-bottom:2px solid #444;
  font-size:1.4em;
  margin:0 0 5px 0;
}
h3 {
  border-bottom:1px solid #aaa;
  font-size:1.2em;
  margin:0 0 5px 0;
}
h4 {
  font-size:1.1em;
  margin:1em 0 0 0;
}

img {
  border:1px solid #444;
}

p {
  margin:1em 0;
}
ul,
ol {
  list-style:none;
  margin:0;
  padding:0;
}

.news-image img,
.ni img {
  border-width:1px 0;
  border-style:solid;
  border-color:#444;
  width:100%;
  height:auto;
  
}

/* banner */


#top h1 {
  background:url(/assets/gfx/logo_small.png) center 0px  no-repeat;
  height:37px;
  display:block;
	margin:0;padding:0;
  width:100%;
}
#top h1 a {overflow:hidden;text-indent:-9999px;display:block;width:100%;height:100%;}


/* search box */
#top fieldset {border-width:1px 0 0 0;right:0;bottom:0;padding:5px;margin:0;background-color:#eee;}
#top fieldset #txt {width:77%;border:1px solid #002;;padding:2px 0 3px;margin:0;  color:#113;
  font-family:Arial, Helvetica, sans-serif;
  font-size:1.3em;
}
#top fieldset select {width:20%;border:1px solid #002;;padding:1px 0 1px;margin:0;  color:#113;
  font-family:Arial, Helvetica, sans-serif;
  font-size:1.3em;}
#top fieldset #btn {width:20%;border:1px solid #002;background-color:#CCC;padding:4px 0 3px;margin:0 0 0 3px;}

/* user menu */
#top ul {margin:0;;font-size:1.1em;padding:0px 5px 2px;text-align:center;}
#top ul li {display:inline;list-style:none;padding:2px 0px 2px 5px;color:#555}
#top li a {color:#555;}
#top li a:hover {color:#000;text-decoration:underline}

/* navigation (both header and footer) */
#navigation, 
#footer {
  background-color:#444;
  font-weight:bold;
  padding:5px 2px;
}
#navigation {
  font-size:1.1em;
}
#footer {
  clear:both;
  font-size:1.0em;
  text-align:right;
}

#postfooter {
  margin:1em 0;
  line-height:1.6em;
  clear:both;
  font-size:1.0em;
  text-align:center;
  color:#222;
  font-weight:normal;
}
#postfooter a {color:#222;text-decoration:none;}


ul.nav {
  display:inline;
}
ul.nav li {
  display:inline;
  list-style:none;
  padding:4px 5px;
}
ul.nav li a {
  color:#FFF;
  padding:3px 3px;

}
div#navigation ul.nav li a:hover {
  background-color:#CCC;
  color:#000;
}




/* content */
#content {
  font-size:1.2em;
  line-height:1.6;
  padding:0px 0;
  margin:0 0px;
  zoom:1; 
}

/* thumbnails */

ul.thumbs {position:relative;
  margin:1em 5px;
}
ul.thumbs li {
  display:inline;
  padding:0 5px 3px 0px;
  margin:0;

}
ul#bricks li img {display:block;margin:0;}

.photobox img,
.thumbs img,
.photo img {width:65px;}

/* lists */

ul.links {
  margin:1em 0;
}

ol.stats {padding:10px 25px;}
ul.nice {padding:0 25px;}
ol.stats li,
ul.nice li {list-style:disc;}

/* article */

.article {
  margin:1em 0 2em 0;
}

p.status_0,
li.status_0,
.article.s0 {background-color:#fff0f0;color:#990033;margin:0 -3px;padding:0 10px;font-style:italic;}




/* forms */
.photobox,
fieldset {
  background-color:#f3f3f3;
  border-width:1px 0;
  border-style:solid;
  border-color: #aaaaaa;
  padding:3px 6px 6px;
  margin:0 0 5px 0;
}

fieldset select,
fieldset input,
fieldset textarea {
  border:1px solid #555;
  color:#113;
  font-family:Arial, Helvetica, sans-serif;
  font-size:1.1em;
  font-weight:normal;
  margin:2px 0px;
  padding:3px;
  width:100%;
  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  border-radius:2px;
}

textarea {
  height:150px;
}

label {
  display:block;
  font-size:1.1em;
  font-weight:bold;
  line-height:1.6em;
  margin-top:6px;
}
div.af-0,
fieldset.decline {
  background-color:#fee;
}

fieldset.submit {
	background-color:#efe;
}
fieldset.submit input {font-weight:bold;}



/* list tables */


table {
  border-width:1px 0px;
  border-style:solid ;
  border-color:#444;
  color:#000;
  font-size:1.1em;
  font-weight:normal;
  margin:1em 0;
  border-collapse:collapse;
  width:100%;
  
}
th {
  background-color:#444;
  color:#FFF;
  font-weight:bold;
  text-align:left;
  padding:3px 2px;
}

td {
  margin:0;
  padding:4px ;
  border-bottom:1px solid #444;
  line-height:1.4em;
  vertical-align:top;
}
td.checkbox {
  width:16px;
  text-align:center;
}
td.photo {
  width:65px;
  text-align:center;
}
td b.number {
/*  color:#00d;*/
  font-size:1.1em;
}

td.sightings {
  width:40%;
}

tr.show_all td {text-align:center;font-weight:bold;background:#eee;}

table tr.row-selected {background-color:#aaa;}


tr        {background-color:#F9F9FF;} /* standard table background     */
tr.unseen {background-color:#FFEEEE;} /* no-one has seen this machine  */
tr.seen   {background-color:#E9FFE9;} /* someone has seen this machine */
tr.error  {background-color:#FFDDDD;} /* error row!  */
tr td.x   {background-color:#ffdddd;} /* empty cell */
tr.dnu11  {color:#a00;} /* DNU list */
tr.row-more{display:none;}


tr:hover {background-color:#CCc;}
tr:hover td {border-bottom:1px solid #000;
  border-top:1px solid #000;}

/* tag cloud */

h3.tag-heading {clear:both;margin:1em 0 0 0;padding-top:1em;}

ul.tag-cloud , 
ul.tag-cloud li {list-style:none;;padding:0;}

ul.tag-cloud {margin:0 5px 8px 5px;;}
ul.tag-cloud li {margin:0 8px;float:left;line-height:2.9em;;height:2.9em;display:inline;font-size:1.0em;}
ul.tag-cloud li a {;font-weight:normal;}
ul.tag-cloud li.w0 a {font-size:1.1em;}
ul.tag-cloud li.w1 a {font-size:1.4em;}
ul.tag-cloud li.w2 a {font-size:1.7em;}
ul.tag-cloud li.w3 a {font-size:2.0em;}
ul.tag-cloud li.w4 a {font-size:2.3em;}
ul.tag-cloud li.w5 a {font-size:2.6em;}




/* misc stuff */

.azure {border-width:1px 0;border-style:solid; border-color:#555;background-color:#ffd;padding:5px;font-weight:bold;margin-bottom:1em;}
.azure li {padding-left:24px;line-height:16px;font-weight:normal;padding:3px 3px;display:inline;margin-right:12px;}


label em {color:#00b;}
p.hint u,
label em u {color:#b00;}




.news-image p {text-align:right;font-size:0.9em;margin:0;padding:2px 5px;background-color:#004447;color:#fff;}
.news-image p a {font-weight:bold;color:#fff;}



/* message alerts */
td.edit{padding-left:25px;border-width:1px;}
tr.warning td,
p.messagebox {
  border-color:#444;
  border-style:solid;
  border-width:1px 0px;
  font-weight:bold;
  padding:5px 25px;
}

.messagebox.new {
  background:url(/assets/gfx/icons/new.png) 5px 50% no-repeat #FFF;
}

.messagebox.comments {
  background:url(/assets/gfx/icons/comments.png) 5px 50% no-repeat #FFF;
}

.messagebox.information {
  background:url(/assets/gfx/icons/information.png) 5px 50% no-repeat #ddddff;
}

.messagebox.sightings {
  background:url(/assets/gfx/icons/report.png) 5px 50% no-repeat #ffffcc;
  border-style:dotted;
  font-size:1.3em;
  font-weight:normal;
}
td.edit,
.messagebox.editor {
  background:url(/assets/gfx/icons/user_edit.png) 5px 50% no-repeat #ffff99;
  border-style:dotted;
  font-size:1.3em;
  font-weight:bold;
  color:#
}
.messagebox.notseen {
  background:url(/assets/gfx/icons/report.png) 5px 50% no-repeat #FFDDDD;
  border-color:#700;
}
.messagebox.help {
  background:url(/assets/gfx/icons/information.png) 5px 50% no-repeat #ffffcc;
  border-style:dotted;
  font-size:1.3em;
  font-weight:normal;
}
.messagebox.login {
  background:url(/assets/gfx/icons/lock.png) 5px 50% no-repeat #ffffcc;
 
}
.messagebox.good {
  background:url(/assets/gfx/icons/good.png) 5px 50% no-repeat #ddffdd;
  border-color:#070;

}
tr.warning td,
.messagebox.warning {
  background:url(/assets/gfx/icons/warning.png) 5px 50% no-repeat #ffdddd;
  border-color:#700;
}
.messagebox.needs {
  background:url(/assets/gfx/icons/find.png) 5px 50% no-repeat #FFFFCC;
   border-style:dotted;
    font-weight:normal;
}
.messagebox.favephotos {
  background:url(/assets/gfx/icons/photos.png) 5px 50% no-repeat #FFFFCC;
  border-style:dotted;
  font-weight:normal;
}
.messagebox.admin {
  background:url(/assets/gfx/icons/user_1.png) 5px 50% no-repeat #FFD;
}
.messagebox.getstarted {
  background:url(/assets/gfx/icons/information.png) 5px 50% no-repeat #FFD;
}
.messagebox.rradmin {
  background:url(/assets/gfx/icons/user_rr.png) 5px 50% no-repeat #FFD;
}
.messagebox.map {
  background:url(/assets/gfx/icons/map.png) 5px 50% no-repeat #FFD;
}


div.help {  border-color:#444;
  border-style:dotted;
  border-width:1px 0px;
	padding:5px 25px;font-size:1.2em;
  background:url(/assets/gfx/icons/information.png) 5px 8px no-repeat #ffffee;
}
div.help p {margin:0 0 1em 0;}
/* more lists */
ul.riv{margin:0;padding:0;font-size:1.1em;}
ul.contact {margin:0;padding:0;font-size:1.2em;}


ul.riv li,
ul.contact li {margin: 1em 0;padding:0 2px 0 27px;line-height:16px;list-style:none;background-repeat:no-repeat;}

ul.userlist li a {display:block;font-size:1.2em;}
.userlist li {margin: 1em 0;padding:0 5px;line-height:16px;list-style:none;}
.userlist.d_0 li.count_0 {background-color:#FFEEEE;color:#600;border:1px dotted #f66;padding:3px 5px;}
.userlist.d_0 li.count_1 {background-color:#FFFFdd;color:#333;border:1px dotted #ff6;padding:3px 5px;}

/* books */

ul.books {list-style:none;margin:0;padding:0;}
ul.books li {display:block;width:140px;float:left;list-style:none;margin:0;padding:0 0 10px 0;}

/* forum and comments */

ul.forum,
ul.comments {border-top:1px solid #CCC;;clear:both;}
p.date {font-size:0.8em;margin:0;}

div.forumpost div.meta {color:#444;font-weight:bold;}

li.comment p,
div.forumpost p {padding:0;margin:0 0 1em 0;}
p.posted {font-size:11px;font-weight:bold;color:#444;}
ul.forum {margin:0 0 1em 0;}
div.forumpost ,
li.comment,
ul.forum li {padding:5px;border-bottom:1px dotted #CCC;}
li.sticky-1 {font-weight:bold;background-color:#eee;}
.comment.st0,
div.status-0,
ul.forum li.status-0 {background-color:#FEE;color:#900;}

li.comment h4,
div.forumpost h4,
ul.forum h4,
ul.forum p {margin:0;padding:0;}

li.replies-0.status-1 h4,
li.age-0 h4,
li.age-1 h4,
li.age-2 h4,
li.age-3 h4 {background:url(/assets/gfx/icons/new.png) no-repeat right 50%;padding-right:20px;}
ul.forum li.sticky-1 h4 {background:url(/assets/gfx/icons/sticky.png) no-repeat right 50%;padding-right:20px;}
ul.forum li.res-10 h4 {background:url(/assets/gfx/icons/lock.png) no-repeat right 50%;padding-right:20px;}
ul.forum li.res-11 h4 {background:url(/assets/gfx/icons/lock_open.png) no-repeat right 50%;padding-right:20px;}

li.rr h4,
li.vince h4,
li.ben h4,
div.forumpost div.meta p.user_1,
div.forumpost div.meta p.user_2,
div.forumpost div.meta p.user_rr {font-size:1em;padding-left:20px!important;line-height:16px;font-size:0.8em;}

li.vince h4,
p.user_1 {background:url(/assets/gfx/icons/user_1.png) no-repeat 0 50%;}
li.ben h4,
p.user_2 {background:url(/assets/gfx/icons/user_2.png) no-repeat 0 50%;}
li.rr h4,
p.user_rr {background:url(/assets/gfx/icons/user_rr.png) no-repeat 0 50%;}

/* submit sightings */

#submitform textarea {height:50px;}
div.adder {clear:both;text-align:right;font-weight:bold;}
div.adder a {background:url(/assets/gfx/icons/add.png) no-repeat right 50%;padding-right:20px;line-height:20px;margin:0;}

.submitform {display:none;}
#submit_0 {display:block;}
/* display nones */

hr,
#skip,
body.aPhoto li.status_0,
legend ,
div#country_box,
div#country_box *,
#usermenu,
#nav_news,#nav_comments,#nav_dptgen,#nav_books,#nav_links,#top ul li#you_obs ,
#adminmenu {display:none;}

/* clears */

.clear {clear:left;}
div.clear {
  zoom:1;
  clear:both; 
  margin:1em 0;
}

/* home page */
#companyintro,
#welcome {
	border-bottom:1px solid #444;

	font-size:1.2em;
}

#welcome h2 {padding:5px;}
p#introcopyright {display:none;}
ul.alpha {padding:0 5px;margin:0 0 10px;}
ul.alpha li {display:inline;padding:2px 2px;float:left;}
ul.alpha li.active,
ul.alpha li#thisyear {background:#ddf;font-weight:bold;}
ul.alpha li.active a,
ul.alpha #thisyear a {color:#000;}
ul.alpha:after {clear:both;margin:10px 0 0 0;}
span.getsightingrr,
span.getsightingotp {color:#00f;padding:2px;cursor:pointer;line-height:20px;

background:url(/assets/gfx/icons/loading.gif) -50px 50% no-repeat #fff;

}


table span.getsightingrr.aloading ,
table span.getsightingotp.aloading 
{background:url(/assets/gfx/icons/loading.gif) 2px 50% no-repeat #fff;padding:2px 2px 2px 40px;font-style:italic;}


table span.getsightingrr.done ,
table span.getsightingotp.done 
{color:#003;}



blockquote {font-style:italic;background:#f2f2ff;padding:1px 5px;}


div#commentarea {display:none;}


div.facts span {color:#fff;font-size:1px;width:1px;overflow:hidden;}

#revisions ins {background:#dfd;color:#070;font-weight:bold;}
#revisions del {background:#fdd;color:#700;font-weight:bold;}

#zintro{
  background:#fff2f2;
  border-bottom:1px dashed #a00;
  color:#fff;
  font-weight:bold;
  padding:5px 22px;
  /*width:100%;*/
  position:relative;
  margin:0 0 0px;
}  
#zintro h2 {
  font-size:1.6em;
  padding:4px 0;
  color:#a00;
  margin:5px 0;
  border:0;
}
#zintro p {
  font-size:1.4em;
  padding:0;
  margin:1em 0;
  color:#a00;
}

#sighting-form {display:none;}


#loginbox .field {width:50%;float:left;}
#loginbox .field input[type="text"] {width:98%;}
#loginbox #lgn {clear:both;}



tr.seen p.ob {background:url(/assets/gfx/icons/good.png) 0 50% no-repeat;padding:3px 20px;margin:0;}

#admin {border:1px solid #555;box-shadow:0 0 3px #CCC;}

#form_sightings  {border-style:dotted;  background:url(/assets/gfx/icons/report.png) 5px 5px no-repeat #ffffcc;
border-color:#555;}

#admin label,
#form_comments label,
#form_sightings label {float:left;width:24%;margin:8px 0px 0 0!important;clear:both;font-weight:normal;text-align:right;padding-top:2px;text-shadow:0 0 1px #fff;;}


#form_sightings label.friend {width:73%;float:right;clear:right;;margin:0;text-align:left;padding:0 0 3px 0;}
#form_sightings label.friend input {width:auto;float:none;margin:3px 10px 0 0;}


#admin p.hint,
#form_comments p.hint,
#form_sightings p.hint {float:right;width:73%;margin:2px 0 0;clear:both;font-size:0.9em;padding:0;color:#444;font-style:italic;}

#admin input,
#admin textarea,
#admin select,
#form_comments input,
#form_comments textarea,
#form_sightings textarea,
#form_sightings input {float:right;width:73%;margin:8px 0 0px 0;}
#admin input[type="submit"],
#form_comments input[type="submit"],
#form_sightings input[type="submit"] {float:right;font-weight:bold;width:150px;background:#ddd;border-radius:0;margin-left:10px;clear:both;}
#admin div {width:73%;float:right;clear:both;}
textarea:focus,
input:focus {box-shadow:0 0 5px #00a;border-color:#00d;}




ul.photos-m {
  margin:1em 0px;
}
ul.photos-m li {
  display:inline;
}

ul.photos-m li img {width:100px!important;height:66px;;border:5px solid white;box-shadow:0 0 3px #666;
margin:7px;}


fieldset.sighting_validation {display:none;}


#introw{
  background:#FFFFdd;
  border-bottom:1px dashed #444;
  color:#003;
  font-weight:bold;
  padding:5px 22px;
  /*width:100%;*/
  position:relative;
  margin:0 0 0px;
}  
#introw h2 {
  font-size:1.6em;
  padding:4px 0;
  margin:5px 0;
  border:0;
}
#introw p {
  font-size:1.3em;
  padding:0;
  margin:1em 0;
}
#introw a {border-bottom:1px dotted #aaf;}