@charset "utf-8";
body {
	background-color: #cccccc;
	background-image: url(../images/template/bg_gradient.jpg);
	background-repeat: repeat-x;
	background-position: left top;
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
}
#body {
	background-image: url(../images/template/container.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin: 0px;
	padding: 0px;
	overflow:hidden;
	height: 760px;
}
#wrapper {
	width: 960px;
	text-align: left;
	margin:0px;
}

#nav {
	list-style-type: none;
	padding: 0px;
	margin-top: 26px;
	margin-right: 0px;
	margin-bottom: 25px;
	margin-left: 612px;
	height:20px;
	/*position:absolute;
	top:26px;*/
}

#message{
	color:#FFFFFF;
}

#message a{
	color:#EEEEEE;
	text-decoration:none;
}

#message a:hover{
	color:#769DCC;
	text-decoration:none;
}

#nav li {
	float: left;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #cccccc;
}
#nav a {
	color: #cccccc;
	text-decoration: none;
	font-weight: bold;
	display: block;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 0px;
	letter-spacing: 3px;
	font-size: 13px;
}
#nav a:hover {
	color: #FFFFFF;
}
#nav .last {
	border-right-style: none;
}

#logo {
	background-image: url(../images/template/logo.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 158px;
	width: 347px;
	overflow: hidden;
	position: absolute;
	top: 31px;
	margin-left: 6px;
	z-index: 1000;
}
#logo a {
	display: block;
	padding-top: 165px;
}
#page {
	padding: 0px;
	clear: both;
	height: 271px;
	width: 616px;
	margin-top: 0px;
	overflow: hidden;
	margin-left: 334px;
}
#green {
	height: 230px;
	margin-top: 0px;
	margin-right: 40px;
	margin-bottom: 30px;
	margin-left: 40px;
}
#gray {
	/*background-color: #999999;*/
	height: 124px;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 36px;
}
#footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	margin-top: 5px;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-left: 20px;
}
.right {
	float: right;
}
#footer a {
	color: #666666;
	text-decoration: none;
}
#footer a:hover {
	color: #333333;
}
#green #about {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	float: right;
	height: 216px;
	width: 310px;
	overflow: hidden;
	font-weight: normal;
	letter-spacing: 1px;
}
#green #contact {
	float: left;
	height: 220px;
	width: 550px;
	overflow: hidden;
}
#green #about h2 {
	background-image: url(../images/template/experience.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 32px;
	width: 260px;
	overflow: hidden;
	padding: 0px;
	margin-top: 16px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#green #about h2 a {
	display: block;
	padding-top: 40px;
}
#green #about p {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 3px;
	padding: 0px;
}
#signup .headline {
	background-image: url(../images/template/contact-drew.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 36px;
	width: 310px;
	padding: 0px;
	overflow: hidden;
	margin-top: 4px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#signup .headline h3 {
	display: block;
	padding-top: 40px;
}


#signup #webex {
	width: 600px;
	margin-top: 5px;
	margin-left: 23px;
}

#webex .field{
	float: left;
	margin-bottom:8px;
}

#webex .text {
	border: 0px none #FFFFFF;
	background-image: url(../images/template/form-bg.png);
	background-repeat: no-repeat;
	background-position: left top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #cccccc;
	padding: 3px 3px 3px 5px;
}
.field .error {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	padding: 0px;
	position: absolute;
	margin-top: -24px;
	margin-left:5px;
	display: none;
	background-image: url(../images/template/required.png);
	height: 24px;
	width: 100px;
	overflow: hidden;
	z-index: 500;
}
#webex #name {
	width: 207px;
	margin-right: 5px;
}
#webex #email {
	width: 273px;
}
#webex #comments {
	height: 96px;
	width: 494px;
}
#webex .buttonrow {
	text-align:right;
	margin-right:100px;
	clear:both;
}

#msg.field{
	margin-bottom:0px;
	}


#signup .focusField{
	color:#666666;
}

#signup .idleField{
	color: #cccccc;
}

#webex .buttonrow #btn {
	background-image: url(../images/template/send-btn.png);
	height: 37px;
	width: 83px;
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 40px;
	overflow: hidden;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
.left {
	float: left;
}
#gray .left {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	width: 300px;
	letter-spacing: 2px;
	margin: 10px 0px;
}
#browsers {
	margin: 20px 0px;
	list-style-type: none;
	background-image: url(../images/template/site-rocks.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 89px;
	height:40px;
}
#browsers li {
	background-repeat: no-repeat;
	background-position: left top;
	margin: 0px;
	padding: 0px;
	height: 40px;
	width: 43px;
	float: left;
	overflow: hidden;
}
#browsers #safari {
	background-image: url(../images/icons/safari.png);
}
#browsers #chrome {
	background-image: url(../images/icons/chrome.png);
}
#browsers #ie {
	background-image: url(../images/icons/ie.png);
}
#browsers #firefox {
	background-image: url(../images/icons/firefox.png);
}
#social {
	background-image: url(../images/template/follow-drew.png);
	background-repeat: no-repeat;
	background-position: left top;
	float: right;
	width: 378px;
	margin-top: 10px;
	padding-top: 32px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	list-style-type: none;
}
#social li {
	background-repeat: no-repeat;
	background-position: left top;
	height: 65px;
	width: 63px;
	float: left;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}
#linkedin {
	background-image: url(../images/icons/social_01.png);
}
#facebook {
	background-image: url(../images/icons/social_02.png);
}
#wordpress {
	background-image: url(../images/icons/social_03.png);
}
#flickr {
	background-image: url(../images/icons/social_04.png);
}
#rss {
	background-image: url(../images/icons/social_05.png);
}
#twitter {
	background-image: url(../images/icons/social_06.png);
}

#social a {
	display: block;
	padding-top: 67px;
}


#browsers a {
	display: block;
	padding-top: 42px;
}
#who, #what {
	background-image: url(../images/template/who-is-this-guy-.png);
	background-repeat: no-repeat;
	background-position: left top;
	height: 38px;
	overflow: hidden;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 76px;
}
#what{
	background-image: url(../images/template/skills-headline.png);
}
#who span, #what span {
	display: block;
	padding-top: 40px;
}
#page p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin-top: 0px;
	margin-bottom: 8px;
	margin-left: 106px;
	margin-right:40px;
	text-align: justify;
}
#page .next {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
	color: #769dcc;
	padding-right: 10px;
	line-height:18px;
	background-image: url(../images/template/next.gif);
	background-repeat: no-repeat;
	background-position: right top;
	display: inline;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	clear:both;
}
#page .next:hover {
	color: #235796;
	background-position: right bottom;
}
#page .skillset {
	margin:0px 0px 0px 105px;
}
.skillset ul {
	float: left;
	width: 130px;
	list-style-type: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0px;
	padding: 0px 0px 10px 32px;
}
#page h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 106px;
}

.clear{
	clear:both;
}

#page .skillset li {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
#gray .left a{
	color:#FFFFFF;
	text-decoration:none;
	}
#gray .left a:hover{
color:#769dcc;
text-decoration:none;
}