@charset "UTF-8";

/*fonts*/
@import url('http://fonts.googleapis.com/css?family=Bree+Serif');
@import url('http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,700,600,400italic,300italic,700italic,600italic,900italic,900');
@import url('socialicoregular.css');
@import url('font-awesome.css');
@import url('entypo.css');

/* core */
@import url('typography-bootstrap-core-reset.css'); /*typography, resets, bootstrap overrides */
@import url('../js/fancybox/source/jquery.fancybox.css');

/* pick the stuff you want and leave out the rest, better to load these in the html rather than this way (after compression)**/
/** however, in google speed tests leaving them here got a higher score.

/*misc add ons*/
@import url('equal-heights.css'); /*equal height columns*/
@import url('simple-gallery.css'); /*simple gallery of images with or without lightbox*/
@import url('tabs-toggle.css'); /*non-bootstrap tabs and toggles*/
@import url('stickynotes.css'); /*stickynotes*/
@import url('pricingcolumns.css');/*pricinging columns*/

/*sliders*/
@import url('lemmon-slider.css'); /*variable width image slider*/
@import url('parallax-slider.css'); /*parallax animated slider*/
@import url('html-content-slider-flexslider.css'); /*light and dark style html content slider*/
@import url('boxed-slider-flexslider.css'); /*flexslider in a box*/

/*anywhere that isotope masonry is used (testimonials, blog, portfolio)*/
@import url('gallery-folio-masonry.css');

/*blog, portfolio (these work together with above)*/
@import url('portfolio.css');
@import url('blog.css');


/********************************* main wrappers/containers */

#site_wrapper {
	background: #fff;
	width: 100%;
	position: relative;
	margin: 0 auto;
	max-width: 1200px;
	min-width: 240px;
}

.lt-ie9 #site_wrapper {
	width: 940px!important;
}

/* ie less than 9*/
#page {
	/*for screen reads to jump to*/
	position: relative;
	margin-top: 40px;
	/*pages with no page-header (page-header has -40px negative margin)*/
}

#main-content.container {
	clear: both;
	background: #fff;
	padding: 0 2% 30px 2%;
	width: 96%;
	margin: 0 auto;
}

.container {
	padding: 0 2%;
	margin: 0;
}

/********************************* base size of fonts and body/html  */

html {
	font-size: 62.5%;
	margin: 0;
	padding: 0;
}

body {
	background: #ff6600;
	font-size: 1.4rem;
	line-height: 1.8;
	margin: 0;
	padding: 0 40px 0 20px;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}

body.fixed {
	padding-top: 65px;
	/* when the page scrolls, this turns into fixed then turns off when the user reaches the top of the page*/
	transition: all 1s ease-out;
}

/*	Let's not abuse the webkit-font-smoothing: antialiased, 
it looks bad on reverse backgrounds with smaller, thin type
 */
#footer, .btn-inverse, .flexslider .btn, .header .user, .btn {
	-webkit-font-smoothing: subpixel-antialiased;
}

/********************************* text color */

body, html, a {
	color: #333;
}

h1 a, h2 a, h3 a, h5 a, h4 a {
	color: inherit;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
	color: #ff6600;
}

/********************************* font calls 

.short_headline, .call-to-action h3, h1, h2, h3, h4, h5, h6, #main_menu, .tagline, .dropcap, .slide-to-top .trigger {
	font-family: 'Bree Serif', Sans-Serif;
}
 */
 
#main_menu, {
	font-family: Arial;
}
.short_headline, .call-to-action h3, h1, h2, h3, h4, h5, h6, .tagline, .dropcap, .slide-to-top .trigger {
	font-family: 'Bree Serif', Sans-Serif;
}
body, input, textarea, button, form, #main_menu ul li li {
	font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
}

blockquote {
	font-family: Georgia, Serif;
}

/************************************************* HEADER and PREHEADER containers/wrappers */

/* if you remove the preheader your menu will overlap the logo in mobile, better just to remove the content not the actual wrapper otherwise you'll have to change a lot of stuff in the mobile css**/
.preheader {
	position: absolute;
	clear: both;
	top: 0;
	right: 0;
	width: 100%;
	z-index: 1000;
}

.preheader.fixed {
	display:none; /* the social icons were over the menu on scroll, this fixed it without messing with the testy z-index of the social icons*/
}

.header {
	z-index: 999;/*ie 7 needs this for some reason*/
	height: 205px; /*height of logo area (not the image itself) + height of menu wrapper */
	width: 100%;
	position: relative;
}

/************************************************* logo non-retina see instructions.html */

#logo,
#logo img {
	width: 600px;
	/*this is the height of the logo area not the actual logo*/
	height: 150px;
	/*this is the height of the logo area not the actual logo (100px)*/
	/* the logo itself is 240px X 100px it is vertically centered in the 145px height of this area 
    the image is a transparent img for ie7&8 to click or the link doesn't work*/
}

#logo {
	position: relative;
	float: left;
	left: 10px;
	background: url(../images/apa/coastal-carolina-apa-logo.png) 0% 50% no-repeat;
	/*240px X 100px NON RETINA VERSION*/
}

#logo em {
	position: absolute;
	display: block;
	top: -1000px;
	left: 100px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/*tagline*/
.header .tagline {
	font-weight: 300;
	float: left;
	margin: 0 0 0 20px;
	padding: 0;
	line-height: 145px;
	/*single line height of logo to make it vertically centered*/
	height: 145px;
	font-size: 100%;
}

/************************************************* preheader - user navigation login registration and phone */

.preheader .user {
	position: absolute;
	top: 0;
	height: 30px;
	right: 0;
	max-width: 1200px;
	z-index: 100;
	width: 95%;
}

.preheader .user ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.preheader .user li {
	float: right;
	position: relative;
}

.preheader .user a {
	text-decoration: none;
	display: block;
	padding: 0 15px;
	color: #fff;
	font-size: 90%;
	line-height: 28px;
	height: 30px;
	text-transform: uppercase;
}

.preheader .user .phone a,
.preheader .user .phone {
	background: #000;
	color: #fff;
}

.preheader .user .login a {
	background: #ff6600;
}

.preheader .user .register a {
	background: #444;
}

.preheader div.tooltip.left {
	left: -50px;
}

.preheader .tooltip .tooltip-inner {
	background: #ccc;
	color: #000;
	white-space: nowrap;
}

.preheader .tooltip.left .tooltip-arrow {
	border-left-color: #ccc;
}

.preheader .tooltip.bottom .tooltip-arrow {
	border-bottom-color: #ccc;
}

/* hide the phone icon on the number in desktop view */
.preheader .user .phone i {
	display: none;
}

/************************************************* search */

.lt-ie8 i.icon-search {
	font-size: 25px;
}

.preheader form {
	margin: 0;
	padding: 0;
	height: 30px;
}

.search-wrapper {
	position: absolute;
	top: 40px;
	right: 15px;
}

.lt-ie8 .search-wrapper {
	height: 60px;
	zoom: 1;
}

.search #search-trigger {
	color: #ccc;
	display: block;
	float: left;
	cursor: pointer;
}

.search #search-trigger i:before {
	font-size: 25px;
	line-height: 60px;
	padding: 0;
	margin: 0;
	position: relative;
	top: -10px;
}

.search #search-trigger.active i:before {
	content: "\2716";
}

.search input {
	background-color: #fff;
	width: 200px;
	margin-left: 5px;
	top: 3px;
	position: relative;
	font-size: 16px!important;
	-webkit-appearance: textfield;
}

.js .search input {
	display: none;
}

.no-js #search-trigger, .lt-ie8  #search-trigger {
	display: none!important;
}

.no-js .search input, .lt-ie8 .search input {
	width: 180px;
	border: 1px solid #ddd;
}

/************************************************* social in preheader */

.preheader .social a {
	color: #fff;
	position: relative;
	text-decoration: none;
	display: block;
	width: 35px;
	height: 35px;
}

.preheader .social {
	margin: 0;
	width: 35px;
	position: absolute;
	top: 10px;
	right: -40px;
	left: auto;
	z-index: 1000;
	text-align: center;
}

