/* --------------------------------------------------------------------------------

Title:    Make-A-Wish - Club Wish - CSS Stylesheet
Author:   ASI Communications, Email: info@a-s-i.com, Web site: http://www.a-s-i.com

----------------------------------------------------------------------------------- */

html {
background: #FFF url(../g/bg-color.jpg) 0 0;
}

body {
color: #65513e;
       font-size: 0.75em;
       font-family: Helvetica, Verdana, Arial, sans-serif;
padding: 0;
margin: 0;
background: #FFF url(../g/bg.jpg) repeat-x;
}
h1 {
    font-size: 2.8em;
    font-weight: lighter;
    font-family: Times, serif;
color: #006bb7;
padding: 0;
margin: 0;
}
h2 {
    font-size: 1.2em;
    line-height: 1.0em;
    font-weight: lighter;
    font-family: Times, serif;
color: #006bb7;
padding: 0;
margin: 0;
        margin-bottom: 15px;
}
h3 {
    font-size: 1.2em;
    line-height: 1.0em;
color: #999;
padding: 0;
margin: 0;
}
p {
    text-align: left;
padding: 5px 0px;
margin: 0;
}

/* -----------------------------------------------------------------------------------
   container to center the layout
   ----------------------------------------------------------------------------------- */

#container {
width: 1024px;
       margin-bottom: 0px;
       margin-left: auto;
       margin-right: auto;
padding: 0px 0px;
         /*background: url(../g/bg.jpg) repeat-x;*/
}

/* -----------------------------------------------------------------------------------
   header
   ----------------------------------------------------------------------------------- */

#header {
    text-align: left;
height: 356px;
width: 1024px;
padding: 0;
margin: 0;
background: url(../g/header.jpg) no-repeat;
}

#header2 {
    text-align: left;
height: 48px;
width: 1024px;
padding: 0;
margin: 0;
background: url(../g/header2.jpg) no-repeat;
}

/* -----------------------------------------------------------------------------------
   main menu 1
   ----------------------------------------------------------------------------------- */

#menu {
width: 1024px;
height: 31px;
margin: 0;
padding: 0;
}
#menu ul {
width: 1024px; height: 31px;
       list-style-type: none;
float: left;
margin: 0; padding: 0;
background: url(../g/menu.jpg) 0 0;
}
#menu ul a {
display: block;
         text-decoration: none;
position: relative;
top: 0px; left: 0px;
margin: 0; padding: 0;
        /*border: 1px solid #CCC;*/
}
#menu ul a:hover {
    text-decoration: none;
}
#menu ul li {
float: left;
       text-indent: -9999px;
position: relative;
top: 0px; left: 0px;
}

#menu ul li#menu1 a  { width: 178px; height: 31px; }
#menu ul li#menu2 a  { width: 114px; height: 31px; }
#menu ul li#menu3 a  { width: 115px; height: 31px; }
#menu ul li#menu4 a  { width: 115px; height: 31px; }
#menu ul li#menu5 a  { width: 116px; height: 31px; }
#menu ul li#menu6 a  { width: 115px; height: 31px; }
#menu ul li#menu7 a  { width: 108px; height: 31px; }
#menu ul li#menu8 a  { width: 163px; height: 31px; }

#menu ul li#menu1 a:hover  { background: transparent url(../g/menu.jpg) 0px -32px no-repeat; }
#menu ul li#menu2 a:hover  { background: transparent url(../g/menu.jpg) -178px -32px no-repeat; }
#menu ul li#menu3 a:hover  { background: transparent url(../g/menu.jpg) -292px -32px no-repeat; }
#menu ul li#menu4 a:hover  { background: transparent url(../g/menu.jpg) -407px -32px no-repeat; }
#menu ul li#menu5 a:hover  { background: transparent url(../g/menu.jpg) -522px -32px no-repeat; }
#menu ul li#menu6 a:hover  { background: transparent url(../g/menu.jpg) -638px -32px no-repeat; }
#menu ul li#menu7 a:hover  { background: transparent url(../g/menu.jpg) -753px -32px no-repeat; }
#menu ul li#menu8 a:hover  { background: transparent url(../g/menu.jpg) -861px -32px no-repeat; }

/* -----------------------------------------------------------------------------------
   main menu - wish stories
   ----------------------------------------------------------------------------------- */

#menu-story {
width: 1024px;
height: 31px;
margin: 0;
padding: 0;
}
#menu-story ul {
width: 1024px; height: 31px;
       list-style-type: none;
