Based on the lecture on CSS, design a single webpage similar to the following:

(Click for larger image).

You will need to use the following setting on your CSS:

At the top of the head of your html page, make sure to create a proper CSS section. In it copy and paste the following:

For the main window:

#mainWindow {
width:600px;
height:100%;
position:absolute;
top:20px;
left:5%;

text-align:left;
overflow:auto;
padding:10px;

background-color: #ff0000;
}

Remember that you can copy and paste and adjust this code to create other boxes; to then rename them, and embed them to create a specific design as shown above, and as demonstrated in class.

For fonts, use the following code:

#content_Font {

font-family: Verdana, Helvetica, AkzidenzGrotesk, Univers, Arial, sans-serif;
font-size: 16px;
font-weight: normal;
font-style:normal;
text-align: left;
margin-left: 0px;
margin-right: 0px;
color: #cccc99

}

Make sure to assign the code to the body of the page with div tags, in the following way: div id = "mainWindow" then write a closing tag: /div accordingly.

You will need to have two different fonts type and sizes for your headers and your main content. You must try to make your design as close as possible to the above layout in terms of where things are placed.

IMPORTANT: You are expected to use your own images and content, and to develop your own color scheme and logo. You must also choose different fonts and sizes from the ones shown in the example.

As shown during lecture, you may create, adjust and embed as many boxes (divs) to develop the look of the above design. Review the assignment that you did in class. And study the lecture samplethat I uploaded to Angel for you to study.

Remember that once you assign the divs you may move them in dreamweaver. When you do this, pay close attention to what has changed in the code.

This project must be uploaded by Thursday September 1, at 5:30 PM to get credit. After this time it will be considered late and you will be marked absent for the day.