/* Global HTML Reset */
body,h1,h2,h3,h4,h5,h6,p,address,blockquote,form,label,input,select,textarea,legend,label,ul,ol,li,hr { margin: 0; padding: 0; }
body {
background-color: #ccc; /* This alters the overall color of the page */
color: #222;
}
hr {
border: none 0;
border-bottom: 1px solid #888;
height: 1px;
}
img { border: 0; }
ol, ul {
list-style-type: none;
}
/* Font Description */
body {
font-size: 100%;
font-family: "Gil Sans", Arial, sans-serif; /* Declare this once, here. This will cascade down to everything in the page. */
color: #999;
line-height: 1.5em;
}
h3 {
font-size:1.1em;
font-weight: normal;
}
/* Custom Elements */
#wrap {
margin: auto; /* Remove this to left justify the page */
width: 700px;
padding: 0 20px 0 20px; /* This is a 4-in-one. Read as you would the hands of a clock: top, right, bottom, left.*/
background-color: #fff; /* Remove this to make the whole page the color of . */
}
#topleft {
margin-left: 120px;
margin-top: 20px;
width: 250px;
height: 250px;
background-color: #999;
float: left;
}
#aboutpagetopleft {
color: #FFFFFF;
font-size: 0.8em;
line-height: 1.3em;
margin-left: 120px;
margin-top: 20px;
padding: 15px 15px 15px 15px;
width: 220px;
height: 220px;
background-color: #999;
float: left;
}
#contactpagebottomright {
color: #FFFFFF;
font-size: 0.9em;
line-height: 1.3em;
margin-left: 20px;
margin-top: 20px;
padding: 15px 15px 15px 15px;
width: 220px;
height: 150px;
background-color: #999;
float: left;
}
#gallerypagetopright {
font-size: 1.0em;
border-color: ;
margin-left: 20px;
margin-top: 20px;
width: 180px;
height: 250px;
background-color: #2F4F4F;
float: left;
}
#topright {
border-color: ;
margin-left: 20px;
margin-top: 20px;
width: 180px;
height: 250px;
background-color: #2F4F4F;
float: left;
}
#bottomleft {
margin-left: 120px;
margin-top: 20px;
width: 180px;
height: 180px;
background-color: #2F4F4F;
float: left;
}
#bottomright {
margin-left: 20px;
margin-top: 20px;
width: 250px;
height: 180px;
background-color: #999;
float: left;
}
/* Content Page Boxes */
#contentpagebottomright {
color: #FFFFFF;
font-size: 0.9em;
line-height: 1.2em;
margin: 20px 0px 0px 20px;
padding: 20px 20px 20px 20px;
width: 210px;
height: 140px;
background-color: #999;
float: left;
}
/* About Page Boxes */
#aboutpagebottomright {
color: #FFFFFF;
font-size: 0.8em;
line-height: 1.2em;
margin: 20px 0px 0px 20px;
padding: 20px 20px 20px 20px;
width: 210px;
height: 140px;
background-color: #999;
float: left;
}
#content {
float: left;
clear: left;
width: 500px; /* Make sure this + #nav = #wrap */
}
#label {
float: left;
width: 180px; /* Make sure this + #content = #wrap */
margin-left: 20px; /* Remember to include margins too! */
}
#nav {
border-color: #999;
border-width: 1px;
border-style: solid;
margin-top: 2px;
margin-left: 2px;
padding: 12px;
float: left;
display: inline;
}
#nav a {
font-size: 1.3em;
text-decoration: none;
color: #999;
display: inline;
padding: 2px 2px 2px 2px;
}
#nav a:hover {
color: #FFFFFF;
}
#nav2 {
border-color: #999;
border-width: 1px;
border-style: solid;
margin-top: 2px;
margin-left: 2px;
padding: 12px;
float: left;
display: inline;
}
#nav2 a {
font-size: 1.1em;
text-decoration: none;
color: #999;
display: inline;
padding: 2px 2px 2px 2px;
}
#nav2 a:hover {
color: #FFFFFF;
}
#footer {
text-align: center;
clear: both; /* Use this when you are done with floats. */
font-size: .9em;
padding: 20px 0 20px 0;
}