/*
Title: "RighterTrack" screen styles
Date Modified: 2/18/2014
--
Author: RighterTrack
Contact: http://RighterTrack.com/contact
--
Table of Contents:
	layout
	typography
	navigation
	alignment
*/

/* layout
------------------------------------- */
html, body {
	margin: 0;
	padding: 0;
	}

body {
	background-color: #5db3aa;
	background-image: url(/images/backgrounds/center-gradient.jpg), url(/images/backgrounds/gradient.jpg);
	background-position: 50% top, left top;
	background-repeat: no-repeat, repeat-x;
	color: #000;
	font: normal 14px/1.4em 'lucida sans', 'lucida grande', 'lucida sans unicode', verdana, sans-serif;
	}

#wrapper {
	background: #fff url(/images/backgrounds/main-gradient.jpg) left top repeat-x;
	border: 3px solid #fff;
	border-radius: 15px;
	box-shadow: 2px 7px 15px rgba(0,0,0,0.45);
	
	width: 960px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	text-align: left;
	}

/* ----- header ----- */
#header {
	margin: 0 auto 27px auto;
	padding: 0;
	width: 960px;
	height: 107px;
	position: relative;
	
	background-color: #fff;
	border: 3px solid #fff;
	border-top: 2px solid #fff;
	border-radius: 0 0 15px 15px;

	background-image: -webkit-gradient(
		linear,
		left top,
		left bottom,
		color-stop(0, #d0d0d0),
		color-stop(1, #fff)
	);
	background-image: -o-linear-gradient(bottom, #d0d0d0 0%, #fff 90%);
	background-image: -moz-linear-gradient(bottom, #d0d0d0 0%, #fff 90%);
	background-image: -webkit-linear-gradient(bottom, #d0d0d0 0%, #fff 90%);
	background-image: -ms-linear-gradient(bottom, #d0d0d0 0%, #fff 90%);
	background-image: linear-gradient(to bottom, #d0d0d0 0%, #fff 90%);
	
	box-shadow: 2px 7px 15px rgba(0,0,0,0.45);
	}

#logo {
	z-index: 9999;
	position: absolute;
	top: 30px;
	left: 50px;
	margin: 0;
	padding: 0;
	width: 223px;
	}

#logo h1, #logo h1 a {
	text-indent: -9999px;
	display: block;
	margin: 0;
	padding: 0;
	font-size: 22px;
	color: #000;
	width: 223px;
	height: 46px;
	background: url(/images/logos/rightertrack.png) 0 0 no-repeat;
	border-bottom: none;
	text-decoration: none;
	}

#logo h1 a:hover {
	color: #000;
	}

#tagline {
	position: absolute;
	top: 30px;
	right: 50px;
	}

#tagline p {
	display: block;
	margin: 0;
	padding: 0;
	font-size: 22px;
	color: #2d5554;
	width: 346px;
	height: 39px; 
	border: none;
	text-align: right;
	text-decoration: none;
	text-shadow: 0 1px 1px #fff;
	}

#phone-nav {
	position: absolute;
	bottom: 25px;
	right: 50px;
	font-weight: bold;
	font-size: 16px;
	}

/* ----- main content ----- */
#main {
	padding: 50px;
	margin: 0 250px 0 0; /* right 250px */
	text-align: left;
	position: relative;
	min-height: 400px;
	}

ul {
	list-style-type: square;
	}

ol {
	list-style-type: decimal;
	}

.row {
	overflow: hidden;
	margin: 15px auto;
	}

.row h3 {
	font-size: 125%;
	color: #990000;
	}

.row .item, .column {
	width: 180px;
	float: left;
	margin-right: 15px;
	padding: 0;
	}

.item a img {
	display: block;
	text-align: center;
	margin: 0 auto;
	}

.row .last, .column .last {
	margin-right: 0;
	padding-right: 0;
	border: none;
	}
/*
.row ul {
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
	}
*/
.row ul li {
	padding-bottom: 7px;
	}

#sidebar {
	display: none;
	}


#sidebar, h4.contact {
	position: absolute;
	top: 200px;
	right: 40px;
	width: 200px;
	padding: 0 10px 20px 10px;
	background: #FFF7CC;
	border: 1px solid #DED6AD;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	}

h4.contact {
	padding-top: 15px;
	position: static;
	width: auto;
	color: #2d5554;
	}

.alt-sidebar {
	background: #fafafa; 
	border-color: #ccc;
	}