float: left;
margin: 0; padding: 0;
background: url(../g/menu2.jpg) 0 0;
}
#menu-story ul a {
display: block;
         text-decoration: none;
position: relative;
top: 0px; left: 0px;
margin: 0; padding: 0;
}
#menu-story ul a:hover {
    text-decoration: none;
}
#menu-story ul li {
float: left;
       text-indent: -9999px;
position: relative;
top: 0px; left: 0px;
}
#menu-story ul li#menu1 a  { width: 178px; height: 31px; }
#menu-story ul li#menu2 a  { width: 114px; height: 31px; }
#menu-story ul li#menu3 a  { width: 115px; height: 31px; }
#menu-story ul li#menu4 a  { width: 115px; height: 31px; }
#menu-story ul li#menu5 a  { width: 116px; height: 31px; }
#menu-story ul li#menu6 a  { width: 115px; height: 31px; }
#menu-story ul li#menu7 a  { width: 108px; height: 31px; }
#menu-story ul li#menu8 a  { width: 163px; height: 31px; }

#menu-story ul li#menu1 a:hover  { background: transparent url(../g/menu2.jpg) 0px -31px no-repeat; }
#menu-story ul li#menu2 a:hover  { background: transparent url(../g/menu2.jpg) -178px -31px no-repeat; }
#menu-story ul li#menu3 a:hover  { background: transparent url(../g/menu2.jpg) -292px -31px no-repeat; }
#menu-story ul li#menu4 a:hover  { background: transparent url(../g/menu2.jpg) -407px -31px no-repeat; }
#menu-story ul li#menu5 a:hover  { background: transparent url(../g/menu2.jpg) -522px -31px no-repeat; }
#menu-story ul li#menu6 a:hover  { background: transparent url(../g/menu2.jpg) -638px -31px no-repeat; }
#menu-story ul li#menu7 a:hover  { background: transparent url(../g/menu2.jpg) -753px -31px no-repeat; }
#menu-story ul li#menu8 a:hover  { background: transparent url(../g/menu2.jpg) -861px -31px no-repeat; }

/* -----------------------------------------------------------------------------------
   submenu
   ----------------------------------------------------------------------------------- */

#submenu {
width: 424px;
height: 49px;
margin: 0;
padding: 0;
}
#submenu ul {
width: 424px; height: 49px;
       list-style-type: none;
float: left;
margin: 0;
padding: 0;
background: url(../g/submenu.jpg) 0 0;
}
#submenu ul a {
display: block;
         text-decoration: none;
position: relative;
top: 0px; left: 0px;
margin: 0; padding: 0;
}
#submenu ul a:hover {
    text-decoration: none;
}
#submenu ul li {
float: left;
       text-indent: -9999px;
position: relative;
top: 0px; left: 0px;
margin: 0; padding: 0;
}

#submenu ul li#menu1 a  { width: 109px; height: 49px; }
#submenu ul li#menu2 a  { width: 101px; height: 49px; }
#submenu ul li#menu3 a  { width: 100px; height: 49px; }
#submenu ul li#menu4 a  { width: 114px; height: 49px; }

#submenu ul li#menu1 a:hover  { background: transparent url(../g/submenu.jpg) 0px -49px no-repeat; }
#submenu ul li#menu2 a:hover  { background: transparent url(../g/submenu.jpg) -109px -49px no-repeat; }
#submenu ul li#menu3 a:hover  { background: transparent url(../g/submenu.jpg) -210px -49px no-repeat; }
#submenu ul li#menu4 a:hover  { background: transparent url(../g/submenu.jpg) -310px -49px no-repeat; }

/* -----------------------------------------------------------------------------------
   content
   ----------------------------------------------------------------------------------- */

#content {
margin: 0;
padding: 0;
width: 1024px;
height: 380px;
background: url(../g/footer.jpg) 0 0 no-repeat;
}
#content p {
    text-align: left;
padding: 0;
margin: 0;
}
#content img {
margin: 0;
padding: 0;
}
#content ul.bulleted li {
padding: 6px 0px 0px 0px;
margin: 0;
}
#content a { color: #0067B1; text-decoration: underline; }
#content a:hover { color: #0067B1; text-decoration: none; }

/* -----------------------------------------------------------------------------------
   content 2
   ----------------------------------------------------------------------------------- */

#content2 {
margin: 0;
padding: 20px 0px 0px 0px;
width: 1024px;
height: 360px;
background: url(../g/footer2.jpg) 0 0 no-repeat;
}
#content2 p {
    text-align: left;