.preheader .social li {
	float: left;
	clear: both;
	padding: 0;
	width: 25px;
	height: 25px;
	margin: 0 0 5px 0;
	text-align: center;
	list-style: none;
}

.preheader .social [class^="socicon"]:before,
.preheader .social [class*=" socicon"]:before {
	font-size: 22px;
	display: inline-block;
	line-height: 25px;
	text-decoration: none!important;
	text-align: center;
	padding: 0;
	margin: 0;
	position: relative;
	left: 0;
}

/************************************************* main navigation vivid-menu.js */

.menu_wrapper {
	position: absolute;
	height: 60px;
	left: 0;
	right: 0;
	top: 145px;	/*height of the logo area above it*/
	background-color: #000;
	width: 100%;
}

#main_menu a {font-size:120%;} /* desktop menu font size */

.menu_wrapper.fixed {
	position: fixed;
	top: 0;
	border-bottom: 3px solid #ff6600;
	z-index: 9999;
}

.menu_wrapper.fixed #main_menu {
	left: -10px;
}


.mobile_nav {
	display: none;
}

/* hide trigger for desktop */
#main_menu {
	padding: 0;
	z-index: 999;
	clear: none;
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
	left: 0;
	height: 55px;
}

#main_menu ul {
	display:block;
}

/*** this logo shows up when you scroll */
.menu_wrapper.fixed #main_menu {
	background: #000 url(../images/apa/sm-scroll-menu-header.gif) 98% 50% no-repeat;
	/*96px X 40px non retina*/
}

#main_menu li.parent i {
	background: url(../images/menu_arrow.png) 0 0 no-repeat;
	display: inline-block;
	width: 5px;
	margin-left: 8px;
	height: 5px;
	position: relative;
	top: -2px;
}

.lt-ie8 #main_menu .parent i {
	position: relative;
	display: inline;
	zoom: 1;
	left: 5px;
	top: -4px;
}

#main_menu ul ul li.parent i {
	background-position: -5px 0;
}

#main_menu ul {
	margin: 0 0 0 20px;
	padding: 0;
	position: relative;
	list-style: none;
	background: #000;
}

#main_menu ul ul {
	margin: 0;
	padding: 0;
	display: none;
}

/* first level */
#main_menu li {
	float: left;
	margin: 0;
	padding: 0 20px 0 0;
	position: relative;
	background: #000;
}

#main_menu li a {
	border: none;
	color: #fff;
	display: block;
	height: 55px;
	line-height: 50px;
	margin: 0!important;
	padding: 0;
	border-top: 5px solid #000;
	text-decoration: none;
}

#main_menu li.parent.foo a {
	border-top-color: #000;
}

#main_menu a:hover,
#main_menu .active a,
#main_menu a.selected,
#main_menu li.parent.foo.active a {
	border-top: 5px solid #ff6600;
}

#main_menu li li {
	padding: 0;
}

#main_menu ul li ul li a {
	font-size: 90%;
}

.lt-ie9 #main_menu {
	font-size: 110%;
}

.lt-ie9 #main_menu ul li ul li a {
	font-size: 100%;
}

#main_menu ul li ul li a,
#main_menu ul ul a.selected,
#main_menu ul ul .active,
#main_menu ul ul a:hover {
	/* text-transform: none;*/
}

#main_menu li.active ul a {
	background-color: inherit;
	*background-color: transparent;
}

#main_menu li ul a:hover,
#main_menu ul li li a.selected,
#main_menu li.active ul li.active a, 
#main_menu li.active ul li.active ul li.active a, 
#main_menu li.active ul li.active ul li a:hover {
	background-color: #ff6600;
}

#main_menu li.active ul li.active ul li a {
	background-color: inherit;
	*background-color: transparent;
}

#main_menu ul li ul li {
	background: #333;
	/* second level bg color */
	float: none;
	left: auto;
	margin: 0;
	top: 0;
	width: 100%;
}

#main_menu ul li ul li ul li {
	background: #333;
}

#main_menu li li {
	border-bottom: 1px solid #444;
}

#main_menu li ul a,
#main_menu li ul li a,
#main_menu li ul li ul li a {
	height: auto;
	line-height: 1.5;
	padding: 7px 10px;
	width: 175px;
	color: #fff;
	border: 0px!important;
}

#main_menu li ul {
	background: #333;
	left: 0;
	padding: 0;
	position: absolute;
	top: 60px;
	z-index: 100;
}

#main_menu li ul ul {
	border-top: 0px;
	z-index: 100000;
}

#main_menu ul ul ul {
	border: none;
	top: 0!important;
	left: 195px;
	/*when js is off*/
}

#main_menu li ul li ul {
	padding: 0;
	position: absolute;
	top: 0;
}

/* fourth level + bad idea to have more than two levels*/
#main_menu ul li ul li ul li ul li a {
	background: #333;
}

/* ie7 fix */
.lt-ie8 #main_menu ul ul ul {
	display: none;
}

/* js off */
.no-js #main_menu ul li:hover ul {
	display: block;
}

.no-js #main_menu ul li:hover ul li ul {
	display: none;
}

.no-js #main_menu li:hover ul,
.no-js #main_menu li:hover ul li:hover ul {
	display: block;
}

.no-js.lt-ie8 #main_menu ul ul li:hover ul {
	display: block;
}


/********************************* .short_headline  */

.short_headline {
	margin: 10px 0 30px 0;
	text-transform: uppercase;
	line-height: 1.2;
	clear: both;
	font-size: 140%;
	background: url(../images/diagstripe.png);
	border-left: 5px solid #ff6600;
}

.short_headline span {
	background: #fff;
	padding: 0 10px 5px 10px;
}

p + .short_headline,
table + .short_headline,
blockquote + .short_headline,
ul + .short_headline,
ol + .short_headline,
dl + .short_headline,
form + .short_headline,
h1 + .short_headline,
h2 + .short_headline,
h3 + .short_headline,
h4 + .short_headline,
h5 + .short_headline,
h6 + .short_headline,
.row-fluid + .short_headline {
	margin-top: 30px!important;
}

.short_headline + h1 {
	margin-top: 3%!important;
}

.short_headline.margin-top {
	margin: 2em 0 1em 0;
}

.widget .short_headline {
	font-size: 110%;
	margin-bottom: 1em;
}

/* this adds "..." to the sidebar when the text gets too wide for the column it's slick */
.widget .short_headline {
	display: block;
	text-overflow: ellipsis;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-top:0;
}


/********************************* images  */

.lt-ie9 img {
	-ms-interpolation-mode: bicubic;
}

img {
	max-width: 100%;
	display: block;
}

img.alignright {
	float: right;
	margin: 1% 0 1% 3%;
}

img.alignleft {
	float: left;
	margin: 1% 3% 1% 0;
}

img.aligncenter,
img.alignnone {
	display: block;
	margin: 0 auto 2% auto;
}

.span4 img.aligncenter,.span4 img.alignnone,
.span3 img.aligncenter,.span3 img.alignnone {
	margin-bottom: 5%;
}

img.add-margin-bottom {margin-bottom:20px;}
img.add-margin-top {margin-top:20px;}


/********************************* figures  */

figure img {
	margin: 0;
	display: inline;
}

figure {
	margin: 0 0 4% 0;
}

figcaption {
	text-align: left;
	margin-top: 0px;
	padding: 10px 0;
	clear: both;
	font-size: 90%;
	font-style: italic;
	background: url(../images/hr.png) 0 100% repeat-x;
}

figcaption p:last-child {
	margin-bottom: 0%;
}

figure.three-images {
	position: relative;
	width: 100.5%;
}

figure.three-images img {
	width: 32.333%;
	float: left;
	margin: 0 1% 0 0;
}

figure.two-images {
	position: relative;
	width: 100.5%;
}

figure.two-images img {
	width: 49%;
	float: left;
	margin: 0 1% 0 0;
}

/********************************* image hovers/overlays of that plus sign */

a.hover {
	display: block;
	position: relative;
}

span.plus {
	position: absolute;
	width: 100%;
	display: none;
	height: 100%;
	background: url(../images/plus.png) 50% 50% no-repeat;
	left: 0;
	top: 0;
	opacity: 0;
}

