/*
Theme Name: Xspond Corporate Site
Theme URI: http://xspond.com/
Description: The base theme for the Xspond Incorporated website.
Author: Xspond
*/

/* Page */
#page-content {
	float: left;
	clear: both;
	width: 100%;
}

	.full-width { width: 100%; }

	div.hr {
	    overflow: hidden;
	    float: left;
	    width: 100%;
	    height: 1px;
	    margin: 5px 0;
	    line-height: 1px;
	    font-size: 1px;
	    background: #ddd;
	}

	div.hr hr { display: none; }

	/* Two Column */
	.two-column div.left {
		width: 659px;
		padding: 0 3px;
		background: url(images/two-column/left/bg.png);
	}

	.two-column div.left div.header {
		position: relative;
		left: -3px;
		float: left;
		width: 665px;
		height: 15px;
		background: url(images/two-column/left/header-bg.png) no-repeat;
	}

	.two-column div.left h2 {
		float: left;
		width: 639px;
		padding: 10px 10px 0 10px;
		font-size: 25px;
		font-weight: bold;
	}

	.two-column div.left .content {
		float: left;
		width: 639px;
		padding: 10px;
	}

	.two-column div.left .content p {
		float: left;
		width: 100%;
		padding: 0 0 10px;
	}

	.two-column div.left .footer {
		position: relative;
		left: -3px;
		float: left;
		width: 665px;
		height: 15px;
		background: url(images/two-column/left/footer-bg.png) no-repeat;
	}

	.two-column div.right {
		width: 290px;
		margin: 0 0 10px;
		padding: 0 4px;
		background: url(images/two-column/right/bg.png);
	}

	.two-column div.right .header {
		position: relative;
		left: -4px;
		float: left;
		width: 298px;
		height: 15px;
		background: url(images/two-column/right/header-bg.png);
	}

	.two-column div.right h3 {
		float: left;
		width: 270px;
		padding: 10px;
		font-size: 20px;
		font-weight: bold;
	}

	.two-column div.right p {
		float: left;
		width: 270px;
		padding: 0 10px 10px;
	}

	.two-column div.right a.checklist {
		position: relative;
		left: 18px;
	}

	.two-column div.right .footer {
		position: relative;
		left: -4px;
		float: left;
		width: 298px;
		height: 15px;
		background: url(images/two-column/right/footer-bg.png);
	}

	/* White Three Column */
	.white-three-col {
		position: relative;
		float: left;
		width: 964px;
		height: 407px;
		margin: 20px 0 0;
		padding: 3px;
		background: url(images/pages/white-three-column.png) center center;
		color: #515151;
	}

	.white-three-col div.column {
		position: relative;
		float: left;
		width: 300px;
		height: 387px;
		padding: 10px;
	}

	.white-three-col div.middle {
		width: 302px;
		border-left: 1px solid #ddd;
		border-right: 1px solid #ddd;
	}

	.white-three-col h2 {
		float: left;
		width: 100%;
		padding: 5px 0 0;
		font-size: 20px;
		font-weight: bold;
		text-align: center;
	}

	.white-three-col h2 a {
		color: #515151;
		text-decoration: none;
	}

	.white-three-col h3 {
		float: left;
		width: 100%;
		padding: 10px 0;
		font-size: 16px;
		text-align: center;
	}

	.white-three-col p {
		float: left;
		width: 296px;
		padding: 10px 5px;
		text-align: left;
	}

	.white-three-col img {
		padding: 3px;
		border: 1px solid #ddd;
		background: #fff;
	}

	.white-three-col a img {
		padding: 0;
		border: 0;
		background: transparent;
	}

	.white-three-col div.buttons {
		position: absolute;
		left: 0;
		bottom: 20px;
		width: 100%;
		text-align: center;
	}

	.white-three-col div.case-study {
		float: left;
		width: 300px;
		margin: 10px -10px 0;
		padding: 5px 10px 0;
		border-top: 1px solid #ddd;
	}
	/* End White Three Column */

	/* iLead */
	#ilead {
		float: left;
		width: 400px;
		padding: 10px;
	}

	#ilead h3 {
		float: left;
		width: 100%;
		padding: 0 0 30px;
		font-size: 22px;
		text-align: center;
		color: #2187d5;
	}

	#ilead div {
		float: left;
		width: 100%;
		padding: 0 0 20px;
	}

	#ilead div label {
		float: left;
		width: 135px;
		font-weight: bold;
	}

	#ilead div label span { color: #2187d5; }

	#ilead div input { width: 240px; }

	#ilead div.button { padding: 0; }
	#ilead div.button input { width: auto; }
