/* 
	CSS for paragonworldwide.com
	
	*blues*
	#369	paragon blue
	#69c	medium blue
	#9cf	light blue
	
	*reds*
	#c00	paragon red
	#f90	orange
	#fc0	yellow
	
	*grays*
	#555	paragon gray
	#888	medium gray
	
	#ccc	light gray
	
*/


/* base
----------------------------------------------------------------- */
html {
  height: 100%;
  overflow-y: scroll; /* forces visible gutter for scrollbar (prevents layout shift) */
}
body {
  height: 100%;
  background: #fff;
  color: #444;
  line-height: 1.6;
}

/* html5 elements */
section,nav,article,aside,hgroup,header,footer {
	display: block;
}

/* resets */
body, p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, 
fieldset, legend, blockquote, th, td { /*input, button, textarea,*/
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
fieldset, img { border: 0; }
img { vertical-align: bottom; }

/* typography */
html { -webkit-font-smoothing: antialiased; }
html, body { font-size: 14px; }
body, input, button, textarea, select {
	font-family: "Segoe UI", Optima, Arial, Helvetica, sans-serif;
	font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	margin-bottom: 0.5em;
	line-height: 1.3;
	text-rendering: optimizeLegibility;
}
h1, h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
}
pre, tt, code, kbd, samp, var {
	font-family: Consolas, "Courier New", Courier, monospace;
}
h1 { font-size: 25px; }
h2 { font-size: 22px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
h1, h2, h3 { font-weight: normal; }
th, strong, dt, b { font-weight: bold; }
p,ul,ol { margin-bottom: 1em; }
blockquote {
	/*margin-left: 2em;
	margin-right: 2em;*/
}
acronym, abbr { cursor: help; border-bottom: 1px dotted #ccc; }

/* links */
a { color: #369; }
a:hover, a:focus { color: #c00; }
a:focus,:focus { outline: none; }
a:active { color: #c00; outline: none; }

/* lists */
ul,ol { margin-left: 2em; }
li { margin-left: 1em; }
ol li { list-style-type: decimal; }
ul li { list-style-type: disc; }
ul ul li { list-style-type: circle; }
ul ul ul li { list-style-type: square; }
ol ol li { list-style-type: lower-alpha; }
ol ol ol li { list-style-type: lower-roman; }

/* forms */
fieldset { line-height: 1; }
input[type="checkbox"] {
	vertical-align: bottom; 
	*vertical-align: baseline; /* IE */
}
input[type="radio"] { vertical-align: text-bottom; }
input { _vertical-align: text-bottom; /* IE 6 */ }
input, button, textarea, select {
	font-size: 13px;
}
button, /* this is to fix IE 6 and 7 which create extra right/left padding on buttons */
input[type="submit"],
input[type="reset"],
input[type="button"],
.inputButton {
	*overflow: visible;
	_width: 0;
	padding: 0.2em 0.4em; /* default for all browsers */
}

/* clear fix for elements containing floats */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }


/* general
----------------------------------------------------------------- */
body {
	background: #c9c9c9 url(gfx/pagebkg.jpg) repeat-x center top;
	color: #343434;
}

nav ul, nav li { margin: 0; padding: 0; list-style: none; }
nav.hrz li { display: inline-block; }

#pagemain h1,
#pagemain h3,
#pagemain h5 {
	color: #369;
}
#pagemain h2,
#pagemain h4,
#pagemain h6 {
	color: #c00;
}
	
#contentsection blockquote {
	margin-left: 1em;
	margin-right: 1em;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	color: #888;
}

.br {
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	border-radius: 0.5em; }

.photo { width: 220px; text-align: center; }
.photo blockquote { margin: 0; padding: 0;  }
.photo blockquote p { font-size: 13px;  }
.photo img { background-color: #555; border: 3px solid #555; margin-bottom: 10px; }

.left { float: left; margin: 0 20px 20px 0; }
.right { float: right; margin: 0 0 20px 20px; }

table.sections td {
	padding: 15px 0;
	border-bottom: 1px solid #ddd; }
	
article header { font-weight: bold; }
article footer {
	margin: 15px 0;
	padding: 15px;
	font-style: italic;
	border: 1px dotted #ccc;
	text-align: center; }

.article_list {  }
	.article_list article {
		overflow: hidden;
		margin: 0;
		padding: 30px 0 15px 0; }
	.article_list article img {
		width: 150px;
		height: 150px;
		background-color: #ddd;
		color: #555;
		border: 5px solid #ddd; }

aside { font-size: 85%; }
aside.left { border-right: 1px solid #ccc; }
aside.right { border-left: 1px solid #ccc; }
	aside h5 {
		margin: 0;
		padding: 10px 15px; }
	aside blockquote { margin-bottom: 10px; padding: 5px; }
	aside blockquote cite {
		display: block;
		margin-bottom: 10px;
		padding: 10px 5px;
		font: normal 85% "Segoe UI", Optima, Arial, Helvetica, sans-serif;
		line-height: 1.2;
		text-align: right;
		color: #444; }
	aside ul { margin: 0; padding: 0; }
	aside li {
		margin: 0;
		padding: 7px 0 7px 15px;
		line-height: 1.4;
		list-style: none;
		border-top: 1px dotted #ddd; }


/* structure ~ nav
----------------------------------------------------------------- */
#pagewrapper {
	min-height: 100%; }
	
	#pagecontainer {
		width: 760px;
		margin: 0 auto;
		padding-bottom: 250px; }
		
		#pageheader {
			padding-top: 15px;
			padding-bottom: 20px; }
			#sitenav ul {
				height: 80px;
				font: normal 13px Georgia, "Times New Roman", Times, serif;
				text-transform: lowercase; }
			#sitenav li {
				float: left;
				height: 80px;
				text-align: center; }
			#sitenav a {
				display: block;
				margin-top: 10px;
				width: 70px;
				height: 55px;
				line-height: 55px;
				text-decoration: none;
				color: #369;
				border-right: 1px dotted #ccc; }
			#sitenav #pagelogo { padding: 0; }
			#sitenav #pagelogo a {
				width: 250px;
				height: 70px;
				overflow: hidden;
				margin: 0;
				border: 0;
				background: transparent url(gfx/header_logo.png) no-repeat 0 4px;
				text-indent: -99999px; }
			#sitenav a:hover, #sitenav a:active, #sitenav a:focus {
				color: #c00; }
			#sitenav li.active {
				margin-left: -8px;
				margin-right: -4px;
				padding-left: 8px;
				padding-right: 4px;
				background: transparent url(gfx/menu_ribbon.png) no-repeat 0 0; }
				#sitenav li.active a { border: 0; color: #fff; font-style: italic; }
				#sitenav li.last a { border: 0; }
				
		#pagefooter {
			position: relative;
			clear: both;
			height: 210px;
			margin-top: -205px;
			background: #101010 url(gfx/footerbkg.jpg) repeat-x center top;
			color: #ddd; }
			#footercontent {
				width: 760px;
				margin: 20px auto;
				font-size: 12px; }
				.ie7 #footercontent { margin: 0 auto; }
				#perspective {
					float: left;
					width: 540px;
					height: 180px; }
					#perspective_shot {
						position: relative;
						float: left;
						top: -30px; }
					#perspective h2 { margin-bottom: 0; color: #fff; }
					#perspective form { padding-top: 15px; }
					#perspective form p { margin-bottom: 0; padding-bottom: 1em; }
					#perspective #signup_email {
						width: 260px;
						padding: 3px;
						background-color: #fff;
						color: #888;
						border: 0; }
						#perspective #signup_email.active { color: #000; }
					#perspective #signup_submit {
						position: relative;
						left: 5px;
						padding: 5px 12px;
						background-color: #444;
						color: #aaa;
						border: 0;
						font-size: 11px;
						font-weight: bold;
						text-transform: lowercase;
						cursor: pointer;
						-moz-border-radius: 10px;
						-webkit-border-radius: 10px;
						border-radius: 10px;
						behavior: url(js/PIE.htc); }
					#perspective #signup_submit:hover,
					#perspective #signup_submit:focus,
					#perspective #signup_submit:active {
						background-color: #f90;
						color: #fff;
						border-color: #f90; }
					#privacy {
						margin-top: 10px;
						line-height: 1;
						font-size: 11px;
						color: #888; }
						#constantcontact { font-size: 10px; color: #555; }
				#contactinfo {
					float: left;
					width: 200px;
					text-align: right; }
					#contactinfo address {
						font-style: normal;
						color: #ccc; }
					#contactinfo strong {
						font-size: 20px;
						font-weight: bold;
						line-height: 300%;
						color: #fff; }
					#contactinfo p {
						margin-bottom: 0;
						padding-bottom: 1em;
						font-size: 10px;
						color: #888; }
					#contactinfo a { color: #fff; }
					