a:hover .plus {
	display: block;
	z-index: 200;
	opacity: 1;
}

/********************************************************* hero-unit */

.hero-unit .row-fluid.container, 
.hero-unit .container {
	padding: 0;
}

/******************* hero-unit SIMPLE STYLE*/
.hero-unit {
	position: relative;
	clear: both;
	margin: -40px 0 40px 0;
	padding: 30px 4% 20px;
	background: #fff url(../images/dottedbg.png);
	-webkit-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
	-moz-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
	box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
}

.hero-unit h1 {
	padding: 0;
	line-height: 1.35;
	font-size: 220%;
}

/******************* hero-unit SPLIT STYLE */

.hero-unit.split {
 padding-top:30px;
}

.hero-unit.split h1 {
	line-height: 1.4;
	border-right: 1px solid #ccc;
	padding-right: 5%;
	margin:0;
}

.hero-unit.split .content {
	width: 47%;
	float: left;
	margin-left: 2%;
}

.hero-unit.split .headline {
	width: 47%;
	text-align: right;
	float: left;
}


/********************************* page header */

.page-header {
	border-bottom: 0px;
	margin: -40px 0 40px 0;
	clear: both;
	padding: 0;
	background: url(../images/dottedbg.png);
	-webkit-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
	-moz-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
	box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.10);
}

.page-header h1 small {
	font-size: 45%;
	color: #888;
	position: relative;
	padding: 0 0 0 15px;
	margin: 0 0 0 10px;
	border-left: 1px solid #777;
}

.page-header h1 {
	padding: 20px;
	margin: 0;
}

/********************************* well */

.well {
	background: url(../images/dottedbg.png);
	padding: 4% 5%;
	border: none;
	-webkit-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.15);
	box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.15);
}

.well h2 {
	margin-top: 0;
}

.well img.alignleft, .well img.alignright {
	margin-top: 2%;
}

/********************************* call to action */

.call-to-action {
	position: relative;
	text-align: center;
	padding: 25px 20px 28px 20px;
	margin: 20px 0 30px;
	background: url(../images/dottedbg.png) fixed;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

.row + .call-to-action, 
.row-fluid + .call-to-action {margin:10px 0 30px;}

.call-to-action h3 {
	margin-top: 0;
	margin-bottom: 1.5%;
	font-size: 200%;
}

.call-to-action p {
	font-size: 110%;
}

/****** call to action traditional layout : Message Left Button Right */
.call-to-action.trad .message {
	float: left;
	width: 70%;
	text-align: left;
	margin-right: 5%;
}

.call-to-action.trad .message p:last-child {
	margin-bottom: 0;
}

.call-to-action.trad .action {
	float: right;
	width: 20%;
	text-align: right;
	padding-top: 2%;
}

/******* call to action inverse */
.call-to-action.inverse {
	background: #000 url(../images/dottedbg-dark.png) fixed;
}

.call-to-action.inverse * {
	color: #fff;
}

/*********** footer call to action */
.call-to-action-footer {
	background: #000 url(../images/dottedbg-dark.png) fixed;
}

.call-to-action-footer .call-to-action {
	margin: 0;
	border: 0px;
	padding: 2% 3%;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	background: transparent;
}

.call-to-action-footer .call-to-action * {
	color: #fff;
}

.call-to-action-footer .call-to-action h4 {
	margin-top: 0;
	margin-bottom: 1.5%;
	font-size: 160%;
}

/********************************* flexslider basic content slider for blog or wherever */

.image-slider.flexslider {
	margin-bottom: 2%;
	position: relative;
}

.image-slider.flexslider .flex-direction-nav a:hover {
	background-color: #999999;
}

.image-slider.flexslider .flex-direction-nav a {
	position: absolute;
	z-index: 200;
	top: 30%;
	right: 0;
	width: 30px;
	border: 2px solid #fff;
	border-right: 0px;
	height: 50px;
	text-indent: -9999px;
	display: block;
	background: #000 url(../images/sliderarrows.png) -80px 50% no-repeat;
}

.image-slider.flexslider .flex-direction-nav .flex-prev {
	right: auto;
	border-left: 0px;
	border-right: 2px solid #fff;
	left: auto;
	background-position: -110px 50%;
}

.image-slider.flexslider .caption {
	text-align: left;
	margin-top: 0px;
	padding: 10px 0;
	clear: both;
	font-size: 90%;
	font-style: italic;
	background: url(../images/hr.png) 0 100% repeat-x;
}

.image-slider.flexslider .caption.no-border {
	background: none;
}

.image-slider.flexslider .caption p:last-child {
	margin-bottom: 0;
}

.image-slider.flexslider .flex-direction-nav .flex-disabled,
.image-slider.flexslider .flex-direction-nav .disabled {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	-moz-opacity: 0.3;
	-khtml-opacity: 0.3;
	opacity: 0.3;
	cursor: default;
}

/********************************* flexslider hero-unit image slider */

.hero-slider.flexslider {
	margin-bottom: 2%;
	padding-bottom: 10px;
	position: relative;
}

.hero-slider.flexslider .flex-direction-nav {
	display: none;
}

.hero-slider.flexslider .flex-control-nav {
	position: relative;
	text-align: center;
	margin: 0 auto;
	width: 100%;
	padding: 10px 0 0 0;
	overflow: hidden;
}

.hero-slider.flexslider .flex-control-nav li {
	margin: 0 0 0 5px;
	display: inline-block;
	zoom: 1;
	*display: inline;
}

.hero-slider.flexslider .flex-control-paging li a {
	width: 10px;
	height: 10px;
	display: block;
	background: #ccc;
	cursor: pointer;
	text-indent: 9999px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

.hero-slider.flexslider .flex-control-paging li a:hover {
	background: #000;
}

.hero-slider.flexslider .flex-control-paging li a.flex-active {
	background: #000;
	cursor: default;
}

/********************************* columns *******************************/

/* used on the home page to put the .well before the testimonials &
  on the contact page to put the form before the address on desktop */

.row-fluid.reverse-order .span4, 
.row-fluid.reverse-order .span5 {
	float: right;
}

.row-fluid.reverse-order .span8, 
.row-fluid.reverse-order .span7 {
	margin-left: 0;
}

/******************************************** left side bar */
.row-fluid.sidebar-left .span3 {
	float: left;
	margin-left: 0;
}

.row-fluid.sidebar-left .span9 {
	float: right;
	margin-right: 0;
}

.sidebar-left {
	background-image: url(../images/rule.png);
	background-position: 23.5% 0;
	background-repeat: repeat-y;
}

.sidebar-left .secondary-column .widget {
	padding-right: 20px;
}

/******************************************** right side bar */
.sidebar-right {
	background-image: url(../images/rule.png);
	background-position: 76.5% 0;
	background-repeat: repeat-y;
}

.sidebar-right .secondary-column .widget {
	padding-left: 20px;
}

/******************************************** three columns fat skinny skinny */
.contemporary-three-columns {
	background-image: url(../images/rule.png), url(../images/rule.png);
	background-position: 50.75% 0, 76% 0;
	background-repeat: repeat-y;
}

.contemporary-three-columns .secondary-column .widget {
	padding: 0 20px;
}

.contemporary-three-columns .tertiary-column .widget {
	padding-left: 20px;
}

/******************************************** holy grail skinny fat skinny */
/**** VERY COOL STUFF KEEP feel free to share, it took me a lot of trial, error, and testing! */
.row-fluid.holy-grail .primary-column {
	float: left;
	margin-left: 25.531914893617%;
	margin-right: -25.531914893617%;
}

.row-fluid.holy-grail .secondary-column {
	float: left;
	margin-left: -48.55%;
	*margin-left: -50%;
}

.row-fluid.holy-grail .tertiary-column {
	float: right;
}

.holy-grail {
	background-image: url(../images/rule.png), url(../images/rule.png);
	background-position: 23.5% 0, 76.5% 0;
	background-repeat: repeat-y;
}

.holy-grail .tertiary-column .widget {
	padding-left: 20px;
}

.holy-grail .secondary-column .widget {
	padding-right: 20px;
}

.lt-ie9 .contemporary-three-columns, 
.lt-ie9 .contemporary-three-columns, 
.lt-ie9 .sidebar-right, .lt-ie9 .sidebar-left {
	background-image: none;
}


/************************************************* widgets and sidebars */

.widget {
	margin: 0 0 30px 0;
	clear: both;
}

.widget p {
	font-size: 90%;
}

.widget p:last-child {
	margin: 0px;
}

/*sidebar images*/
.widget img.alignleft {
	margin: 5px 10px 0 0;
}

.widget img.alignright {
	margin: 5px 0 0 10px;
}

.widget img.aligncenter {
	margin: 0 0 10px 0;
	display: block;
	float: none;
	width: 100%;
}

.lt-ie9 .widget {
	background: url(../images/dottedbg.png) fixed;
	padding: 15px;
}

.lt-ie9 .widget .short_headline span {
	background: url(../images/dottedbg.png) fixed;
}

.lt-ie9 .widget .short_headline {
	background: none;
}

.lt-ie8 .sidebar-right .span9, .lt-ie8 .contemporary-three-columns .span6 {
	margin-left: 0!important;
}

/************************************************* sidebar tags in tab widget */
.sidebar-tabs .tag-wrapper a, .entry-tags a {
	float: left;
	display: block;
	text-decoration: none;
	background: #000;
	padding: 2px 8px 3px;
	margin: 0 3px 3px 0;
	color: #fff;
	font-size: 85%;
}

.sidebar-tabs .tag-wrapper a:hover, .entry-tags a:hover {
	background: #ff6600;
	color: #fff;
}

/** tabs-toggles.css contains the styles for the tabbing in the sidebar and in the main content **/

/************************************************* sidebar page navigation or a list of navigation (we don't like boostrap's page list fugly)*/
ul.navigation {
	margin-left: 0;
	padding-left: 0;
}

ul.navigation li {
	margin-left: 0;
	padding: 0 0 3px 15px;
	list-style: none;
	display: block;
	position: relative;
}

/*making proper hanging indent with an icon font works in ie 8 and above*/
ul.navigation li:before {
	font-family: 'entypo';
	content: '\e75e';
	/*e-icon-right-open*/
	position: absolute;
	left: 0px;
	top: 1px;
	font-size: 10px;
	line-height: 2em;
	color: #aaa;
}

ul.navigation li a {
	text-decoration: none;
	display: block;
	color: #777;
}

ul.navigation li.active a,
ul.navigation a:hover, ul.navigation li:hover a:before {
	color: #000;
	font-weight: bold;
}

ul.navigation li.active a:before,
ul.navigation ul {
	margin-left: 10px;
	margin-bottom: 0;
	font-size: 90%;
}

/************************************************* blog post list in sidebar widget*/

.widget ul.blogposts {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

.widget ul.blogposts a {
	text-decoration: none;
}

.widget ul.blogposts li {
	border-bottom: 1px dotted #dddddd;
	float: left;
	margin-top: 10px;
	padding: 0px 0px 10px;
	width: 100%;
}

.widget ul.blogposts li:last-child {
	border: none;
	padding: 0px;
}

.widget ul.blogposts h3 {
	font-size: 105%;
	margin: 0px 0px 5px 50px;
}

.widget ul.blogposts p {
	margin: 0px 0px 0px 50px;
	font-size: 85%;
}

.widget ul.blogposts span.date {
	background: #009900;
	color: #FFF;
	-webkit-border-radius: 60px;
	border-radius: 60px;
	display: block;
	float: left;
	line-height: 1;
	height: 32px;
	width: 40px;
	padding: 8px 0 0 0;
	text-align: center;
}

.widget ul.blogposts .date .day {
	font-size: 13px;
	font-weight: bold;
	display: block;
}

.lt-ie9 ul.blogposts .date .day {
	top: 2px;
}

.widget ul.blogposts span.date .month {
	font-size: 10px;
	display: block;
	position: relative;
	text-transform: lowercase;
}

.widget ul.blogposts span.date .year {
	display: none;
}

/************************************************* widget with sponsors */
.widget .sponsors {
	margin: 0;
	padding: 0;
}

.widget .sponsors li {
	margin: 0 3% 3% 0;
	padding: 0;
	list-style: none;
	float: left;
}

.span3 .widget .sponsors li {
	width: 47%;
}

.span4 .widget .sponsors li {
	width: 100px;
	height: 100px;
}

/********************************* image widget in sidebar and footer */

ul.image-widget {
	position: relative;
	left: -5px;
	margin: 0;
	padding: 0;
}

.image-widget li {
	float: left;
	margin: 0 5px 10px 5px;
	width: 50px;
	height: 50px;
	list-style: none;
}

.image-widget a {
	position: relative;
	float: left;
}

.image-widget a:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	box-shadow: inset 0 0 6px rgba(0,0,0,.6);
	-moz-box-shadow: inset 0 0 6px rgba(0,0,0,.6);
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.6);
}

/*sidebar image widget */
.widget .image-widget li {
	width: 45px;
	height: 45px;
}


/********************************* social icons */
.social {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	left: -8px;
}

.social li {
	display: inline-block;
	padding: 0 7px 0 7px;
	font-size: 80%;
	*padding: 0;
	*display: inline;
	*zoom: 1;
}

.social li a:hover {
	opacity: .5;
}


/********************************* #footer */

#footer {
	clear: both;
	padding: 0;
	background: #000;
}