/* Home */
#home-middle {
	position: relative;
	float: left;
	width: 970px;
	height: 361px;
	background: url(images/home/middle-bar.png);
}

#home-middle h1,
#home-middle p {
	display: none;
}

#home-middle a.button {
	position: absolute;
	bottom: 30px;
	left: 135px;
}

#home-middle-slider {
	overflow: hidden;
	position: absolute;
	top: 23px;
	right: 19px;
	width: 468px;
	height: 309px;
}

#home-middle-slides {
	position: relative;
	width: 10000px;
}

#home-middle-slides a {
	position: relative;
	float: left;
}

#home-content {
	float: left;
	width: 962px;
	padding: 0 4px;
	background: url(images/single-col-bg.png) repeat-y;
}

#home-content h2 {
	float: left;
	width: 100%;
	padding: 25px 0 0;
	font-size: 25px;
	font-weight: bold;
}

#home-copy {
	float: left;
	width: 446px;
	padding: 0 25px;
}

#home-copy p {
	float: left;
	width: 100%;
	padding: 0 0 5px;
	font-size: 13px;
	line-height: 23px;
}

#home-copy p.right {
	float: right;
	width: 164px;
}

#home-copy div {
	float: left;
	width: 100%;
	text-align: center;
}

#home-featured-client {
	float: left;
	width: 419px;
	min-height: 485px;
	padding: 0 22px;
	border-left: 1px solid #ddd;
}

#home-featured-client h2 span { color: #4dacf6; }

#home-featured-client img.left { padding: 10px 10px 10px 0; }

#home-featured-client p.right {
	float: left;
	width: 153px;
	padding: 7px 0 0;
	line-height: 18px;
}

#homepage-tools-used {
	float: left;
	width: 100%;
	padding: 0 0 10px;
}

#homepage-tools-used div {
	float: left;
	width: 200px;
	padding: 0 0 10px;
	font-weight: bold;
}

#homepage-tools-used div img {
	padding: 0 5px 0 0;
	vertical-align: -7px;
}

#home-content .footer {
	position: relative;
	left: -3px;
	float: left;
	width: 970px;
	height: 15px;
	background: url(images/home/content-footer.png) no-repeat;
}

/* What We Do */
.xspond-what {
	float: left;
	width: 964px;
	padding: 0 3px;
	background: url(images/single-col-bg.png) repeat-y;
}

.xspond-what .header {
	position: relative;
	left: -3px;
	float: left;
	width: 970px;
	height: 385px;
	background: url(images/what-we-do/header-bg.png) no-repeat;
}

.xspond-what .header h1 {
	float: left;
	width: 400px;
	padding: 31px 0 0 39px;
	font-size: 30px;
	font-weight: bold;
	color: #fff;
}

.xspond-what .header p {
	float: left;
	clear: left;
	width: 400px;
	padding: 15px 0 0 39px;
	line-height: 20px;
	font-size: 14px;
	color: #fff;
}

.xspond-what .header a {
	position: absolute;
	top: 210px;
	left: 125px;
}

#xspond-what-video {
	position: absolute;
	top: 31px;
	right: 39px;
}

#xspond-what-steps {
	position: relative;
	top: -79px;
	float: left;
	width: 886px;
	height: 225px;
	padding: 0 39px;
	background: url(images/what-we-do/arrows.png) no-repeat top center;
}

#xspond-what-steps div {
	float: left;
	width: 174px;
	padding: 6px 5px 0;
}

#xspond-what-steps div#xspond-what-steps-info,
#xspond-what-steps div#xspond-what-steps-action,
#xspond-what-steps div#xspond-what-steps-engagement {
	margin: 0 50px 0 0;
}

#xspond-what-steps div h2 {
	float: left;
	width: 100%;
	padding: 7px 0 3px;
	font-size: 25px;
	text-align: center;
}

#xspond-what-steps div h2 a {
	color: #424242;
	text-decoration: none;
}

#xspond-what-steps div p { color: #424242; }
#xspond-what-steps div p a { color: #56b5ff; }

.xspond-what .footer {
	position: relative;
	left: -3px;
	float: left;
	width: 970px;
	height: 238px;
	background: url(images/what-we-do/footer-bg.png) no-repeat;
}

.xspond-what .footer h3 {
	padding: 40px 0 0 335px;
	font-size: 22px;
	font-weight: bold;
}

.xspond-what .footer h3 a {
	color: #000;
	text-decoration: none;
}