/* home layout
----------------------------------------------------------------- */
#slides {
	position: relative;
	clear: both;
	width: 760px;
	height: 260px;
	max-height: 260px;
	border: 10px solid #fff;
	background-color: #fff;
	color: #333;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box; }
	.ie7 #slides { width: 740px; height: 240px; }
	#slides #slide_controls {
		position: absolute;
		z-index: 1;
		left: -25px;
		right: -25px;
		top: 50%;
		height: 45px;
		margin-top: -22px;
		background-color: #fff;
		-moz-border-radius: 25px;
		-webkit-border-radius: 25px;
		border-radius: 25px; }
		.ie6 #slides #slide_controls,
		.ie7 #slides #slide_controls,
		.ie8 #slides #slide_controls { background: transparent; }
		#slides #slide_controls a {
			display: block;
			position: absolute;
			z-index: 2;
			top: 0;
			width: 25px;
			height: 45px;
			line-height: 40px;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size: 20px;
			font-weight: bold;
			text-align: center;
			text-decoration: none;
			color: #369; }
		#slides #slide_controls a:hover { color: #c00; }
		#slides #slide_controls a#slide_prev { left: 0; }
		#slides #slide_controls a#slide_next { right: 0; }
		.ie6 #slides a#slide_prev,
		.ie7 #slides a#slide_prev,
		.ie8 #slides a#slide_prev { background: transparent url(gfx/controls_left.png) no-repeat left center; }
		.ie6 #slides a#slide_next,
		.ie7 #slides a#slide_next,
		.ie8 #slides a#slide_next { background: transparent url(gfx/controls_right.png) no-repeat right center; }
	#slides ul {
		display: none;
		overflow: hidden;
		position: relative;
		z-index: 2;
		width: 740px;
		height: 240px;
		margin: 0;
		padding: 0;
		background-color: #fff;
		color: #444; }
		#slides li {
			width: 740px;
			height: 240px;
			margin: 0;
			padding: 0;
			list-style: none;
			background-color: #fff;
			background-position: center center;
			background-repeat: no-repeat; }
		#slides .slide_content { padding: 20px; font-size: 14px; }
			#slides .slide_content a.btn {
				display: block;
				float: left;
				font-family: Georgia, "Times New Roman", Times, serif;
				font-weight: bold;
				font-style: italic;
				text-decoration: none;
				text-transform: lowercase;
				color: inherit; }
				
		#slides #slide_clients {
			background-image: url(gfx/slide_clients.jpg);
			color: #369;
			text-shadow: 1px 1px 1px #ebf2ff; }
			#slides #slide_clients h1 {
				font-style: italic;
				font-weight: bold;
				font-size: 24px; }
			#slides #slide_clients .slide_content { width: 350px; }
			#slides #slide_clients .slide_content p { color: #039; }
			
		#slides #slide_insight {
			background-image: url(gfx/slide_insight.jpg);
			color: #000;
			text-shadow: 1px 1px 1px rgba(255,255,255,0.6); }
			#slides #slide_insight h1 {
				font-style: italic;
				font-weight: bold;
				font-size: 21px;
				color: #c00; }
			#slides #slide_insight a { color: #c00; }
			#slides #slide_insight .slide_content {
				width: 330px;
				margin-left: 360px;
				padding-top: 50px;
				text-align: left; }
				
		#slides #slide_sally {
			background-image: url(gfx/slide_sally.jpg);
			color: #ddd;
			text-shadow: 1px 1px 1px rgba(0,0,0,0.6); }
			#slides #slide_sally h1 {
				font-style: italic;
				font-weight: bold;
				font-size: 21px;
				color: #fff; }
			#slides #slide_sally a { color: #fff }
			#slides #slide_sally .slide_content {
				width: 460px;
				text-align: left; }