padding: 0;
margin: 0;
}
#content2 p.list {
    text-align: left;
    line-height: 1.8em;
padding: 0;
margin: 0;
}
#content2 img {
margin: 0;
padding: 0;
}
#content2 a { color: #0067B1; text-decoration: underline; }
#content2 a:hover { color: #0067B1; text-decoration: none; }

/* -----------------------------------------------------------------------------------
   content 3 - wish stories
   ----------------------------------------------------------------------------------- */

#content-ann {
background: url(../g/footer-ann.jpg) 0 0 no-repeat;
}
#content-corinne {
background: url(../g/footer-corinne.jpg) 0 0 no-repeat;
}
#content-quinn {
background: url(../g/footer-quinn.jpg) 0 0 no-repeat;
}
#content-wish-wall {
background: url(../g/footer-wish-wall.jpg) 0 0 no-repeat;
}
#content3 {
margin: 0; padding: 20px 0px 0px 0px;
width: 1024px;
height: 669px;
}
#content3 p {
color: #0067B1;
       text-align: left;
margin: 0; padding: 0;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 11px;
}
#content3 a { color: #0067B1; text-decoration: underline; }
#content3 a:hover { color: #0067B1; text-decoration: none; }


/* -----------------------------------------------------------------------------------
   join club wish
   ----------------------------------------------------------------------------------- */

#join-club, #join-club-thanks {
display: none;
color: #FCFAE6;
position: absolute;
top: 386px;
     text-align: left;
height: 95px; width: 1024px;
margin: 0; padding: 0;
        z-index: 400;
background: url(../g/join-club-wish.jpg) no-repeat;
}
#join-club-story, #join-club-story-thanks {
display: none;
color: #FCFAE6;
position: absolute;
top: 78px;
     text-align: left;
height: 95px; width: 1024px;
margin: 0; padding: 0;
        z-index: 400;
background: url(../g/join-club-wish-story.jpg) no-repeat;
}
#tell-a-friend, #tell-a-friend-thanks {
display: none;
color: #FCFAE6;
position: absolute;
top: 386px;
     text-align: left;
height: 95px; width: 1024px;
margin: 0; padding: 0;
        z-index: 400;
background: url(../g/tell-a-friend.jpg) no-repeat;
}
#tell-a-friend-story, #tell-a-friend-story-thanks {
display: none;
color: #FCFAE6;
position: absolute;
top: 78px;
     text-align: left;
height: 95px; width: 1024px;
margin: 0; padding: 0;
        z-index: 400;
background: url(../g/tell-a-friend-story.jpg) no-repeat;
}
#close-button a {
width: 58px;
height: 16px;
display: block;
margin: 0; padding: 0;
        text-indent: -9999px;
position: absolute;
bottom: 10px; right: 100px;
background: url(../g/close-button.jpg) no-repeat;
}
#close-button a:hover  { background: url(../g/close-button.jpg) 0px -16px no-repeat; }
#next-wish a {
width: 50px;
height: 13px;
display: block;
margin: 0; padding: 0;
        text-indent: -9999px;
background: url(../g/next-wish.gif) no-repeat;
}
#next-wish a:hover  { background: url(../g/next-wish.gif) 0px -13px no-repeat; }
#prev-wish a {
width: 72px;
height: 13px;
display: block;
margin: 0; padding: 0;
        text-indent: -9999px;
background: url(../g/prev-wish.gif) no-repeat;
}
#prev-wish a:hover  { background: url(../g/prev-wish.gif) 0px -13px no-repeat; }

/* -----------------------------------------------------------------------------------
   wish wall button
   ----------------------------------------------------------------------------------- */

#wish-wall-button a {
width: 126px; height: 58px;
display: block;
float: right;
margin: 0; padding: 0;
        text-indent: -9999px;
background: url(../g/wish-wall-button.gif) no-repeat;
}
#wish-wall-button a:hover  { background: url(../g/wish-wall-button.gif) 0px -63px no-repeat; }

/* ------------------------------------------------------------
   Form Elements
   ------------------------------------------------------------ */

form {
margin: 2px 0; padding: 0;
width: 500px;
}
form label {
    font-family: Helvetica, Verdana, Arial, sans-serif;
    font-size: 14px;
}
form input.text-field {
margin: 0;
padding: 3px;
background: #FCFAE6;
border: none;
        font-family: Helvetica, Verdana, Arial, sans-serif;
        font-size: 12px;
}
form input.submit {
margin: 0 5px; padding: 0;
}