/************** MAIN STYLES **************/

body {
margin: 0;
font-family: "Verdana", Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
}

h2 {
color: #fff;
font-size: 0.85em;
position: relative;
top: -21px;
}

h3 {
color: #006666;
color: #000;
letter-spacing: -0.05em;
font-size: 1.35em;
}

h1 a {
color: #fff;
}

h4,
h4 a {
color: #000;
}

img {
border: none;
}

a {
text-decoration: none;
color: #066;
}

a:hover {
text-decoration: underline;
}

ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}

ul {
margin: 0 1em;
}

ul li {
list-style-image: url(img/bullet2.gif);
}

ul li ul li {
list-style-image: url(img/bullet1.gif);
}



/************** FORMS **************/

form {
font-size: 12px;
}

fieldset {
padding: 1em;
}

input[type='submit'],
input[type='button'] {
color: #333;
font-size: 0.9em;
text-align: center;
width: auto;
margin: 0.5em auto;
padding: 0.05em 2em;
display: block;
border: 3px double #999;
border-top-color: #ccc;
border-left-color: #ccc;
background: #fff url('img/button_background.gif') repeat-x;
font-weight: bold;
}

input[type='submit']:hover {
border: 3px double #999;
}

input[type = "text"],
input[type = "password"] {
margin-bottom: 0.5em;
padding: 0.075em 0.5em !important;
background: #eaeaea;
border: 1px solid #999;
width: 90%;
}

input[type = "text"]:hover,
input[type = "password"]:hover,
input[type = "text"]:focus,
input[type = "password"]:focus {
border: 1px solid #000;
background: #fff;
}



/************** LAYOUT DECISSIONS **************/

div#slashboxes {
float: left;
width: 21%;
padding: 1%;
font-size: 0.7em;
}

div#slashboxes h4 {
margin-bottom: 1em;
border-bottom: 1px dotted #066;
}

#slashboxes div.block {
margin-bottom: 2em;
padding: 2%;
}

#slashboxes div.block:hover {
background: #f5f5f5;
}

div#slashboxes ul {
padding-left: 0.5em;
}

div#slashboxes ul li {
margin: 0.5em 0;
}

div#slashboxes ul li a {
font-weight: bold;
}

div#slashboxes ul li ul li a {
font-weight: normal;
}

ul#ostgnavbar,
div#topnav ul,
div#jump {
display: none;
}

/* The top banner is correctly styled, but I prefer not to show it on this prototype */
div.ad1 {
display: none;
position: absolute;
right: 0;
}

div#frame {
background: #f0f0f0;
}

div#articles {
padding-bottom: 1em;
background: #fff;
border-left: 3px double #bbb;

}

div.search {
position: absolute;
top: 95px;
right: 0.5em;
}



/************** HEADER **************/

div#topnav {
background: #066 url(img/header.gif) no-repeat top right;
height: 89px;
}

div#logo {
height: 85px;
background: url(img/logo.png) no-repeat;
}

div#logo h1 {
margin-left: 30px;
display: none;
}

div#slogan {
height: 0;
padding-left: 30px;
}

div.search {
text-align: right;
}

div.search fieldset {
margin: 0;
padding: 0;
border: none;
}

div.search input {
margin: 0;
padding: 0;
display: inline;
width: auto;
}

div.search input[type='text'] {
width: 50%;
}



/************** FOOTER **************/

div#footer {
padding-top: 1em;
clear: both;
text-align: center;
}

div#footer div.rightcontent {
margin-top: -3em;
padding: 0.5em 0 1.25em 0;
clear: both;
background: #fff;
font-style: italic;
letter-spacing: 0.025em;
}

div#footer div.rightcontent:after {
content: '»'
}

div#footer div.rightcontent:before {
content: '«'
}

div#footer div.copyright {
padding: 0.4em 0;
color: #eee;
background:#222;
font-size: 0.70em;
}

div#footer div.copyright a {
color: #fff;
font-weight: bold;
}

div.btmnav {
padding: 0.5em 0;
background:#066;
font-size: 0.8em;
text-align: center;
}

div.btmnav a {
color: #fff;
}

div.btmnav ul {
padding: 0.75em 0;
}

div.btmnav ul li {
display: inline;
margin: 0 0.5em;
}



/************** HORIZONTAL MENU **************/

div#links div.block div {
display: none;
}

div#links:after {
background:#222;
color: #fff;
display: block;
content: "";
height: 2em;
margin-bottom: 2em;
}

div#links div.block div.title {
display: inline;
font-size: 0.8em;
padding: 0.5em 0;
float: left;
}

div#links div.block div.title h4,
div#links div.block div.title h4 a {
padding: 0 1em;
color: #fff;
margin-bottom: 0.50em;
}