#homecontent {
	overflow: hidden;
	width: 740px;
	margin: 0 auto;
	padding: 20px 0;
	background-color: transparent;
	color: #fff; }
	#homecontent a { color: #fff; }
	#intro {
		float: left;
		width: 480px;
		margin-right: 20px; }
		#homequotes { margin: 20px 0; }
			#homequotes q { font-size: 16px; }
	#recentarticles {
		float: left;
		width: 240px; }
		#recentarticles h3 {
			margin-bottom: 0;
			padding-left: 15px;
			border-left: 1px solid #ccc; }
		#recentarticles ul {
			border-left: 1px solid #ccc; }
		#recentarticles ul {
			padding-top: 7px;
			padding-bottom: 15px; }
		#recentarticles li { margin-bottom: 1px; }
		#recentarticles a {
			display: inline-block;
			padding: 3px 15px;
			text-decoration: none; }
			#recentarticles a:hover,
			#recentarticles a:focus,
			#recentarticles a:active {
				background-color: #ccc;
				color: #369; }
				

/* content layout
----------------------------------------------------------------- */
#pagemain {
	position: relative;
	clear: both;
	overflow: hidden;
	min-height: 400px;
	background-color: #fff;
	color: #444; }
	
	#contentheader {
		position: relative;
		overflow: hidden;
		margin: 0 20px;
		padding: 25px 10px 5px 10px;
		border-bottom: 1px solid #69c; }
		#contentheader h1 {
			margin: 0;
			font-weight: bold;
			font-style: italic;
			line-height: 1.3;
			color: #369; }
		#sectionmenu {
			position: absolute;
			top: 30px;
			right: 10px;
			font-size: 13px; }
			#sectionmenu a {
				position: relative;
				top: 0;
				display: inline-block;
				margin: 0 0 0 -5px;
				padding: 5px 12px 12px 12px;
				text-decoration: none;
				background: #fff url(gfx/gra_ltblue_v.jpg) repeat-x left top;
				/*color: #777;*/
				border: 1px solid #9cf; }
			#sectionmenu a:first-child {
				-moz-border-radius-topleft: 5px;
				-webkit-border-top-left-radius: 5px;
				border-top-left-radius: 5px; }
			#sectionmenu a:last-child {
				-moz-border-radius-topright: 5px;
				-webkit-border-top-right-radius: 5px;
				border-top-right-radius: 5px; }
			#sectionmenu a:hover,
			#sectionmenu a:focus,
			#sectionmenu a:active { color: #c00; }
			#sectionmenu a.active {
				background: #69c;
				color: #fff;
				border-color: #69c; }
				
	#contentsection {
		width: 680px;
		margin: 0 auto;
		padding: 30px 0; }
		#contentsection h3 { font-weight: bold; }
		#contentsection p { overflow: hidden; }

	#contentfooter {
		clear: both;
		padding: 20px;
		text-align: center;
		border-top: 1px solid #ddd; }
		#contentfooter nav {
			font-family: Georgia, "Times New Roman", Times, serif;
			text-transform: lowercase; }
			#contentfooter nav a {
				margin: 0;
				padding: 0 15px;
				border-left: 1px solid #ccc;
				text-decoration: none; }
			#contentfooter nav a:first-child { border: 0; }