#sidebar h2, #sidebar h2 a {
	color: #900;
	position: static;
	border: none;
	padding-left: 0;
	font-size: 140%;
	text-align: left;
	margin-top: 15px;
	}

#sidebar ul {
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
	}

#sidebar ul li {
	font-size: 90%;
	padding-bottom: 10px;
	}

#sidebar ul li a {
	display: block;
	}

/* ----- footer ----- */
#footer {
	margin: 0 auto;
	padding: 35px 0 50px;
	height: 150px;
	width: 960px;
	/* background: url(/images/backgrounds/bottom.jpg) left top no-repeat; */
	text-align: center;
	font-size: 10px;
	position: relative;
	}
	
.footer_nav ul {
	text-align: center;
	padding-bottom: 5px;
	padding-top: 5px;
	padding-left: 0;
	margin-top: 0;
	/* cancels gap caused by top padding in Opera 7.54 */
	margin-left: 0;
	background: none; 
	color: #333;
	width: 100%;
	font-family: Arial,Helvetica,sans-serif;
	line-height: 18px;
	/* fixes Firefox 0.9.3 */
	}

.footer_nav ul li {
	display: inline;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 5px;
	/* matches link padding except for left and right */
	padding-top: 5px;
	}

.footer_nav ul li a {
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-top: 5px;
	color: #333;
	text-decoration: none;
	border-right: 1px solid #DBDBDB;
	}

.footer_nav ul li a:hover {
	background: none;
	color: #000;
	}

.footer_nav ul li a.last { border-right: none; }
	
#footer p {
	clear: both;
	}


/* typography
------------------------------------- */
h1, h2, h3, dt, legend {
	font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
	/* font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif," "Bitstream Vera Serif", "Liberation Serif", Georgia, serif; */
	font-weight: normal;
	line-height: 1.3em;
	color: #2d5554;
	text-shadow: 0 0 1px transparent;
	}

h1 a, h2 a, dt a, 
h1 a:hover, h2 a:hover, dt a:hover {
color: #417e7d;
}

h2 {
	position: relative;
	left: -18px;
	border-left: 3px solid #e50019;
	padding-left: 10px;
	font-size: 32px;
	text-align: left;
	margin-top: 0;
	text-shadow: 0 1px 1px #fff;
	}
	
h3 {
	font-size: 26px;
	text-align: left;
	margin-bottom: .08em;
	padding-bottom: 0;
	color: #2d5554; /* #333 */
	}

h3 a, h3 a:hover {
color: #333;
}
	
h3+p {
	margin-top: .09em;
	}
	
.article h3 {
margin-top: 1.3em;
margin-bottom: .09em;
}
	
dt, legend {
	font-weight: normal;
	font-size: 18px;
	}

h4 {
	font-size: 18px;
	}

.caption {
	text-align: left;
	line-height: 1.5em;
	font-size: x-small;
	}

.alert {
	color: #C00;
	}
	
.alert .field {
border: 1px solid #C00;
background: #ffc;
}

.small {
	font-size: 90%;
	line-height: 1.3em;
	}
	
abbr, acronym {
	font-style: italic;
	cursor: help;
	}

/* navigation
------------------------------------- */
a {
	color: #417e7d;
	text-decoration: none
	}

a:link {
	color: #417e7d;
	text-decoration: none
	}

a:hover  {
	color: #4c918e;
	text-decoration: underline
	}

.nav {
	background: #2b9186 url(/images/backgrounds/nav-gradient.jpg) left top repeat-x;
	border-radius: 15px;	
	box-shadow: 1px 3px 5px rgba(0,0,0,0.45);
	
	margin: 0 auto 27px auto;
	padding: 0;
	width: 960px;
	height: 37px;
	line-height: 37px;
	}

.nav ul {
	list-style-type: none;
	overflow: hidden;
	}

.nav ul li {
	float: left;
	margin-right: 15px;
	line-height: 37px;
	}

.nav ul li a {
	display: block;
	padding: 0 10px;
	color: #fff;
	text-shadow: 0 1px 3px #000;
	font-weight: bold;
	font-size: 14px;
	text-decoration: none;
	}

.nav ul li#nav-search {
	float: right;
	margin-right: 50px;
	width: 176px;
	height: 27px;
	}

#search {
	position: relative;
	height: 27px;
	}

#search fieldset {
	border: none;
	height: auto;
	width: 176px;
	height: 27px;
	margin: 0;
	padding: 0;
	}