#footer .row-fluid {
	margin:20px 0;
}

#footer * {
	color: #fff;
}

#footer p {
	font-size:90%;
}

#footer a {
	text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
}

#footer h4 {
	margin: 0 0 10px 0;
	padding: 0 0 5px 0;
	text-transform: uppercase;
	font-size: 90%;
	font-weight: normal;
	color: #ff6600;
}

#footer section {
	padding: 5px 0;
}


#footer .input-append.fluid input[type="email"] {
	width: 55%;
}

#footer .social li {
	display: inline-block;
	padding: 0 7px 0 7px;
	*padding: 0;
	*display: inline;
	*zoom: 1;
}

#footer .social li a {
	color: #aaa;
}

#footer .social li a:before {
	font-size: 22px;
	width: 22px;
}

#footer .tooltip .tooltip-inner {
	background: #ccc;
	color: #000;
}

#footer .tooltip.top .tooltip-arrow {
	border-top-color: #ccc;
}


/********************************* .footerCredits */

.footerCredits {
	padding: 0;
	clear: both;
	text-align: center;
	background: #333;
	position: relative;
	text-transform:uppercase;
}

.footerCredits * {
	color: #777;
}

.footerCredits ul {
	list-style: none;
	padding: 10px 0;
	margin: 0;
	position: relative;
	left: -10px;
}

.footerCredits li {
	display: inline;
	padding: 0 12px 0 8px;
	border-right: 1px solid #888;
}

.footerCredits li:last-child,
.footerCredits .last {
	border: none;
}

.footerCredits li:first-child {
	padding-left: 0;
}

.footerCredits {
	padding: 10px;
	font-size: 70%;
}

.footerCredits a,
.footerCredits li {
	text-decoration: none;
	margin: 0;
}

.footerCredits a:hover {
	color: #aaa;
}

/********************************* sliding tweets */
.tweetslide-wrapper.flexslider {
	zoom: 1;
	margin: 0 auto;
	padding: 0;
	clear: both;
	overflow: hidden;
	z-index: 2;
	background:#444;
}

.tweetslide-wrapper.flexslider * {
	color:#ccc;
}

.tweetslide-wrapper.flexslider .slides {
	zoom: 1;
}

.tweetslide-wrapper.flexslider {
	position: relative;
	clear: both;
	margin: 0;
	padding: 10px;
	text-align: center;
}

.tweetslide-wrapper.flexslider a {
	border-bottom: 1px dotted #999;
	text-decoration:none;
}

.tweetslide-wrapper.flexslider li {
	padding: 0;
	margin: 0;
	list-style-type: none;
	overflow: visible!important;
}

