style.css

/* @group reset */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td{
  margin:0;
  padding:0;
  outline:0;
}
/* @end */

/* @group layout */
fieldset, img{
  border:0;
}
address, caption, cite, code, dfn, strong, th, var{
  font-style:normal;
  font-weight:normal;
}
ol, ul, li{
  list-style:none;
}
ol li{
  display: block;
  font-size: 10px;
  padding: 5px 0;
}
body{
  background: url('images/spotlight.png') no-repeat center center, url('images/bg2.png') #C0C0C0;
  font-family: "Lucida Grande", Helvetica, Verdana, sans-serif;
  font-size: 11px;
  line-height: 16px;
  text-align: left;
  color: #202020;
  margin: 0 auto;
}
a, a:visited{
  color: #202020;
  text-decoration: none;
}
a:hover, a:focus{
  text-decoration: none;
}
#main-content{
  border:1px solid #8f8f8f;
  padding: 32px;
  margin:50px auto 20px auto;
  width:730px;
  height: 425px;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -moz-box-shadow:0px 0px 10px #555;
  -webkit-box-shadow:0px 0px 10px #555;
  box-shadow:0px 0px 10px #555;
}
#wrapper{
  width: 960px;
  min-width: 760px;
  margin: 0 auto;
}
#content{
  left: -10px;
  position: relative;
}
#content ul{
  float: left;
  display: block;
  width: 450px;
  margin: 0;
  padding: 0;
  background: url(images/networks.png) repeat;
  list-style: none;
}
#content li{
  float: left;
  height: 60px;
  width: 225px;
  position: relative;
}
#content a{
  font-size: 1em;
  color: #666;
  text-decoration: none;
  padding: 10px 0 5px;
  display: block;
  width: 225px;
  height: 50px;
  position: relative;
  z-index: 2;
}
#content a:hover{
  background: rgba(35, 121, 193, 0.10);
}
#content span{
  display:block;
  margin-top:8px;
}
a img{
  border: 0;
  float: left;
  margin: 0 10px;
}
a:hover img{
  margin-left: 5px;
}
a strong{
  display: block;
  font-size: 14px;
  color: #000;
}
h1{
  font-size:x-large;
  text-shadow: #fff 0px 1px 1px;
  color:#101010;
  font-family: dokchamp, arial, helvetica;
  text-transform: uppercase;
  font-weight: bold;
}
h1.logo{
  background: url('images/logo.png') no-repeat;
  width: 160px;
  height: 142px;
  margin: 0 0 10px 0;
}
h2{
  font-size: 12px;
  font-family: arial, helvetica;
  margin: 15px 0 24px 0;
}
h3{
  margin: 14px 0 0 48px;
	padding: 0;
	font-size: 15px;
	text-transform: uppercase;
}
#about h3{
  font-size:10px; 
  color: #000;
  text-shadow: #eee 0px 1px 1px;
	text-transform: uppercase;
	margin: 0;
}
.border_gray{
  border-top:1px solid #9f9f9f;
  margin:15px 0 0;
}
.border_white{
  border-top: 1px solid #ececec;
}
/* @end */

/* @group navigation */
.navigation{
  margin-left:420px;
  position: relative;
}
ul.navigation li a:active{
  position: relative;
  margin-top: -1px;
}
.navigation li a{
  color:;
  text-shadow: #ddd 0px 1px 1px;
}
.navigation li a:hover, .navigation li a:active, .navigation li a:focus{
  opacity: 1.0;
}
.navigation li a img{
  padding: 2px 5px;
  margin: 0;
}
.separator{
  margin-top:5px;
  display: block;
  color:#555;
  text-shadow: #ddd 0px 1px 0px;
}
/* @end */

/* @group data */
#datacontent{
  padding: 20px 10px;
  left:45px;position:relative;
}
#datacontent ul{
  list-style: none;
  padding: 5px;
  display: block;
  height: 30px;
}
#datacontent li{
  float: left;
}
#datacontent li a{
  outline: 0;
  display: block;
  color: #555;
  text-decoration: none;
  padding: 1px 5px;
  margin: 5px;
}
#datacontent li a:hover{
  color: #000;
}
#datacontent li a.selected{
  color: #000;
}
#datacontent li a:active{
  position: relative;
  top: 1px;
}
#datacontent .panel{
  padding: 0 30px 0 0;
}
/* @end */

/* @group South Carolina */
.img_box{
  float:right;
  padding-right:110px;
}
.sc_img{
  float:left;
  margin-top:15px;
}
/* @end */

/* @group about */
#about a{
  border-bottom: 1px dotted #202020;
}
#about a:hover{
  background: rgba(35, 121, 193, 0.10);
}
#about p{
  line-height: 19px;
  padding-right: 16px;
}
.about_img{
  margin: -1px -1px -2px -1px;
}
.lil_details{
  color:#3E4570;
  font-weight:bold;
  display:block;
}
/* @end */

/* @group contact */
.contact_info{
  float:right;
  width:175px;
  border-left: 1px dashed #888;
  padding-left:30px;
}
.contact_info a:hover{
  text-decoration: underline;
}
.contact_info a:active{
  position: relative;
  top: 1px;
}
.me_img{
  border: 2px solid #fff;
  -moz-box-shadow:0px 0px 3px #555;
  -webkit-box-shadow:0px 0px 3px #555;
  box-shadow:0px 0px 3px #555;
  filter: progid:DXImageTransform.Microsoft.Shadow(color='#555555', Direction=290, Strength=1);
  
}
.txt_rotate{
  -webkit-transform:rotate(90deg);
  -moz-transform:rotate(90deg);
  -o-transform: rotate(90deg);
  float:right;
  margin-top:-65px;
  font-size:10px; color: #777;text-shadow: #ccc 0px 1px 1px;
}
p.subtitle{
  font-size:10px; 
  color: #000;
  text-shadow: #eee 0px 1px 1px;
}
.margin_top_24{
  margin-top: 24px;
}
.display_blk a:hover img, .display_blk a img{
  margin: 0;
  float: none;
}
/* @end */

/* @group float, width & clear */
.fl-rt{
  float: right;
}
.fl-lt{
  float: left;
}
.cl-rt{
  clear: right;
  height: 1%;
}
.cl-bth{
  clear: both;
}
.clear{
  clear: left;
}
.width_125{
  width: 125px;
}
/* @end */

/* @group QR */
.QR{
  background: url('images/qr.png') no-repeat;
  width: 185px;
  height: 185px;
  float: left;
  margin: 20px 0 25px 0px;
}
.mobile{
  text-align: center;
  font-size: x-small;
  font-style: italic;
  display: block;
  position: relative;
  margin-top: 200px;
}
.copy{
  font-size: 9px;
  text-transform:uppercase;
  margin: 5px 20px 0 0;
}
.copy_position{
  position: absolute;
  margin:418px 0 0 598px;
  display:block;
}
/* @end */

/* @group footer */
footer{
  font-size: small;
  color: #555;
  text-shadow: #ddd 0px 1px 1px;
  text-align: center;
  margin: 2px auto 0 auto;
}
footer a, footer a:visited{
  color: #202020;
  text-decoration: none;
}
footer a:hover{
  text-decoration: none;
  border-bottom: 1px dotted #202020;
}
p.attribution{
  font-size:10px;
  margin-top:6px;
}
/* @end */

/* @group fonts */
@font-face{
  font-family: dokchamp;src:url('fonts/dokchamp.ttf');
}
@font-face{
  font-family: Gothic;src:url('fonts/Gothic.ttf');
}
@font-face{
  font-family: mightymechanic;src:url('fonts/mightymechanic.ttf');
}
/* @end */