div#links div.block div.title h4 a:hover {
text-decoration: none;
}

div#links div.block:hover div.title {
background: #cae5Ef;
}

div#links div.block:hover div.title * {
color: #007 !important;
}

div#links div.block div.content {
position: absolute;
left: 0;
top: 121px;
width: 100%;
padding: 0.4em 0;
background: url(/slashdot/template/img/shadow.png) 0 1.7em repeat-x !important;

}

div#links div.block div.content * {
float: left;
color: #007;
}

div#links div.block div.content a {
padding: 0 1em;
font-size: 0.8em;
}

div#links div.block div.content ul {
padding: 0.35em 0;
margin: 0;
margin-top: -0.4em;
background: #cae5ef;

width: 100%;
height: 1em;
}


div#links div div ul li {
list-style-image: none;
}

div#links div.block:hover div.content {
display: block;
}

div#links-sections-title {
background: #cae5ef; !important;
color: #007 !important;
}

div > div#links-sections-content{
display: block !important; 
}

div#links-sections-title h4 {
color: #007 !important;

}


/************** ARTICLES **************/

div#articles {
padding: 3em 1% 1% 1%;
margin-top: -2em;
float: left;
width: 74.75%;
}

div.details {
font-size: 0.7em;
padding: 0.5em;
border-bottom: 1px solid #699;
background: #eee;
text-align: right;
/* TODO:This is a non-standard MOZILLA extension, should be replaced later by images. */
-moz-border-radius-topleft: 30px;
}

div.details b,
div.details strong {
font-weight: normal;
}

div.details a {
font-weight: bold;
}

div.details strong b {
font-weight: bold;
}

div.section {
background: #0ff;
}

div.topic {
float: left;
padding: 1% 2%;
}

div.intro {
color: #666;
font-style: italic;
}

div.intro i {
color: #000;
font-style: normal;
}

div.intro i:after {
content: '»'
}

div.intro i:before {
content: '«'
}

div.body {
font-size: 0.925em;
margin: 1em 0;
}

div.storylinks {
text-align: right;
margin-bottom: 1.75em;
float: none;
}

div.storylinks ul {
margin: 0;
display: inline;
}

div.storylinks li {
display: inline;
}

div.briefarticle {
margin: 1em 0 2em 0;
padding: 0.5em 1em;
background: #cae5ef;
font-size: 0.9em;
display: block;
/* TODO:This is a non-standard MOZILLA extension, should be replaced later by images. */
-moz-border-radius: 15px;
}

div.briefarticle span.storytitle {
font-weight: bold;
}



/************** MISC **************/

div.content li h2 a {
display: none;
}

div#olderstuff-content em {
font-size: 0.75em;
}

ul li br {
display: none;
}

div#f11 {
position:fixed;
bottom: 0;
right: 0;
text-align: right;
font-size: 0.55em;
background: #066;
color: #fff;

padding: 0.25em 1em;
}

div#f11 kbd {
font-weight: bold;
}


div#slashboxes h4 a {
color: #fff !important;
text-decoration: none;
}

div#slashboxes h4 {
background: #066;
color: #fff !important;
padding: 0.25em 0.5em;
font-size: 1.1em;
/* TODO:This is a non-standard MOZILLA extension, should be replaced later by images. */
-moz-border-radius-topleft: 11px;
border: 2px double #eaeaea;
}

acronym:hover {
cursor: help;
}

div#login-content b a {
background: url(img/ico_log.gif) no-repeat 0 2px;
padding-left: 15px;
}

div#olderstuff-content b a,
div#poll-content a {
background: url(img/ico_doc.gif) no-repeat 0 1px;
padding-left: 15px;
}



#login-content label {
font-size: 0.95em;
width: 43%;
float: left;

/*hack*/
margin-top: 2px;
}

#login-content input[type='text'],
#login-content input[type='password'] {
display: inline;
width: 48%;
}

#login-content input[type='checkbox'] {
margin-left: 0;
}

#login-content label.checkbox {
width: auto;
display: inline;
font-size: 0.8em;
/* hack */
margin-top: 5px;
}

#login-content input[type='submit'] {
width: 7em;
padding: 0em;
float: right;
}

.storylinks {
color: #fff;
font-size: 0.95em;
}

.storylinks ul li {
color: #000;
}

.storylinks ul li a b {
background: url(/slashdot/template/img/read_more_icon.jpg) no-repeat;
padding-left: 25px;
}

div#links-sections-title {
display: none !important;
}

div#system {
  text-align: right;
  font-weight: bold;
  font-size: 0.75em;
  font-style: italic;
  margin-top: -1em;
  margin-bottom: 2em;
  color: #444;
}