.tweetslide-wrapper.flexslider .tweet_text {
	overflow: visible!important;
}

.tweetslide-wrapper.flexslider .tweet_list .tweet_avatar {
	float: none;
	width: 100%;
}

.tweetslide-wrapper.flexslider .tweet_list .tweet_avatar img {
	max-width: none;
	width: auto;
	margin: 10px auto;
}

.tweetslide-wrapper.flexslider .flex-direction-nav li {
	display: inline-block;
	margin: 10px 5px;
}

.tweetslide-wrapper.flexslider .flex-direction-nav .flex-disabled {
	opacity: .3!important;
	filter: alpha(opacity=30);
	cursor: default;
}

.tweetslide-wrapper.flexslider .flex-direction-nav a {
	width: 20px;
	height: 20px;
	border: none;
	text-indent: -9999px;
	display: block;
	background: #000 url(../images/sliderarrows.png) -280px 50% no-repeat;
}

.tweetslide-wrapper.flexslider .flex-direction-nav .flex-prev {
	left: 0;
	background-position: -300px 50%;
}

.tweetslide-wrapper.flexslider .slides > li {
	display: none;
	-webkit-backface-visibility: hidden;
	position: relative;
}


/********************************* .backToTop */

.backToTop {
	position: fixed;
	bottom: 10px;
	z-index: 1000;
	right: 10px;
}

.backToTop a {
	width: 50px;
	text-indent: -9999px;
	height: 50px;
	display: block;
	margin: 0;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	border-radius: 25px;
	background: #000 url(../images/top.png) no-repeat center center;
}

.backToTop a:hover {
	background-color: #333;
}

/********************************************** PAGES  ***************/

.mobile-page-nav { /* sidebar tags in tab widget */

	display: none;
}

/******************************** .clientlogos on about page  */

.clientlogos {
	position: relative;
}

.clientlogos .slides {
	margin: 0 auto;
	padding: 0;
	position: relative;
	margin-bottom: 30px;
}

.clientlogos .slides li {
	margin: 0 1px 0 0;
	position: relative;
	width: 184px;
	float: left;
	border-right: 1px solid #dddddd;
}

.no-js .clientlogos .slides li {
	width: 16.6666%;
	float: left;
}

.clientlogos .slides li img {
	width: 100%;
}

.clientlogos .flex-direction-nav .flex-disabled {
	opacity: .3!important;
	filter: alpha(opacity=30);
	cursor: default;
}

.clientlogos .flex-direction-nav a {
	position: absolute;
	z-index: 200;
	bottom: 0;
	left: 25px;
	width: 20px;
	height: 20px;
	border: none;
	text-indent: -9999px;
	display: block;
	background: #000 url(../images/sliderarrows.png) -280px 50% no-repeat;
}

.clientlogos .flex-direction-nav .flex-prev {
	left: 0;
	background-position: -300px 50%;
}
/************************************************* contact page */

.contact-page .icon-map-marker {
	text-decoration: none;
	display: block;
	width: 50px;
	height: 80px;
	float: right;
}

.contact-page .icon-map-marker:before {
	font-size: 50px;
	line-height: 1;
	color: #ff6600;
}

.contact-page textarea {
	height: 250px;
}

/************************************************* login page */

.login-box {
	width: 70%;
	margin: 0 auto;
}

.login-box .login-wrapper {
	background-image: url(../images/rule.png);
	background-position: 50% 0;
	background-repeat: repeat-y;
}

#login-form .btn {
	margin: 3% 0;
}

.login-box .pull-left, 
.login-box .pull-right {
	width: 40%;
	padding: 5%;
}

/* login box right side desktop twitter / facebook etc. */
.login-box ul {
	margin: 0 0 20px 0;
	padding: 0;
}

.login-box ul li {
	margin: 0 0 8px 0;
	padding: 0;
	list-style: none;
}

.login-box ul a img:hover {
	-moz-opacity: 0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

.forgot-password {
	padding-bottom: 40px;
}

/************************************************* registration page */

.register-box {
	width: 70%;
	margin: 0 auto;
}


/************************************************* testimonial page */

/*** uses styles in gallery-folio-masonry.css ***/

.testimonial-gallery li {
	background: url(../images/dottedbg.png);
	padding-top:10px;
	padding-bottom:10px;
}

.testimonial-gallery li.highlight {
	background: #000 url(../images/dottedbg-dark.png) fixed;
	color: #fff;
}

.testimonial-gallery li.highlight blockquote {
	background-image: url(../images/open-quote-white.png);
}

.testimonial-gallery li blockquote {
	margin-bottom:0;
}

.testimonial-gallery li blockquote {
	font-size:100%;
}


/************************************************* rotating testimonials */

.rotating-testimonials {
	padding: 10px 0px;
}

.rotating-testimonials .tabs {
	clear: both;
	list-style: none;
	margin: 0 0 10px 0;
	padding: 0px;
	text-align: left;
}

.rotating-testimonials .tabs li {
	background: #444444;
	border: none;
	display: inline-block;
	*display: inline;
	height: 8px;
	width: 8px;
	margin: 15px 5px 0px;
	zoom: 1;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.no-js .rotating-testimonials .tabs li {
	display: none;
}

.rotating-testimonials .tabs li.active,
.rotating-testimonials .tabs li:hover {
	background: #999999;
	padding: 0px;
}

.rotating-testimonials .tabs li a {
	display: block;
	height: 20px;
	padding: 0px;
	text-indent: 9999px;
	overflow: hidden;
}

.rotating-testimonials .panels {
	/* ie fix */
	width: 100%;
}

.rotating-testimonials .panels blockquote {
	margin-bottom: 0;
	background-color: transparent;
	border: 0px;
}

/*sidebar widget styles for rotating testimonials */
.sidebar .rotating-testimonials .panels blockquote {
	font-size: 100%;
	padding: 0;
	margin-bottom: 0;
	background-image: none!important;
}

.sidebar .rotating-testimonials .tabs {
	text-align: right;
	margin-bottom: 0;
}

/************************************************* components */

/************************************************* responsive videos OUTSIDE OF SLIDERS */
.no-js .video-wrapper iframe, .no-js .flex-vid iframe {
	display: none;
}

.no-js noscript {
	font-weight: bold;
	background: #000;
	color: #fff;
	display: block;
	padding: 10px;
	margin: 10px 0;
}

.no-js noscript * {
	color: #fff;
}

iframe {
	border: 0px;
}

.video-wrapper {
	margin: 2% 0;
}

/************************************************* flexslider core used whenever there is a flexslider */

.flex-container a:active,.flexslider a:active,.flex-container a:focus,.flexslider a:focus {
	outline: none;
}

.slides,.flex-control-nav,.flex-direction-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}

.flexslider {
	margin: 0;
	padding: 0;
}

.flexslider .slides > li {
	display: none;
	-webkit-backface-visibility: hidden;
	position: relative;
}

.flexslider .slides img {
	width: 100%;
	display: block;
}

.slides:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

* html .slides {
	height: 1%;
}

html[xmlns] .slides,.no-js .slides > li:first-child {
	display: block!important;
}

/************************************************* isotope/masonry core css */

.isotope-item {
	z-index: 2;
}

.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1;
}

.isotope, .isotope .isotope-item {
	-webkit-transition-duration: .8s;
	-moz-transition-duration: .8s;
	transition-duration: .8s;
}

.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width;
}

.isotope .isotope-item {
	-webkit-transition-property: 0 opacity;
	-moz-transition-property: 0 opacity;
	transition-property: transform, opacity;
}

/*
***********************************************************************************
/*	BEGIN MEDIA QUERIES
***********************************************************************************
 */

@media only screen and (max-width: 1260px) {
	.menu_wrapper.fixed #main_menu {
		left: 0px;
	}
} /*end*/

@media only screen and (min-width: 981px) { /**all sizes from 981 and UP!! */
	body {
		font-size: 1.5rem;
		line-height: 1.6;
	}
} /*end*/