#people article {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #ddd; }
	
#clientlogos {
	position: relative;
	width: 490px;
	height: 160px;
	overflow: hidden;
	margin: 20px 0;
	text-align: center; }
	#clientlogos img {
		width: 490px;
		height: 160px; }
#industries { width: 160px; }
#testimonials { width: 300px; }
	#testimonials q { font-family: "Segoe UI", Optima, Arial, Helvetica, sans-serif; }
#news article {
	margin-bottom: 10px;
	padding: 20px 0 10px 0;
	border-bottom: 1px dotted #ccc; }

.form-comments { width: 90%; }

/* ////////////////////////////////////////////////////////////////////////// */


#printheader { display: none; }


@media print {
	* { background: transparent !important; color: #444 !important; text-shadow: none; overflow: visible !important; }
	a, a:visited { color: #444 !important; text-decoration: underline; }
	a:after { content: " (" attr(href) ")"; }
	abbr:after { content: " (" attr(title) ")"; }
	pre, blockquote { page-break-inside: avoid; }
	img { page-break-inside: avoid; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3{ page-break-after: avoid; }
	html, body { font-size: 16px; }
	
	html,body,#pagewrapper { height: auto; min-height: auto; }
	#pageheader, #pagefooter, nav { display: none; }
	#printheader {
		display: block;
		height: 80px; }
	
	.printhide { display: none; }
}


@media all and (orientation:portrait) {
	/* Style adjustments for portrait mode goes here */
}
@media all and (orientation:landscape) {
	/* Style adjustments for landscape mode goes here */
}
/* Opera Mobile, iPhone Safari, Android Chrome */
@media screen and (max-device-width: 480px) {
	/* Prevent iOS, WinMobile from adjusting font size */
	html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; }
}