.xspond-what .footer p {
	float: left;
	width: 330px;
	padding: 5px 0 0 340px;
	line-height: 18px;
}

.xspond-what .footer a {
	position: absolute;
	top: 0;
	left: 0;
	width: 970px;
	height: 238px;
	text-indent: -9999px;
}
	/* Subsections */
	.xspond-what-section .header {
		height: 301px;
		background: url(images/what-we-do/subsections/header-bg.png) no-repeat;
	}

	#xspond-what-section-video {
		position: absolute;
		top: 18px;
		right: 31px;
	}

	.xspond-what-section .content .left {
		float: left;
		width: 563px;
		padding: 10px 15px 10px 35px;
		border-right: 1px solid #ddd;
	}

	.xspond-what-section .content .left p {
		float: left;
		width: 100%;
		padding: 0 0 10px;
	}

	.xspond-what-section .content .left a { color: #56B5FF; }

	.xspond-what-section .content .right {
		float: left;
		width: 299px;
		margin: 0 0 0 -1px;
		padding: 10px 35px 10px 15px;
		border-left: 1px solid #ddd;
	}

	.xspond-what-section .content .right h3 {
		float: left;
		width: 100%;
		padding: 10px 0;
		font-size: 22px;
		font-weight: bold;
	}

	.xspond-what-section .content .right p {
		float: left;
		width: 100%;
		padding: 0 0 10px;
	}

	.xspond-what-section .content .right a.last {
		position: relative;
		z-index: 2;
		top: 10px;
		left: 30px;
	}

	.xspond-what-section .footer {
		left: -2px;
		height: 15px;
		background: url(images/what-we-do/subsections/footer-bg.png) no-repeat;
	}

/* Tools Page */
#tools div.left .row {
	float: left;
	width: 100%;
	padding: 5px 0;
}

#tools div.left .row img.photo { padding: 3px; }

#tools div.left .row h3 {
	float: left;
	width: 400px;
	padding: 0 15px;
	font-size: 26px;
	font-weight: bold;
	color: #515151;
	text-align: left;
}

#tools div.left .row p {
	float: left;
	width: 400px;
	padding: 5px 15px;
	color: #515151;
}

/* Who We Are */
.player {
	float: left;
	width: 649px;
	padding: 0 5px 10px;
}

.player img {
	margin: 10px 5px;
	padding: 3px;
	border: 1px solid #515151;
}

div.left .player-content {
	float: left;
	width: 480px;
	padding: 15px 0 0 10px;
}

div.left .player h3 {
	float: left;
	width: 480px;
	font-size: 18px;
	text-align: left;
	color: #121212;
}

div.left .player p {
	width: 480px;
	padding: 0 0 10px;
	line-height: 18px;
}

div.left .player a { color: #089948; }

#who-we-are div.right h3 { text-align: center; }

/* Contact Us */
#contact-us address { display: none; }

#contact-us .left p {
	float: left;
	width: 639px;
	padding: 10px;
}

#contact-social-media {
	float: left;
	width: 126px;
	height: 38px;
	margin: 20px 0 0 50px;
	padding: 26px 0 0;
	background: url(/wp-content/uploads/2010/06/contact-social-media.png);
}

#contact-social-media a {
	display: block;
	float: left;
	width: 38px;
	height: 38px;
	text-indent: -9999px;
}

#contact-social-media a.twitter { margin: 0 6px; }

#contact-us-form {
	float: left;
	width: 423px;
	padding: 0 0 0 50px;
}

#contact-us-form div {
	float: left;
	width: 100%;
	padding: 0 0 7px;
	text-align: left;
}

#contact-us-form div label {
	float: left;
	width: 80px;
	padding: 0 5px 0 0;
	font-size: 13px;
	font-weight: bold;
}

#contact-us-form div input.text { width: 310px; }

#contact-us-form div textarea {
	float: left;
	width: 400px;
	height: 75px;
	margin: 5px 0 0;
}

#contact-us div.left #contact-us-form p {
	width: 403px;
	color: #515151;
}

#contact-us-form div.submit { text-align: center; }

/* Blog - Listing */
#blog-title {
	float: left;
	margin: 0 0 5px;
}

.blog-posts {
	position: relative;
	float: left;
	width: 659px;
	margin: 7px 0 10px;
	padding: 0 3px;
	background: url(images/two-column/left/bg.png) repeat-y;
}

.blog-posts .header {
	position: relative;
  left: -3px;
	float: left;
  width: 665px;
  height: 15px;
  background: url(images/two-column/left/header-bg.png) no-repeat;
}