@media only screen and (max-width: 980px) {
	body {
		font-size: 1.4rem;
		line-height: 1.65;
		padding-right:55px;
	}
	
	/********************************************************* main menu max-width 980px adjustments */
	#main_menu a {
		font-size: 110%; /* either keep the links short or adjust the font size */
	}
	#main_menu {
		-webkit-text-stroke: 0.35px;
	}
	
	/********************************************************* hero-unit max-width 980px adjustments */
	.hero-unit h1,
	.hero-unit h1,
	.hero-unit.split h1,
	.hero-unit.split h2 {
		font-size: 170%;
	}
	
	.hero-unit p,
	.hero-unit.split p {
		font-size: 90%;
	}
	
	.hero-unit .content h3, 
	.hero-unit.split .content h3 {
		font-size: 120%;
		margin-bottom: 0;
	}

	
	/********************************************************* call-to-action max-width 980px adjustments */

	.call-to-action h3 {
		font-size: 210%;
	}
	
	.call-to-action.trad .message {
		width: 65%;
		text-align: left;
		margin-right: 5%;
	}
	
	.call-to-action.trad .action {
		float: right;
		width: 30%;
	}
	
	/********************************************************* client logos (about page) max-width 980px adjustments */
	.clientlogos .slides li {
		margin: 0 1px 0 0;
		position: relative;
		width: 175px!important;
		float: left;
	}
	
} /*end max-width 980px*/



/********** TABLET ADJUSTMENTS /////// this theme begins tablet sizing at 850px due to the body padding ****/

@media only screen and (max-width: 850px) {

	body {
		padding: 0 35px 0 0;
	}
	#page {
		margin-top: 10px;
	}
	
	body.fixed {
		padding-top: 0;
	}
	
	#site_wrapper {
		width: 100%;
	}
	
/************************************************* header preheader menu_wrapper in header mobile */

	.no-js .header * {
		position: relative!important;
		top: auto!important;
		clear: both;
	}
	
	.header {
		height: auto;
		min-width: 240px;
		padding: 0;
		clear: both;
		margin: 0;
	}
	
	.preheader {
		height: 40px;
		padding: 0;
		position: relative;
		top: auto;
		right: 0;
		width: 100%;
	}
	
	.menu_wrapper {
		position: static;
		background: transparent;
		width: 100%;
		max-width: auto;
		height: auto;
	}
	
	.menu_wrapper.fixed {
		position: static;
	}


/************************************************* logo mobile */

	#logo,
	#logo img {
		height: 70px;
		width: 120px;
	}
	
	#logo {
		position: relative;
		top: 0;
		padding: 0;
		clear: both;
		background-image: url(../images/logo-mobile.png);
		/*120px X 50px*/
	}
	
	.no-js #logo {
		position: relative;
		top: auto;
		left: 0;
		clear: both;
	}
	
	#logo em {
		position: absolute;
		display: block;
		top: -1000px;
		left: 100px;
		width: 1px;
		height: 1px;
		overflow: hidden;
	}

/************************************************* tagline mobile */
	.header .tagline {
		position: relative;
		top: 0;
		left: 0;
		float: 0;
		margin: 0;
		padding: 10px 3%;
		line-height: normal;
		height: auto;
		font-size: 100%;
		font-weight: 400;
		color: #fff;
		background: #000;
		display: block;
		width: 94%;
	}
		
/************************************************* preheader user navigation mobile  */
	.preheader .user {
		position: absolute;
		width: auto;
		max-width: auto;
		top: 0;
		right: 40px;
		/*space of the search icon box*/
	}
	
	.preheader .user span {
		display: none;
	}
	
	/*the text inside these links is hidden when the user is in mobile and tablet view*/
	.preheader .user li {
		border: none;
	}
	
	.preheader .user a {
		height: 40px;
		width: 40px;
		padding: 0;
	}
	
	.preheader .user .phone i {
		display: block;
	}
	
	.preheader a[href^=tel] {text-decoration: none;} /* looked weird in iPad on the icon for the phone */

	.preheader .user i:before {
		padding: 0;
		margin: 0;
	}
	
	.preheader .user i {
		display: block;
		width: 40px;
		line-height: 38px;
		text-align: center;
		padding: 0;
		font-size: 20px;
	}
	
/************************************************* search mobile */
	.search-wrapper {
		position: absolute;
		top: 0px;
		right: 12px;
		z-index: 200;
		height: 40px;
		background: #fff;
	}
	
	.no-js .search-wrapper {
		position: relative;
		right: auto;
		float: left;
	}
	
	.search {
		background: #fff;
		padding: 0;
		margin: 0;
		height: 40px;
		position: relative;
		top: -2px;
	}
	
	.js .search input {
		width: 150px;
		top: 5px;
		position: relative;
	}
	
	.no-js .search input {
		width: auto;
		top: 0;
		position: relative;
		margin: 5px;
		right: auto;
		left: 5px;
	}
	
	.search #search-trigger i:before {
		font-size: 20px;
		line-height: 40px;
		padding: 0;
		margin: 0;
		position: relative;
		top: 3px;
	}
	
/************************************************* social mobile */
	.preheader .social {
		margin: 0;
		width: 35px;
		position: absolute;
		right: -35px;
		left: auto;
		z-index: 1000;
		text-align: center;
	}
	
	.preheader .social li {
		float: left;
		clear: both;
		padding: 0;
		width: 25px;
		height: 25px;
		margin: 0 0 5px 0;
		text-align: center;
		list-style: none;
	}
	
	.preheader .social [class^="socicon"]:before,
	.preheader .social [class*=" socicon"]:before {
		font-size: 22px;
		display: inline-block;
		line-height: 25px;
		text-decoration: none!important;
		text-align: center;
		padding: 0;
		margin: 0;
		position: relative;
		left: 0;
	}
	