#search fieldset input, #search fieldset button {
	border: none;
	}

#search fieldset input {
	position: absolute;
	top: 4px;
	left: 0;
	color: #5e6b69;
	text-shadow: 0 1px 1px #c6d7d5;
	width: 143px;
	height: 27px;
	line-height: 27px;
	margin: 0;
	padding: 0 33px 0 10px;
	background: url(/images/navigation/search-box.png) 0 0 no-repeat;
	}

#search fieldset input:focus {
	outline: none;
	}

#search fieldset input.clearFieldBlurred {
	color: #5e6b69;
	font-style: normal;
	text-shadow: 0 1px 1px #c6d7d5;
	}

#search fieldset input.clearFieldActive {
	color: #000;
	text-shadow: 0 1px 1px #c6d7d5;
	}

#search fieldset button {
	position: absolute;
	top: 4px;
	right: 0;
	width: 33px;
	height: 27px;
	margin: 0;
	padding: 0;
	cursor: pointer;
	text-indent: -9999px;
	background: url(/images/navigation/search-button.png) 0 0 no-repeat;
	}
	
	



.nav ul li a:hover, .nav ul li a:active {
	color: #4cf4f0;
	}

.nav ul li a.selected {
	color: #4cf4f0;
	font-weight: bold;
	}

.nav ul li a.last { border-right: none; }

.navcontainer #active { border-left: 1px solid #fff; }

.nav ul li a span {
	display: none;
	color: #4cf4f0;
	font-weight: bold;
	padding-left: 20px;
	}

/* ----- misc ----- */
.hide {
	display: none;
	}

.show {
	display: block;
	}

.payment-methods {
	width: 228px;
	margin: 25px auto;
	padding: 0;
	list-style-type: none;
	overflow: hidden;
	}

.payment-methods li {
	float: left;
	width: 51px;
	margin: 0 3px;
	padding: 0;
	}





.social-networks {
	z-index: 100; 
	position: absolute; 
	top: -75px; /* 215px; */
	right: 260px; /* 70px; */
	list-style-type: none;
	overflow: hidden;
	margin: 15px auto;
	padding: 0;
	}

#main .social-networks {
	position: static;
	}

.social-networks li {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;
	}

.social-networks a {
	background: url(/images/icons/social-icons-sprite.png) 0 0 no-repeat;
	width: 24px;
	height: 24px;
	display: block;
	text-decoration: none;
	}

a.icon-facebook {
	background-position: 0 0;
	}
a.icon-facebook:hover {
	background-position: 0 -24px;
	text-decoration: none;
	}

a.icon-twitter {
	background-position: -24px 0;
	}
a.icon-twitter:hover {
	background-position: -24px -24px;
	text-decoration: none;
	}

a.icon-linkedin {
	background-position: -48px 0;
	}
a.icon-linkedin:hover {
	background-position: -48px -24px;
	text-decoration: none;
	}

a.icon-google {
	margin-right: 0;
	background-position: -72px 0;
	}
a.icon-google:hover {
	background-position: -72px -24px;
	text-decoration: none;
	}





.social-fb {
position: absolute;
top: -15px;
left: 55px;
}

.share-social {
overflow: hidden;
position: relative;
border-top: 1px solid #dedede;
border-bottom: 1px solid #dedede;
margin: 25px auto;
padding: 7px 5px 5px;
}

.share-social li {
float: left;
min-width: 90px;
}

#sidebar .vcard p {
font-size: 85%;
line-height: 1.5em;
}

.byline {
font-size: 16px;
color: #666666;
padding: 3px 0;
}

.article {
margin-bottom: 25px;
}

.article h3 a {
display: block;
}

.article h4 {
margin-bottom: 0;
}

.article h3+h4 {
margin-top: .5em;
}

.article p {
font-size: 14px;
line-height: 1.5em;
}

.article-image, 
.article .product-image {
background: #fff;
padding: 15px;
border: 1px solid #ccc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
overflow: hidden;
-moz-box-shadow: 1px 1px 5px #ccc; 
-webkit-box-shadow: 1px 1px 5px #ccc; 
box-shadow: 1px 1px 5px #ccc; 
}

.article-image img, 
.article .product-image img {
text-align: center;
margin: 0 auto;
padding: 0;
}

.article .product-image {
width: 100%;
max-height: 480px;
padding: 0;
margin-bottom: 45px;
}

.lead-in, 
.article .lead-in {
font-size: 18px;
line-height: 1.3em;
color: #2d5554; /* #2d5554 */
}

