
body{
  background-color:#FFF;
  font-family:Arial, Helvetica, sans-serif;
}

/* You need something to wrap the whole thing up in, this will also control your overall width and positioning */
#wrapper{    /*find a coding standard that works best for you so that it is readable*/
  width: 900px;
  margin: 0 auto;     /*this is how you center a div*/
  background-color:#FFF;
}

/*Now we must start our layout*/
#header{
   width:900px;
   background-image:url(images/your_image_here.jpg); /*Of course this is optional but usually how I do it*/
   background-repeat:no-repeat;  /*This line and the next are best practices and usful attributes to know*/
   background-position:relative;  /*Now we have our pic in the bg and can add all the text on top that we want*/
   background-color:#FFF;
}
#myimg1{
   width:150px;
  position: relative
	 margin:0;
	 padding: 0px 10px 0px 10px;
}
#myimg2{
   width:500px;
  float: left
	 margin:0;
	 padding: 0px 10px 0px 10px;
}

#aboutustext{
   width:500px;
  float: left
	 margin:0;
	 padding: 0px 10px 0px 10px;
}

#header p{  /*We want to style the paragraph tags inside of the header*/
   color:#666;
   font-size:14px;
   margin:0;
   padding: 82px 6px 0px 6px; /* Top Right Bottom Left (thanks Chris) 82px will push it down enough to show the whole background...it's a hack but that's how I roll*/
}

/*Let's start the menu8--this is a simple version of my vertical pretty css memu*/
/*We make menus by unordered lists*/
#menu{
    height:30px;
    width:900px;
    font-size:25px;
    color:#000;
		margin: 10px;
    background-color:#FFF;
}
#menu ul{
    margin:0;
    padding:0;
    list-style-type:none;
}
#menu ul li{
    display:inline;
}
#menu ul li a{
    float:left;
    padding:6px 0;
    width:65px;
    text-align:center;
} /*See my Pretty CSS Menus Tutorial for a more detailed explanation*/

/*Now for our Content*/
#content{
  background-color:#FFF;
  width:900px;  
  height:300px;
  position: relative
	 margin:0;
	 padding: 10px 10px 10px 10px;
}

/*We style the p tag here again, as well as our h tags*/
#content h1{
  font-size:18px;
  font-weight:normal; /*All h tags are BOLDED by default*/
  margin: 0 6px;
  padding: 15px 0 3px 0;
}
#content p{
  color:#000;
  font-size:12px;
  margin: 0 6px; /* Top/Bottom Left/Right...we want the paragraph to flush rught up to the bottom of the h1*/
  padding: 0 6px 9px 6px;
}

/* And now the fun part!*/
#information{
  margin: 0px /*this will position it level w/ the h1 tag and a bit away from the edge...my preferance*/
  width:200px;
  float:right;
  background-color:#FFF;
  border:0px none #000;
}
#information p{
  font-size:11px;
  color:#fff;
  margin: 0;
  padding: 0px;
}

/*THE FOOTER IS THE MOST IMPORTANT PART WHEN USING ANY FLOATING DIVS*/
#footer{
margin: 10;
  clear:both; /*This ensures that your floating information box pushes the wrapper to the bottom of the box, leaving this out would result in the information box poking out of the wrapper into the body like a tab...that’s bad...and ugly*/
  background-color:#FFFF00;
}

#footer p{

  font-size:22px;
  font-weight:bold;
  color:#000;
}



