Left column info goes here: #left_col {

Actual CSS Code for a Site
Created in Expression Web

Below is ALL the actual CSS code (I saved the file name as siteLayout.css) for this page that Expression Web created to which FJW added some attributes:

/* Below are EXISTING TAGS with modified attributes */
/* Expression Web created most of this CSS automatically, then FJW added some attributes */
body {
margin: auto;          /* FJW added to Center Body */
width: 780px;         /* So page does not fill entire screen */
background-image:url('images/bg2820Image.jpg');
padding: 0;
}

h1 {                                       /* FJW added */
color: #003366;
}

/* Below are IDs used once with Div tags: they start with a # */
/* Expression Web automatically created the masthead ID below. Then FJW added all the masthead attributes */
#masthead {
background-image: url('images/MastHeadWinchester.jpg');
height: 100px;
background-repeat: no-repeat;
background-position: center;
}

/* Expression Web created the top_nav ID below. Then FJW added all the top_nav attributes */
#top_nav {      /*  change to html5 nav element */
text-align: center;
padding-bottom: 5px;
border-bottom-style: ridge;
border-bottom-color: blue;
font-family: "Copperplate Gothic Bold"
}

#top_nav a:hover {
color:#C7EAFB;
background-color: #003366;
}

#container {
min-width: 750px;
background-color: #FFFFCC;    /* (light yellow) */
border-color:blue; border-style:ridge;
}

#left_col {               /*  change to aside element */
padding-left:10px;   /* FJW added */
width: 200px;
float: left;
color: #003366;      /* FJW added */
}

#page_content {      /*  change to section element */
margin-left: 200px;
padding-left: 25px;       /* FJW added to give space between left_col */
padding-right: 10px;   /* FJW added */
}

#footer {    /*  change to html5 footer element */
clear: both;
}

/* Below are custom CLASSES: they start with a dot. FJW added */
.keyTerm {
color:#CC3300;
font-weight:bold;
}