/*------------------*
 *floppy01          *
 *style sheet       *

aquablu
11a7d7
darkaquablu
0f89b0
darkeraquablu
076c8a

altaqua
b3e4ff
darkaltaqua
92bbd1
darkeraltaqua
2f779e

yak
d58010
darkyak
b04e0b
darkeryak
8a3d09

altyak
d0b000
darkaltyak
ab9100
darkeraltyak
837000

litegray
d6d6d6
darkgray
292929
black

altltgray
d1d1d1
altdkgray
2e2e2e
 *------------------*/

body {
 margin: 0;
 padding: 0;
 font-family: Helvetica, Arial, sans-serif;
 font-size: 1em;
 background-color: #ccc;
 color: #f00;
}

p {
 border: 1px solid red;
 padding: 30px 30px 20px;
 margin: 1px 30px;
 min-height: 1em;
}

h1, h2, h3, h4 {
 text-decoration: none;
 font-weight: normal;
}

h1 {
 background-color: #f00;
 color: #fff;
 font-size: 2em;
 margin: 0;
 padding: 0 1em;
}

h2 {
 font-size: 1.5em;
 background-color: red;
 color: white;
 text-align: center;
 margin: 0 30px;
}

h3 {
 font-size: 1.2em;
 background-color: black;
 color: white;
 border: 1px solid red;
 text-align: center;
 margin: 20px 30px 0;
}

h4 {
 font-size: 1em;
 background-color: white;
 color: red;
 border: 1px solid black;
 margin: 10px 30px 0;
 padding: .2em 1.2em .1em;
}

a:link {
}

a:hover {
}

a:active {
}

a:visited {
}

ul {
 border: 1px solid red;
 padding: 1em 2em;
 margin: 1px 30px;
 min-height: 1em;
 list-style: square;
 
}

.news {
 font-family: Times, "Times New Roman", sans-serif;
}

.bandname {
 background-color: black;
 color: white;
 padding: .1em .2em;
}

/* Layout
 *--------------------*/

#wrapperWrapper {
 padding: 0;
 margin: 0 auto;
 width: 810px;
 background-image: url(../images/wrappershadowlite.png);
 background-position: center top;
 background-repeat: repeat-y;
 min-height: 600px;
 border: none;
}

#pageWrapper {
 width: 800px;
 padding: 0;
 margin: 0 auto;
 background-color: #eee;
 color: #123;
 border: none;
 min-height: 600px;
}

#header {
 margin: 0;
 padding: 0;
 width: 800px;
 height: 5em;
}

#main-content {
 margin: 0;
 padding: 0;
 width: 800px;
 min-height: 21em;
 position: relative;
}

#footer {
 margin: 0;
 padding: 0;
 width: 800px;
 min-height: 7em;
 bottom: 0px;
 background-color: red;
}


/* Nav bars
 *---------------------*/

#main-nav {
 height: 1em;
 width: 800px;
 margin-top: .5em;
 margin-bottom: 200px;
 padding-top: .3em;
 padding-bottom: 0em;
}

#footer-nav {
 height: 1em;
 width: auto;
 margin-top: .5em;
 margin-bottom: 0;
 padding-top: 0;
 padding-bottom: .3em;
}

div.nav {
 text-align: center;
 border: 1px solid #ff7c00;
 border-width: 1px 0;
 background-color: #ffd33b;
 color: inherit;
}

.nav a {
 text-decoration: none;
 border-style: solid;
 border-width: 1px;
 border-bottom-width: 2px;
 border-top-width: 0px;
 border-color: #ff7c00;
 background-color: #ffd33b;
 color: #005454;
 padding: 0px 3px 2px;
 margin: .5em 0em;
}

.nav a:link {
}

.nav a:hover {
 border-width: 2px;
 border-bottom-width: 3px;
 padding: 0px 2px 1px;
 background-color: #ffda5f;
 color: #1e7e7e;
}

.nav a:active {
 border-width: 1px;
 border-top-width: 3px;
 padding: 0px 3px 2px;
 background-color: #1e7e7e;
 color: #ffda5f;
}