/* articles listing */
#the-inside-track {
display: block;
text-indent: -99999px;
background: url(/images/logos/the-inside-track.png) left top no-repeat;
margin: 0;
padding: 132px 0 0;
width: 368px
height: 132px;
border: 0;
}

.category-desc {
z-index: 10;
position: absolute;
top: 145px;
left: 165px;
width: 475px;
font-size: 18px;
line-height: 1.3em;
color: #999;
}


.articles-list {
margin: 25px 0 15px;
/* overflow: hidden; */
}

.articles-list .article {
background: transparent;
overflow: hidden;
position: relative;
padding: 0 10px 0 155px;
min-height: 155px;
border-bottom: 1px solid #ccc;
}

.articles-list .article h3 {
font-size: 22px;
margin-top: 0;
}

.articles-list .article a, 
.articles-list .article a:hover {
text-decoration: none;
}

.articles-list .article p {
font-size: 14px;
color: #999;
}

.articles-list .article:hover p {
color: #666666;
}

.articles-list .article h3+p {
margin-top: 0.5em;
}

.articles-list .article-image-sm {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
border: 1px solid #ccc;
height: 125px;
width: 125px;
padding: 0;
}

.articles-list .article-image.article-image-sm img {
display: block;
position: absolute;
top: 0;
left: -40%;
text-align: right;
margin: 0;
}

.articles-list .article.article-featured {
padding: 25px 285px 15px 0;
/* min-height: 225px; */
position: relative;
border-top: 1px solid #ccc;
overflow: visible;
}

.articles-list .article.article-featured h3 {
font-size: 32px;
line-height: 1.3em;
margin-right: 10px;
}

.articles-list .article.article-featured p {
font-size: 18px;
line-height: 1.4em;
margin-right: 10px;
}

.articles-list .article.article-featured .article-image {
position: absolute;
top: 25px;
left: auto;
right: 0;
}



.testimonial {
background: url(/images/misc/quote.png) 15px 25px no-repeat;
padding: 25px 35px 0 95px;
margin: 25px auto;
width: 65%;
border-top: 2px solid #b9cbcb;
border-bottom: 2px solid #b9cbcb;
}

.testimonial .quote {
margin: 0;
padding: 0;
}

.testimonial .author {
text-align: right;
}



input:focus, textarea:focus { 
	background-color: #ffc; 
	}

label {
cursor: pointer;
}

.footnote {
	color: #999;
	font-size: 80%;
	}

img, a img {
	border-width: 0;
	border: none;
	text-decoration: none;
	}

.border {
	border: 1px solid #ccc;
	}

.border_btm {
	border-bottom: 1px dashed silver;
	}

.lrg_banner {
	margin: 15px auto 45px auto;
	text-align: center;
	}

.banner {
	margin: 15px auto 20px auto;
	text-align: center;
	}

.inset {
	width: 175px;
	margin: 0;
	text-align: center;
	float: right;
	}

.inset .caption {
	font-size: 80%;
	}

.no_bullet {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}
	
dd {
	margin: 0;
	}

.clearFieldBlurred {
color: #ccc;
font-style: normal;
}

.clearFieldActive {
color: #ccc;
}

/* tables */
.comparison-chart {
margin: 15px auto 35px;
border-collapse: collapse;
border: 1px solid #ccc;
}

.comparison-chart th, 
.comparison-chart td {
padding: 10px;
text-align: left;
min-width: 180px;
}

.comparison-chart th {
border-collapse: collapse;
border-bottom: 1px solid #ccc;
font-size: 14px;
background: #ccc;
}

.comparison-chart td {
border-collapse: collapse;
border-bottom: 1px solid #dedede;
font-size: 12px;
line-height: 1.4em;
}

.comparison-chart.chart-2col th, 
.comparison-chart.chart-2col td {
min-width: 280px;
}

.comparison-chart .shade {
background: #f5f5f5;
}

.comparison-chart td[scope="row"] {
font-weight: bold;
font-size: 14px;
}


/* alignment
------------------------------------- */
.align_left {
	float: left;
	}

.pad_left {
	float: left;
	margin: 0 15px 10px 0;
	}

.align_right {
	float: right;
	}

.pad_right { 
	float: right;
	margin: 0 0 10px 15px;
	}

.pad_center {
	text-align: center;
	margin: 0 auto 10px auto;
	}

.clear {
	clear: both;
	}