/************************************************* main navigation mobile */
	
	.mobile_nav {
		margin: 0;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		height: 40px;
		width: 40px;
		background: #ff6600;
		z-index: 1001;
	}
	
	.mobile_nav a span {
		display: block;
		width: 20px;
		height: 40px;
		padding: 0;
		position: absolute;
		left: 10px;
		top: 0px;
		background: url(../images/navtriggerbg.png) -20px 50% no-repeat;
	}
	
	.mobile_nav a.active span {
		background-position: -60px 50%;
	}
	
	.mobile_nav a {
		color: #fff;
		text-decoration: none;
		display: block;
		padding: 0 0 0 5px;
		height: 40px;
		width: 100%;
		border: 0px;
		line-height: 38px;
		position: relative;
		z-index: 2000;
	}
	
	.no-js .mobile_nav {
		display: none;
	}
	
	.js #main_menu {
		display: none;
	}
	
	#main_menu {
		display: block;
		position: absolute;
		z-index: 10;
		width: 100%;
		left: 0;
		top: 0;
	}
	
	.no-js #main_menu ul, .no-js #main_menu {
		position: relative;
		clear: both;
		top: auto;
		left: auto;
		height: auto;
	}
	
	#main_menu ul {
		margin: 0;
		background: #000;
		border-bottom:3px solid #fff;
	}
	
	#main_menu ul ul {
		height: auto;
		width: 100%;
		overflow: visible;
		border-bottom:0px;
	}
	
	#main_menu li {
		padding: 0;
	}
	
	#main_menu * {
		float: none!important;
	}
	
	#main_menu ul li a {
		height: auto!important;
		line-height: normal;
		margin: 0;
		border: 0px;
		font-size: 110%;
		padding: 10px 0 10px 20px;
	}
	
	#main_menu a:hover,
	#main_menu .active a,
	#main_menu a.selected {
		border: 0px;
		background: #ff6600;
	}
	
	#main_menu li ul a,
	#main_menu li ul li a,
	#main_menu li ul li ul li a {
		height: auto;
		width: auto;
		line-height: auto;
		background: #333;
		padding: 10px 0 10px 20px;
	}
	
	#main_menu li ul,
	#main_menu ul,
	#main_menu ul ul ul,
	#main_menu ul ul ul ul {
		position: relative!important;
		top: auto!important;
		left: 0!important;
		clear: both!important;
		right: auto!important;
		width: 100%!important;
	}
		
	#main_menu ul ul {
		display: none;
		border-bottom:none;
	}
	
	#main_menu li {
		margin: 0;
	}
	
	#main_menu li a {
		text-transform: uppercase;
	}
	
	#main_menu li li a {
		text-transform: none;
	}
	
	#main_menu ul ul li a {
		padding-left: 30px;
	}
	
	#main_menu ul ul li ul li a {
		padding-left: 50px;
	}
	
	#main_menu ul ul ul li:last-child {
		border: 0px;
	}
	
	#main_menu ul ul ul li {
		border-left: 0px solid #fff;
		border-right: 0px solid #fff;
	}
		
	/********************************************************* show inside page navigation on multi-column layouts  */

	.mobile-page-nav {
		margin: 0 10px 5px 0;
		display: block;
		clear: both;
	}
	
	.mobile-page-nav .btn {
		margin: 0 0 5px 5px;
		float: right;
	}

	/********************************************************* columns sidebars and widget tablet adjustments  */
	
	.row-fluid.reverse-order .span4,.row-fluid.reverse-order .span5 {
		float: none;
	}
	
	.row-fluid.reverse-order .span8,.row-fluid.reverse-order .span7 {
		margin-left: 0;
	}

	.contact-page textarea {
		height: 100px;
	}
		
	.widget {
		margin: 0 0 1.5% 0!important;
		background: url(../images/dottedbg.png) fixed;
		padding: 15px!important;
	}
	
	.widget ul.blogposts span.date {
		background: #fff;
	}
	
	.widget .short_headline span {
		background: url(../images/dottedbg.png) fixed;
	}
	
	.row-fluid.holy-grail .primary-column {
		float: none;
		margin-left: 0%;
		margin-right: 0%;
	}
	
	.row-fluid.holy-grail .secondary-column {
		float: none;
		margin-left: 0%;
		*margin-left: 0%;
	}
	
	.row-fluid.holy-grail .tertiary-column {
		float: none;
	}
	
	.sidebar-right,.contemporary-three-columns,.holy-grail,.sidebar-left {
		background-image: none;
	}
	
	.span3 .widget .sponsors li,
	.span4 .widget .sponsors li {
		width: auto;
		height: auto;
	}

	/********************************************************* short headline tablet adjustments  */

	.short_headline {
		margin: .5em 0 1em 0;
		padding-left: 10px;
		background: none;
	}
	
	.short_headline span {
		background: #fff;
		padding: 0;
	}
	
	/********************************************************* client logos (about page) tablet adjustments  */

	.clientlogos .slides li {
		margin: 0 1px 0 0;
		position: relative;
		width: 100px!important;
		float: left;
	}
	
	/********************************************************* hero-unit tablet adjustments */
	
	.hero-unit {
		margin: 0 0 2% 0;
	}
	
	.hero-unit h1,
	.hero-unit h2,
	.hero-unit.split h1,
	.hero-unit.split h2 {
		font-size: 140%;
	}
	
	.hero-unit.split h1,
	.hero-unit.split h2 {
		padding-right: 0;
		padding-bottom: 10px;
		border: 0px;
	}
	
	.hero-unit.split .content {
		width: 100%;
		float: none;
		margin-left: 0%;
		padding-top:10px;
	}
	
	.hero-unit.split .headline {
		width: 100%;
		text-align: left;
		float: none;
		padding-bottom: 5px;
		border-bottom: 1px dotted #000;
	}
	
	.hero-unit.split .content h3 {
		font-size: 110%;
		margin-bottom: 0;
		margin-top: 10px;
	}
	
	.hero-unit p:last-child {
		margin-bottom: 2%;
	}

	/********************************************************* page-header tablet adjustments */

	.page-header {
		margin: 0 0 15px 0;
	}
	
	.page-header h1 small {
		padding: 0;
		margin: 0;
		border-left: 0px;
	}

	/********************************************************* login page tablet adjustments */

	.login-box {
		width: 100%;
	}
	
	.login-box .pull-left, 
	.login-box .pull-right {
		width: 100%;
		padding: 3% 0;
		float: none;
	}
	
	.login-box .login-wrapper {
		background-image: none;
	}
			
	/********************************************************* call-to-action tablet adjustments */

	.call-to-action.trad .message {
		float: none;
		width: 100%;
		text-align: center;
		margin-right: 0%;
	}
	
	.call-to-action.trad .message p:last-child {
		margin-bottom: 2%;
	}
	
	.call-to-action.trad .action {
		float: none;
		width: 100%;
		text-align: center;
		padding-top: 0;
	}

} 
/*end max-width 850px*/


@media only screen and (max-width: 768px) {

	.clientlogos .slides li { /* client logo slider on about page */
		margin: 0 1px 0 0;
		position: relative;
		width: 170px!important;
		float: left;
	}
} 
/*end max-width 768px*/


@media only screen and (max-width: 600px) {

	body {
		font-size: 1.3rem;
		line-height: 1.5;
	}
	
	#main-content.container {
		padding-bottom:0;
	}
	
	/********************************************************* image adjustments max-width 600px  */

	img.alignright, img.alignleft {
		width: 100%;
		float: none;
	}
	
	.call-to-action img.alignleft, 
	.call-to-action img.alignright,
	.hero-unit img.alignleft, 
	.hero-unit img.alignright,
	.well img.alignleft, 
	.well img.alignright {
		width: auto;
		max-width: 100%;
	}
	
	
	/********************************************************* forms on this site mobile adjustments max-width 600px  */

	.forgot-password .input-append input[type="text"], 
	.forgot-password input[type="email"] {
		width: 50%;
	}
	
	label.checkbox.inline, label.radio.inline, .form-inline label {
		width: 100%!important;
		clear: both;
		margin: 0!important;
		display: block;
	}
	
	#registration-form-extended select, #registration-form select {
		margin-bottom: 5px;
	}
	
	form span.info {
		clear: both;
		display: block;
	}

	/********************************************************* hero-unit adjustments max-width 600px  */

	.hero-unit {
		margin: 0 0 3% 0;
	}
	
	.hero-unit h1,
	.hero-unit h2 {
		font-size: 120%;
		line-height: 1.4;
	}
	
	.hero-unit .btn-large, 
	.hero-unit.split .btn-large {
		font-size: 120%;
		padding-top: 5px;
		padding-bottom: 5px;
		background-position: 0 -11px!important;
	}
	
	.hero-unit.split h1,
	.hero-unit.split h2 {
		font-size: 110%;
		padding-right: 0;
		padding-bottom: 0;
		border: 0px;
		line-height: 1.4;
	}
	
	.hero-unit.split .content {
		width: 100%;
		float: none;
		margin-left: 0%;
	}
	
	.hero-unit.split .headline {
		width: 100%;
		text-align: left;
		float: none;
		padding-bottom: 5px;
		border-bottom: 1px dotted #000;
	}
	
	.hero-unit p {
		font-size: 90%;
	}
	
	.hero-unit.split .content h3 {
		font-size: 90%;
		margin-bottom: 0;
		margin-top: 10px;
	}

	/********************************************************* page-header adjustments max-width 600px  */

	.page-header h1 {
		padding: 10px;
	}
	
	.page-header {
		border-width: 5px;
	}
		
	.call-to-action h3 {
		font-size: 150%;
	}
	
	.call-to-action p {
		font-size: 100%;
	}
	
} 
/*end max-width 600px*/