.nav a:visited {
}

#home #n-home a, #about #n-about a,
#music #n-music a, #news #n-news a,
#contact #n-contact a{
 border-color: transparent;
 background-color: transparent;
 color: #005454;
}

#footer p a {
 color: red;
 background-color: #ffd33b;
 padding: 1px .3em;
 text-decoration: none;
 font-weight: normal;
}

#footer p {
 text-align: center;
 bottom: 0px;
 padding: 3em 0 0;
 margin: 0;
 color: #ffd33b;
}

/* Missing Floppies
 *---------------------*/
p.photo {
 text-align: center;
}

.photo img {
 border: 1px solid red;
}

#missing1 {
 float: left;
 background-image: url(../images/floppy_rollover_ted.png);
 background-position: left center;
 background-repeat: no-repeat;
}

#missing2 {
 float: left;
 background-image: url(../images/floppy_rollover_jean.png);
 background-position: left center;
 background-repeat: no-repeat;
}

#missing3 {
 float: right;
 background-image: url(../images/floppy_rollover_john.png);
 background-position: left center;
 background-repeat: no-repeat;
}

#missing4 {
 float: right;
 background-image: url(../images/floppy_rollover_dave.png);
 background-position: left center;
 background-repeat: no-repeat;
}

#missing1:hover {
 background-position: right center;
}

#missing2:hover {
 background-position: right center;
}

#missing3:hover {
 background-position: right center;
}

#missing4:hover {
 background-position: right center;
}


.missingfloppy {
 background-image: url(../images/mysteryfloppy200x200.png);
 background-position: center center;
 background-repeat: no-repeat;
 height: 200px;
 width: 200px;
}

.missingfloppy img{
 border: none;
}

/* About Floppies
 *----------------*/
img.history {
 position: relative;
 border: 1px solid red;
 float: right;
 margin: -20px -20px 0 1em;
 height: 200px;
 width: 200px;
}

.member {
 clear: both;
 position: relative;
}

.member ul {
 position: relative;
 list-style: none;
 min-height: 200px;
 padding: 10px;
}

.member li {
 padding: 1em 1em .5em 1em;
}

.member img {
 position: relative;
 float: left;
 border: 1px solid red;
 height: 200px;
 width: 200px;
 margin: 0 1em 0 0;
}

.member h4 {
 padding-left: 160px;
 text-decoration: none;
 font-weight: normal;
 letter-spacing: .1em;
}

#footer {
 clear: both;
}

/* Music
 *----------*/
.album {
 position: relative;
 clear: both;
 text-align: right;
}

.album p {
 text-align: right;
 min-height: 100px;
}

.album ul {
 list-style: circle;
 text-align: left;
 padding-left: 15em;
}

.album img{
 float: right;
 border: 1px solid black;
 height: 100px;
 width: 100px;
 margin: 0px 30px;
 margin-right: 100px;
}

/* Contact Form
 *-----------------*/
 
form {
 margin: .5em auto;
 border: 1px solid red;
 padding: 0;
 text-align: center;
 background-color: #ffd33b;
 color: inherit;
 width: 669px;
}

fieldset {
 margin: 2px 0;
 border: none;
 padding: 0 25% 0 0;
 text-align: right;
 background-color: transparent;
}

legend {
 font-size: 1.1em;
 padding: .2em .5em;
 margin: 0;
 background-color: red;
 color: white;
 text-align: center;
}

label {
 margin: .4em .6em;
 background-color: #ffd33b;
}

button {
 font-size: 1em;
 margin: .2em 1em;
}

input {
 margin: .1em .1em;
}
/* News
 *--------------*/
#news p {
 min-height: 320px;
}
#news img {
 margin-top: 5px;
}

img.map {
 position: relative;
 float: left;
 display: block;
 border: 1px solid red;
 margin-bottom: 5px;
}

img.fun {
 position: relative;
 display: block;
 float: right;
 height: 300px;
 width: 300px;
 border: 1px solid red;
 margin-bottom: 5px;
}

div.movie {
 height: 330px;
 width: 200px;
 margin: 0;
 padding: 0;
}
