@charset "UTF-8";
/* CSS Document */

/* The body tag style applies to all elements on the page */
body {
background-color: black;
font-family: Verdana, Geneva, Arial, sans-serif;
padding:0px;
margin:0px;
}

/* The wrapper ID style is used with a div tag to provide a 960px wide page */
#wrapper {
width: 960px;
height: 800px;
margin-left: auto;
margin-right: auto;
background-color: #F25F29;
}

/* The column-1 ID style is floated right */
#column-1 {
float: left;
width: 230px;
height: 1600px;
background: #55D9D9;
}

/* The column-2 ID style is floated left */
#column-2 {
float: left;
width: 500px;
height:1600px;
background: #F2B544;
}

#column-3 {
float: left;
width: 230px;
height:1600px;
background: #ffffff;
}

/* Selector for tags separated by commas applies the style to all tags */
h1,h2,h3,h4,h5,h6,p,li {
margin-left:15px;
}

h1 {
color: white;
padding-top:15px;
}

/* Selector for tags not separated by commas applies in specific circumstances*/
#column-1 h1 {
padding-top:5px;
color: black;
font-size:36px;
}

/* Advanced web design relies on class or ID style boxes*/
.box {
height: 100px;
width: 100px;
float: left;
margin: 15px;
padding: 25px;
background: #A8D977;
border:2px solid gray;
}

/* The following pseudo-class applies to the box class when in a hovered state */
.box:hover {
background-color:#F2B544;
border-bottom:2px solid black;
}

/* This clear class style terminates float */
.clear{ 
clear: both; 
}

}
header, footer { 
background-color: F27830;
color: red;
padding-top:5px;
padding-bottom:5px; 
}