/*************************** RETINA swapping (see mobile specific below) */
/*** new http://css-tricks.com/snippets/css/retina-display-media-query/*************/

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (   -moz-min-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
	
	
	#logo {
		background-image: url(../images/retina/logo_@2x.png);
		-moz-background-size: 240px 100px;
		/*w & h of total ORIGINAL 72dpi image*/
		-ie-background-size: 240px 100px;
		-o-background-size: 240px 100px;
		-webkit-background-size: 240px 100px;
		background-size: 240px 100px;
	}
	
	.menu_wrapper.fixed #main_menu {
		background-image: url(../images/retina/logo-small-fixed-header_@2x.png);
		-moz-background-size: 96px 40px;
		/*w & h of total ORIGINAL 72dpi image*/
		-ie-background-size: 96px 40px;
		-o-background-size: 96px 40px;
		-webkit-background-size: 96px 40px;
		background-size: 96px 40px;
	}
	
	#main_menu li.parent i {
		background-image: url(../images/retina/menu_arrow_@2x.png);
		-moz-background-size: 20px 5px;
		/*w & h of total ORIGINAL 72dpi image*/
		-ie-background-size: 20px 5px;
		-o-background-size: 20px 5px;
		-webkit-background-size: 20px 5px;
		background-size: 20px 5px;
	}	
	
	.short_headline {
		background-image: url(../images/retina/diagstripe_@2x.png);
		-moz-background-size: 8px 8px;
		-ie-background-size: 8px 8px;
		-o-background-size: 8px 8px;
		-webkit-background-size: 8px 8px;
		background-size: 8px 8px;
	}
	
	hr, figcaption, .image-slider.flexslider .caption {
		background-image: url(../images/retina/hr_@2x.png);
		-moz-background-size: 3px 3px;
		-ie-background-size: 3px 3px;
		-o-background-size: 3px 3px;
		-webkit-background-size: 3px 3px;
		background-size: 3px 3px;
	}
	
	blockquote {
		background-image: url(../images/retina/open-quote_@2x.png);
		-moz-background-size: 38px 38px;
		-ie-background-size: 38px 38px;
		-o-background-size: 38px 38px;
		-webkit-background-size: 38px 38px;
		background-size: 38px 38px;
	}
	
	span.plus {
		background-image: url(../images/retina/plus_@2x.png);
		-moz-background-size: 50px 50px;
		-ie-background-size: 50px 50px;
		-o-background-size: 50px 50px;
		-webkit-background-size: 50px 50px;
		background-size: 50px 50px;
	}
	
	.testimonial-gallery li.highlight blockquote {
		background-image: url(../images/retina/open-quote-white_@2x.png);
		-moz-background-size: 38px 38px;
		-ie-background-size: 38px 38px;
		-o-background-size: 38px 38px;
		-webkit-background-size: 38px 38px;
		background-size: 38px 38px;
	}
	
	.backToTop a {
		background-image: url(../images/retina/top_@2x.png);
		-moz-background-size: 50px 50px;
		-ie-background-size: 50px 50px;
		-o-background-size: 50px 50px;
		-webkit-background-size: 50px 50px;
		background-size: 50px 50px;
	}
	
	.flex-direction-nav a, .clientlogos .flex-direction-nav a {
		background-image: url(../images/retina/sliderarrows_@2x.png);
		-moz-background-size: 360px 100px;
		-ie-background-size: 360px 100px;
		-o-background-size: 360px 100px;
		-webkit-background-size: 360px 100px;
		background-size: 360px 100px;
	}
	
	.hero-unit,.page-header,.well,.testimonial-gallery li,.call-to-action {
		background-image: url(../images/retina/dottedbg_@2x.png);
		-moz-background-size: 2px 2px;
		-ie-background-size: 2px 2px;
		-o-background-size: 2px 2px;
		-webkit-background-size: 2px 2px;
		background-size: 2px 2px;
	}
	
	.testimonial-gallery li.highlight, .call-to-action.inverse {
		background-image: url(../images/retina/dottedbg-dark_@2x.png);
		-moz-background-size: 2px 2px;
		-ie-background-size: 2px 2px;
		-o-background-size: 2px 2px;
		-webkit-background-size: 2px 2px;
		background-size: 2px 2px;
	}
	
} 
/*end retina general*/


/************************************************* mobile specific retina swapping specific */

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (max-width: 850px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (max-width: 850px),
only screen and (   -moz-min-device-pixel-ratio: 2)      and (max-width: 850px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (max-width: 850px),
only screen and (        min-device-pixel-ratio: 2)      and (max-width: 850px),
only screen and (                min-resolution: 192dpi) and (max-width: 850px),
only screen and (                min-resolution: 2dppx)  and (max-width: 850px) { 


	.mobile_nav a span {
		background-image: url(../images/retina/navtriggerbg_@2x.png);
		-moz-background-size: 80px 40px;
		/*w & h of total sprite 72dpi image*/
		-ie-background-size: 80px 40px;
		-o-background-size: 80px 40px;
		-webkit-background-size: 80px 40px;
		background-size: 80px 40px;
	}
	
	#logo {
		background-image: url(../images/logo.png);
		/* the desktop mobile size is twice the size of the mobile so I'm using that as the retina*/
		-moz-background-size: 120px 50px;
		/*w & h of total ORIGINAL 72dpi image*/
		-ie-background-size: 120px 50px;
		-o-background-size: 120px 50px;
		-webkit-background-size: 120px 50px;
		background-size: 120px 50px;
	}

	.widget, .widget .short_headline span {
		background-image: url(../images/retina/dottedbg_@2x.png);
		-moz-background-size: 2px 2px;
		-ie-background-size: 2px 2px;
		-o-background-size: 2px 2px;
		-webkit-background-size: 2px 2px;
		background-size: 2px 2px;
	}
	
} 
/* end retina mobile */


/************************************************* basic print media styles */

@media print {

* { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */; box-shadow: none !important; text-shadow: none !important; }
body,
html,
.preheadr,
.header,
.container,
.row-fluid,
.row,
.page-header,
.page-header h1 { padding: 0!important; max-width: none!important; }
.short_headline { border-color: #ccc!important }
.print { display: block }
.tweetslide-wrapper,
.addthis_toolbox,
.search,
#footer,
#main_menu,
#main_menu ul,
.visuallyhidden,
.video-wrapper,
.sidebar,
.zoom-image,
.sort,
#carousel,
.related,
.widget,
.call-to-action-footer,
.post-pagination,
.pagination,
.flex-control-nav,
.flex-direction-nav,
.user,
.header .search { display: none!important }
/*turn on print for printers*/
.print.logo { margin: 0 auto; max-height: 80px; position: relative!important; float: none!important; }
.hero-unit * { width: 100%!important; border-width: 0px!important; text-align: center; }
.hero-unit h1,
.hero-unit h2 { font-size: 140%!important }
.hero-unit p { font-size: 90%!important }
.well { padding: 0 }
#main-content { position: relative!important; height: auto!important; margin: 0!important; }
.header { height: 130px!important; position: relative; overflow: hidden; width: 100%!important; }
.page-header,
.hero-unit { padding: 0!important; margin: 0!important; max-width: none!important; }
.header .tagline { line-height: normal!important; float: none!important; text-align: center!important; width: 100%!important; padding: 0!important; position: relative!important; margin: 0 0 0 -220px!important; }
iframe { display: none }
ul { margin: 0 }
.span7,
.span5,
.span4,
.span6,
.span8,
.span9,
.span3,
.span9,
.row-fluid.holy-grail .primary-column.span6,
.row-fluid,
.featured_items { clear: both; width: 100%!important; margin: 0 auto!important; padding: 0!important; float: none!important; left: 0!important; top: auto!important; }
.container { clear: both; width: 100%!important; padding: 0; max-width: 100%; }
blockquote,
blockquote p { padding-left: 0!important }
.lemmon-slider { display: none }
.flexslider li:first-child { display: block!important }
.flexslider li img { max-width: 600px!important }
.hero-unit { margin: 0; padding: 0; }
/* masonry isotope doesn't have print support */
.gallery,
#filter,
.pagination,
[class^="icon-"]:before,
[class*=" icon-"]:before,
.socicon,
#comment_form_wrapper,
#contact-form,
.date_share,
.pager,
.pagination { display: none!important }
.blog-detail .article,
.blog-summary .article { float: none; width: 100%; }
.header { width: 100%; display: block; }
a,
a:visited { text-decoration: underline }
a[href]:after { content: " (" attr(href) ")" }
#logo a[href]:after { display: none!important }
abbr[title]:after { content: " (" attr(title) ")" }
pre,
blockquote { border: 1px solid #ccc; page-break-inside: avoid; padding: 10px; }
thead { display: table-header-group; /* h5bp.com/t */ }
tr,
img { page-break-inside: avoid }
img { max-width: 100% !important }

}
/*end print*/