.blog-posts .footer {
	position: relative;
  left: -3px;
	float: left;
  width: 665px;
  height: 15px;
  background: url(images/two-column/left/footer-bg.png) no-repeat;
}

.blog-posts .post {
	float: left;
	width: 639px;
	margin: 0 2px 20px;
	padding: 0 8px 25px;
	border-bottom: 1px solid #c0c0c0;
}

.blog-posts .post .author {
	float: left;
	line-height: 44px;
	font-size: 14px;
	color: #47a7f3;
}

.blog-posts .post .author img {
	float: left;
	margin: 0 5px 0 0;
}

.blog-posts .post .social-media {
	float: right;
	padding: 12px 12px 12px 0;
}

.blog-posts .post .social-media-fb-share,
.blog-posts .post .social-media-addthis,
.blog-posts .post .social-media-tweetmeme {
	float: right;
	padding: 0 5px;
}

.blog-posts .post .social-media-fb-share { padding-right: 15px; }

.blog-posts .post h2.entry-title {
	float: left;
	width: 100%;
	padding: 8px 0 0;
	font-size: 28px;
}

.blog-posts .post h2.entry-title a {
	text-decoration: none;
	color: #343434;
}

.blog-posts .post .entry-time {
	float: left;
	width: 100%;
	padding: 2px 0 10px;
	font-size: 12px;
	color: #aeaeae;
}

.blog-posts .post .entry-content h3 {
	float: left;
	width: 100%;
	padding: 7px 0;
	font-size: 18px;
	font-weight: normal;
}

.blog-posts .post .entry-content p {
	width: 639px;
	padding: 0 0 7px;
}

.blog-posts .post .entry-content strong { font-weight: bold; }

.blog-posts .post .entry-content a,
.blog-posts .post .entry-content a:active,
.blog-posts .post .entry-content a:visited {
	color: #47A7F3;
}

.blog-posts .post .entry-content ul {
	width: 619px;
	padding: 0 0 0 20px;
	list-style: disc;
}

.blog-posts .post .entry-content ul li { padding: 0 0 7px; }

.blog-posts .post .entry-content,
.blog-posts .post .entry-utility {
	float: left;
	clear: both;
	width: 100%;
}

.blog-posts .post .entry-utility a { color: #47a7f3; }

/* Blog Comments - max depth of 2 */
h3#comments-title {
	float: left;
	width: 639px;
	margin: 0 0 10px;
	padding: 10px 0 3px;
	font-size: 22px;
	border-bottom: 1px solid #000;
	text-transform: uppercase;
}

div#comments {
	float: left;
	clear: both;
	width: 639px;
	padding: 0 10px;
}

div#comments .comment {
	float: left;
	clear: both;
	width: 637px;
}

div#comments .comment-wrapper {
	float: left;
	width: 100%;
	border: 1px solid #f2f2f2;
}

div#comments .commentlist div.depth-1 { padding: 10px 0 0; }

div#comments .commentlist div.depth-2 {
	width: 617px;
	padding: 0 0 0 20px;
}

div#comments .commentlist div.depth-2 .comment-wrapper { border-top: 0; }

div#comments .comment-author-avatar {
	float: left;
	width: 64px;
	height: 64px;
	padding: 10px;
}

div#comments .comment-content {
	float: left;
	width: 553px;
	padding: 10px 0 0;
}

div#comments div.depth-2 .comment-content { width: 533px; }

div#comments .comment-author {
	float: left;
	width: 100%;
	padding: 0 0 7px;
	color: #9c9c9c;
}

div#comments .comment-author a { color: #47a7f3; }

div#comments .comment-author cite,
div#comments .comment-author span,
div#comments .comment-author div {
	float: left;
	padding: 0 5px 0 0;
}

div#comments .comment-content .reply {
	float: left;
	width: 100%;
	padding: 10px 0;
}

div#comments .comment-content .reply a { color: #47a7f3; }

div#respond {
	float: left;
	width: 639px;
	margin: 20px 0;
	padding: 20px 0 0;
	border-top: 1px solid #000;
}

div#respond h3 {
	float: left;
	width: 100%;
	padding: 0 0 10px;
	font-size: 18px;
}

div#respond p {
	float: left;
	width: 100%;
	padding: 0 0 10px;
}

div#respond p label {
	float: left;
	width: 100px;
	padding: 0 5px 0 0;
	font-weight: bold;
}

div#respond p.form-submit {
	width: auto;
	padding: 0 0 0 105px;
}