/* CSS Document */
/* CSS RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
/*END CSS RESET */
body {background: #8c8372; margin: 0; padding: 0; font-family:trebuchet ms,verdana, sans-serif;}
/* BASE */
#container {background: url(images/background.jpg) repeat-y; margin: 0 auto; padding: 0; width: 850px;}
/* HEADER */
#header { margin-bottom: 40px; float: left;}
#banner {background: url(images/banner.jpg) no-repeat; width: 850px; height: 205px; float: left;}
#banner_left {background: url(images/banner_left.jpg) no-repeat; width: 192px; height: 227px; float: left;}
#banner_bottom {width: 475px; height: 113px; background: url(images/banner_left_bottom.jpg) no-repeat;}
#banner_right {width: 183px; height: 227px; background: url(images/banner_right.jpg) no-repeat; float: left;}
#nav_container {width: 475px; height: 114px; background: url(images/nav_bck.jpg) repeat-x; float: left; color: #f2f2f2;}
#nav_left {width: 12px; height: 114px; background: url(images/nav_bck_left.jpg); float: left;}
#nav_right {width: 34px; height: 114px; background: url(images/nav_bck_right.jpg); margin-left: 441px;}
/* nav buttons */
#nav_btns a{font-size: 2em; color: #f2f2f2; text-decoration: none; font-weight: bold;}
#nav_btns a:hover{color: #567d8c; text-decoration: none;}
#btn_portfolio {height: 114px; width: 139px; float: left; margin-left: 5px; padding-top: 5px;text-align: center;}
#btn_resume {height: 114px; width: 139px; float: left; text-align: center; padding-top: 5px; margin-left: 8px;}
#btn_contact {height: 114px; width: 139px; float: left; text-align: center; padding-top: 5px;}
.nav_on {height: 114px; width: 139px; background: url(images/nav_btn_bck.jpg) no-repeat; margin: 0; padding: 0; margin-top: -5px; padding-top: 5px;}
/* CONTENT */
#content {width: 750px; margin: 0 auto;}
.portfolio_item { height: 144px; width: 750px; padding: 0; margin: 0; margin-bottom: 50px;}
.description {width: 375px; height: 144px; padding: 0 5px 0 10px; margin: 0; background: url(images/description.jpg);}
li.description {float: left;}
li.image {float: right;}
.description ol{padding: 0;margin: 0;}
.description ol li{padding: 3px 0 3px 0;}
.image {width: 360px; height: 144px; margin: 0; padding: 0;}
#portfolio_content{clear: both; color: #f2f2f2; padding-top: 40px;}
/*text formating*/
.portfolio_item h2{color: #f2f2f2; font-size: 1.4em; font-weight: bold; margin-bottom: 10px;}
.description li{font-weight: bold; font-size: 1.1em;}
.description span{font-weight:normal;}
/*bizbugz*/
#bizbugz a{background:url(images/bizbugz_small.png) top left no-repeat;width:360px;height:144px;display:block;}
#bizbugz a:hover{background-position:0 -144px;}
/*crapshoot*/
#crapshoot a{background: url(images/btn_crapshoot.jpg) top left no-repeat; width:360px; height: 144px; display: block;}
#crapshoot a:hover{background-position: 0 -144px;}
/*glass city car show */
#glasscity a{background: url(images/btn_glasscity.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#glasscity a:hover{background-position: 0 -144px;}
/*MOUNTAIN*/
#mountain a{background: url(images/btn_mountain.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#mountain a:hover{background-position: 0 -144px;}
/*fire exit */
#fireexit a{background: url(images/btn_fireexit.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#fireexit a:hover{background-position: 0 -144px;}
/* oldsean */
#oldsean a{background: url(images/btn_oldsean.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#oldsean a:hover{background-position: 0 -144px;}
/* camera */
#cam a{background: url(images/btn_cam.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#cam a:hover{background-position: 0 -144px;}
/* bills */
#bills a{background: url(images/btn_bills.jpg) top left no-repeat; width: 360px; height: 144px; display: block;}
#bills a:hover{background-position: 0 -144px;}
/* --------------RESUME ----------------*/
#resume h2{color: #f2f2f2; font-size: 1.6em; font-weight:bold; padding-bottom: 10px;}
.resume_txt {color: #f2f2f2; font-size: 1.2em; padding-bottom: 20px;}
.resume_txt span{color: #21455b; font-size: 1.2em;}
.skills {list-style: circle; padding-left: 1em;}
#resume p{padding: 10px 0 20px 0;}
#resume .resume_txt ul{margin:10px 0 0 20px; }
#resume .resume_txt ul li p{padding:0;margin:0 0 0 20px;font-size:16px;color:#d3c5ac;}
#resume .resume_txt ul li{margin:0 0 10px 0;}
#resume .resume_txt ul li a{color:#21455B;text-decoration:none;}
#resume .resume_txt ul li a:hover{text-decoration:underline;}
/* --------------CONTACT --------------*/
#contact h2{color: #f2f2f2; font-size: 1.6em; font-weight: bold; padding-bottom: 10px;}
.contact_txt {color: #f2f2f2; font-size: 1.2em; padding-bottom: 20px;}
.contact_txt span{color: #21455b; font-size: 1.2em;}
.contact_txt a{color: #f2f2f2;}
.contact_txt a:hover{color: #21455b;}
#contact ul{padding-top: 10px; list-style-type: none;}
#contact ul li{padding-right: 10px; display: inline;}
/* -------------- FOOTER -------------*/
#footer {background: url(images/footer_bck.jpg) no-repeat; height: 250px; width: 850px;}
#footer_info {height: 30px; width: 850px; background-color: #21455b; text-align: center; padding-top: 15px;}
#footer_info p{font-weight: bold; font-size: 15px; color: #f2f2f2;}