html
{
   height: 100%;
   width: 1000px;
   margin: 0 auto;
   text-align: center;
}

body
{
   margin: 0;
   padding: 0;
   height: 100%;
   width: 100%;
   background: #000;

   font-family: Trebuchet MS, Helvetica, sans-serif;
   position: relative;
}

h1, h2, h3, h4
{
   font-weight: normal;
   margin: 0;
   padding: 0;
   display: block;
}

h2
{
   font-size: 1.2em;
}

h4
{
   margin-top: 1em;
}

p {margin-top: 0;}

a, em
{
   color: #007cc2;
}

a:hover
{
   text-decoration: none;
}

em
{
   font-style: normal;
}

#container
{
   height: 100%;
   background: #1F4D2A url('/images/bg.png') repeat-x 50%;
   z-index: -2;
}

/* Lets put a black border around everything to make it look better */
#container, .stuff, .grass, .flowers
{
   width: 1000px !important;
}

/** hide **/


.banner, .learnMore, .cloud1, .cloud2, .cloud3, .close
{
   overflow: hidden;
   line-height: 9999px;
}

#mainContent
{
   position: absolute;
   width: 800px;

   left: 50%;
   top: 100%;
  	margin-left: -400px;
	text-align:left;

   z-index: 2;
}

/***** Info boxes *******/

#buy, #info, #terms
{
   background: #FFF;
   padding: 0 30px 185px 30px;
}

.leftcol
{
   float: left;
   width: 28%;
   margin-left: 5%;
}

.rightcol
{
   float: right;
   width: 65%;
}

#buy ul.column
{
   width: 45%;
}

#buy ul
{
   float: left;
   margin: 10px 20px 0 0;
   padding: 0;
   list-style: none;
   font-size: 0.8em;
}

#buy li
{
   display: block;
   padding-bottom: 2px;
}

#buy .rightcol ul
{
   font-size: 0.7em;
}

#buy .rightcol select
{
   font-size: 0.8em;
}

h2.hilight
{
   color:#8CC63F;
   margin-bottom:-15px;
   position:relative;
   text-align:center;
   top:-35px;
}

#info
{
   background: #FFF url('/images/bins.png') no-repeat 90% 100px;
}

#info ul
{
   font-size: 1.1em;
   list-style: none;
   padding: 0;
}

#info li
{
   background: url('/images/bullet.png') no-repeat;
   padding-left: 25px;
}

.more
{
   /*padding-top: 20px;*/
   clear: both;
   float: left;
   margin-left: 5%;
   width: 25%;
   position: absolute;
   bottom: 185px;

}

.more a
{
   font-size: 0.9em;
   text-decoration: none !important;
}

.more a:hover
{
   text-decoration: underline !important;
}

#terms p
{
   font-size: 0.8em;
}

.boxtop
{
   background: #FFF;
   width: 810px;
   height: 20px;
   margin-top: -20px;
}

.boxcurve
{
   position: absolute;
   top: -20px;
   right: 0;
   width: 20px;
   height: 20px;
   background: url('/images/stuff.png') no-repeat -445px -90px;
}

.close
{
   display: block;
   position: relative;
   top: -55px;
   left: -55px;
   width: 95px;
   height: 95px;
   background: url('/images/stuff.png') no-repeat -485px -85px;
   margin-bottom: -60px;
}

#footer
{
   position: fixed;
   bottom: 0;
   left: 50%;
   margin-left: -500px;
   width: 1000px;
   height: 25px;
   background: #000;
   color: #FFF;
   z-index: 5;
   text-align: center;
}

#footer div
{
   float: left;
   width: 30%;
   text-align: left;
   font-size: 0.6em;
   margin-top: 5px;
}

#footer div.terms
{
   text-align: center;
}

#footer .by
{
   float: right;
   text-align: right;
}

#footer a
{
   color: #fff;
}

.flowers
{
   position: fixed;
   left: 50%;
   margin-left: -500px;
   bottom: 25px;
   height: 158px;
   width: 1000px;
   background: url('/images/flowers.png') repeat-x;
   z-index: 100;
}

.grass
{
   position: absolute;
   left: 50%;
   margin-left: -500px;
   top: 55%;
   height: 246px;
   width: 100%;
   background: url('/images/grass.png') repeat-x center;
}

/**** Main Elements ****/
.info * { z-index: 1;}

/***** Clouds *****/
.clouds
{
/*   position: absolute;
   top: 20%;
   left: 50%;
   width: 760px;
   margin-left: -380px;*/
}

.cloud1, .cloud2, .cloud3
{
   position: absolute;
   top: 20%;
   left: 50%;
   height: 200px;
   width: 177px;
}

.cloud1, .cloud3
{
   width: 290px;
}

.cloud1
{
   margin-left: -390px;
   background: url('/images/stuff.png') no-repeat 0px -1050px;
}

.cloud2
{
   margin-left: -90px;
   background: url('/images/stuff.png') no-repeat -290px -1050px;
}

.cloud3
{
   margin-left: 100px;
   background: url('/images/stuff.png') no-repeat -467px -1050px;
}


.banner
{
   position: absolute;
   top: 30px;
   left: 50%;
   margin-left: -400px;
   width: 665px;
   height: 90px;
   background: url('/images/stuff.png') no-repeat 0px -950px;
   overflow: hidden;
   line-height: 9999px;
}

.logo
{
   position: absolute;
   top: 30px;
   left: 50%;
   margin-left: 270px;
   width: 135px;
   height: 80px;
   background: url('/images/stuff.png') no-repeat -445px 0px;
}

.learnMore
{
   position: absolute;
   top: 20%;
   left: 50%;
   margin-left: -490px;
   margin-top: 150px;
   width: 245px;
   height: 440px;
   background: url('/images/stuff.png') no-repeat 0px 0px;
   z-index: 2;
   overflow: hidden;
   line-height: 9999px;
}

.info1
{
   position: absolute;
   top: 20%;
   left: 50%;
   margin-left: -450px;
   width: 90px;
   height: 135px;
   background: url('/images/stuff.png') no-repeat -250px 0px;
}

.info2
{
   position: absolute;
   top: 20%;
   right: 50%;
   margin-right: -450px;
   width: 95px;
   height: 135px;
   background: url('/images/stuff.png') no-repeat -345px 0px;
}

/****************************************************************************/
/***** Stuffs *****/

.butterflies
{
   position: absolute;
   top: 50%;
   right: 11%;
   width: 610px;
   height: 315px;
   background: url('/images/stuff.png') no-repeat 0px -530px;
}

.houses
{
   position: absolute;
   top: 55%;
   left: 50%;
   margin-left: -250px;
   width: 110px;
   height: 80px;
   background: url('/images/stuff.png') no-repeat -250px -140px;
}

.pond
{
   position: absolute;
   top: 60%;
   left: 40%;
   width: 115px;
   height: 85px;
   background: url('/images/stuff.png') no-repeat -365px -140px;
}

.seaclouds
{
   position: absolute;
   margin-top: -64px;
   top: 50%;
   left: 50%;
   margin-left: -500px;
   width: 650px;
   height: 95px;
   background: url('/images/stuff.png') no-repeat 0px -850px;
}

.liquorishenge
{
   position: absolute;
   top: 52%;
   left: 60%;
   width: 190px;
   height: 150px;
   background: url('/images/stuff.png') no-repeat -250px -225px;
}

.windmills
{
   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: 300px;
   width: 160px;
   height: 185px;
   background: url('/images/stuff.png') no-repeat -445px -230px;
}
