/*
Author: Stephanie Burns
Date: 

This stylesheet is structured so that everything is alphabetical for ease of finding. That means that things like "background, font, padding..." are all in alphabetical order, as well as the elements, like "a, blockquote, h1..." I've no idea if this is correct or not, but it makes it easier to find them. As per my traditional methods, the top part is stylizing of the text and elements, the bottom is structure.

Feel free to take BITS of the stylesheet... not whole chunks. If you're going to do that, don't be an idiot; at least make sure you screw with it so I can't tell. But don't copy the design or take my pictures... it makes me sad.
*/

/* global white space reset to kill browser defaults: http://leftjustified.net/journal/2004/10/19/global-ws-reset/ */
* {
margin: 0;
padding: 0;
}
/* end credit */

body {
background: #232323 url(http://www.greydove.org/changeling2/bg.gif);
color: #000000;
font: .8em "trebuchet ms", helvetica, tahoma, serif;
margin-top: 5%;
}

/* Text and element styles */

a {
text-decoration: none;
}

a:link {
color: #5b5b5b;
border-bottom: 1px #5b5b5b dotted;
}

a:visited {
border-bottom: 1px #5b5b5b dotted;
color: #282828;
background: #ffffff;
}

a:hover {
background: #ececec;
border-bottom: 1px #5b5b5b dotted;
color: #282828;
}

blockquote, ol, ul {
margin: 0 0 1.3em 1.5em;
}

blockquote {
background: #ececec;
border-left: 5px #282828 solid;
color: #5b5b5b;
font: 1.1em "courier new", courier, georgia, "times new roman", serif;
padding: .3em .3em .3em .5em;
width: 75%;
line-height: 150%;
}

code {
color: #c40034;
font: .9em "courier new", courier, monospace;
}

/* these are mainly used for positioning my images */

div.left {
float: left;
}

div.right {
float: right;
}

div.center {
margin: 0 auto;
text-align: center;
}

/* end */

h2, h3, h4, h5, h6 {
font-family: "trebuchet ms", tahoma, verdana, "sans serif";
margin-bottom: 1em;
}

h1 a, h1 a:link, h1 a:visited, h1 a:hover {
color: #ffffff;
background: none;
border: 0;
}

h2.green {
border-bottom: 3px #aaf24e solid;
font-size: 1.5em;
}

h2.orange {
border-bottom: 3px #ffa300 solid;
font-size: 1.5em;
}

h2.pink {
border-bottom: 3px #ff0056 solid;
font-size: 1.5em;
}

h2.yellow {
border-bottom: 3px #fff831 solid;
font-size: 1.5em;
}

h2.blue {
border-bottom: 3px #5eddf1 solid;
font-size: 1.5em;
}

h3.green {
font-size: 1.2em;
color: #259a00;
border-bottom: 1px #259a00 dotted;
margin-bottom: .5em;
}

h3.orange {
font-size: 1.2em;
color: #b45000;
border-bottom: 1px #b45000 dotted;
margin-bottom: .5em;
}

h3.pink {
font-size: 1.2em;
color: #c40034;
border-bottom: 1px #c40034 dotted;
margin-bottom: .5em;
}

h3.yellow {
font-size: 1.2em;
color: #9a9a00;
border-bottom: 1px #9a9a00 dotted;
margin-bottom: .5em;
}

h3.blue {
font-size: 1.2em;
color: #0083a3;
border-bottom: 1px #0083a3 dotted;
margin-bottom: .5em;
}

img, img a, img a:link, img a:visited, img a:hover, img a:active {
border: 0;
}

img.border {
border: 5px #232323 solid;
margin: 7px;
}

img.small {
border: 3px #232323 solid;
margin: 3px;
}

input {
background: #c9f8ff;
border: 1px #232323 solid;
padding: 3px 5px;
margin: .5em;
}

p {
margin-bottom: 1.3em;
line-height: 150%;
}

/* IE q-tag fix: http://www.alistapart.com/articles/qtag */
q:before, q:after {
content: "";
}
/* end credit */

ul li {
list-style-image: url(http://www.greydove.org/changeling2/bullet.gif);
margin-bottom: 1em;
}

textarea {
background: #c9f8ff;
border: 1px #232323 solid;
height: 100px;
margin: .5em;
overflow: auto;
padding: 5px;
width: 350px;
}

/* Structure-y bits */

#wrap {
text-align: center;
margin: 0 auto;
width:65%;
min-width: 850px;
}

#navigation {
padding: 0;
}

    #left {
    float: left;
    }
    
    #right {
    float: right;
    }
    
        #nav li {
        display: inline;
        margin: 0;
        padding: 0;
        }
        
        #right li a {
        color: #000000;
        float: right;
        display: block;
        text-decoration: none;
        border: 0;
        font-size: 1.5em;
        font-weight: bold;
        width: 4.5em;
        text-align: right;
        margin-left: 1em;
        padding: .5em;
        }
        
        #nav #about {
        background: #aaf24e;
        }
        
        #nav #gd {
        background: #ffa300;
        }
        
        #nav #blog {
        background: #ff0056;
        }
        
        #nav #links {
        background: #fff831;
        }
        
        #nav #home {
        background: #5eddf1;
        }
        
        #nav #about:hover {
        background: #259a00;
        color: #ffffff;
        }
        
        #nav #gd:hover {
        background: #b45000;
        color: #ffffff;
        }
        
        #nav #blog:hover {
        background: #c40034;
        color: #ffffff;
        }
        
        #nav #links:hover {
        background: #9a9a00;
        color: #ffffff;
        }
        
        #nav #home:hover {
        background: #0083a3;
        color: #ffffff;
        }
        
#green {
clear: both;
background: #aaf24e;
padding: 1em 4em;
}

#orange {
clear: both;
background: #ffa300;
padding: 1em 4em;
}

#pink {
clear: both;
background: #ff0056;
padding: 1em 4em;
}

#yellow {
clear: both;
background: #fff831;
padding: 1em 4em;
}

#blue {
clear: both;
background: #5eddf1;
padding: 1em 4em;
}

#content {
background: #ffffff;
padding: 1.5em;
text-align: justify;
}
    
#footer {
clear: all;
color: #ffffff;
font-size: .8em;
padding-top: 1em;
text-align: center;
}

    #footer a, #footer a:link, #footer a:visited {
    color: #fff831;
    text-decoration: none;
    border: 0;
    background: none;
    }
    
    #footer a:hover {
    background: none;
    border-bottom: 1px #ff0056 dotted;
    }
    
/* Classes for BellaBuzz */

.question {
font-weight: bold; 
margin: 0 0 .5em 0;
}

.answer { 
margin: 0 0 1em .5em;
}

.dates {
display: block;
text-align: right;
font-size: .7em;
}

/* end */