@font-face {
  font-family: "Alright Sans 825589181"; /* Bold */
  src: url("http://typefront.com/fonts/825589181.eot");
  src: local("?"),
       url("http://typefront.com/fonts/825589181.woff") format("woff"),
       url("http://typefront.com/fonts/825589181.ttf") format("truetype"),
       url("http://typefront.com/fonts/825589181.otf") format("opentype"),
       url("http://typefront.com/fonts/825589181.svg") format("svg");
  font-weight: bold;
  font-style: normal;
}
.font-825589181 {
  font-family: "Alright Sans 825589181";
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Alright Sans 825589180"; /* Regular */
  src: url("http://typefront.com/fonts/825589180.eot");
  src: local("?"),
       url("http://typefront.com/fonts/825589180.woff") format("woff"),
       url("http://typefront.com/fonts/825589180.ttf") format("truetype"),
       url("http://typefront.com/fonts/825589180.otf") format("opentype"),
       url("http://typefront.com/fonts/825589180.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
.font-825589180 {
  font-family: "Alright Sans 825589180";
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Alright Sans 825589179"; /* Medium */
  src: url("http://typefront.com/fonts/825589179.eot");
  src: local("?"),
       url("http://typefront.com/fonts/825589179.woff") format("woff"),
       url("http://typefront.com/fonts/825589179.ttf") format("truetype"),
       url("http://typefront.com/fonts/825589179.otf") format("opentype"),
       url("http://typefront.com/fonts/825589179.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
.font-825589179 {
  font-family: "Alright Sans 825589179";
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Alright Sans 825589822"; /* Regular Italic */
  src: url("http://typefront.com/fonts/825589822.eot");
  src: local("?"),
       url("http://typefront.com/fonts/825589822.woff") format("woff"),
       url("http://typefront.com/fonts/825589822.ttf") format("truetype"),
       url("http://typefront.com/fonts/825589822.svg") format("svg");
  font-weight: normal;
  font-style: italic;
}
.font-825589179 {
  font-family: "Alright Sans 825589822";
  font-weight: normal;
  font-style: italic;
}


body {
	background: #f6f6f6;
	min-width:980px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 20px;
	color: #666;
}
p {
	font-size: 13px;
	line-height: 20px;
}
a {
	text-decoration:none;
	color: #5d174d;
}
a:hover {

}
input, textarea, select {
	font:100% arial,sans-serif;
	vertical-align:middle;
}
.line {
	width: 95%;
	height: 5px;
	display: block;
	border-bottom: solid 1px #ddd;
	margin-bottom: 10px;
}
.clr {
	clear: both;
	height: 1px;
	margin: 0;
	padding: 0;
}

#wrapper {
	width:100%;
	position:relative;
	background: #fff;
	padding: 0 0 25px 0;
}

strong, b {
	font-weight: bold;
}
/* ---------------------------------------------------------------------------- */
/* LISTS */
/* ---------------------------------------------------------------------------- */
.main-box .services-box ul, .portfolio-holder ul {
	padding:0;
	margin:0;
	list-style:none;
}
.portfolio-holder .col1 ul li {
	padding:0 0 0 13px;
	overflow:hidden;
	margin: 0;
	background: url(../images/bulletpt.png) no-repeat 0 11px;
	display: block;
}
#content ul {
	padding-bottom: 11px;
}
#content ul li {
	padding:0 0 0 13px;
	margin:0;
	background: url(../images/bulletpt.png) no-repeat 0 5px;
}
#content ol {
	margin-left: 18px;
}
#content ol li {
	list-style: decimal;
	padding: 0;
	margin: 0;
}


/* ---------------------------------------------------------------------------- */
/* BUTTONS */
/* ---------------------------------------------------------------------------- */
.btn-request-a-quote, .btn-view-more {
	background: url(../images/btn-request-a-quote.png) no-repeat;
	width: 165px;
	height: 45px;
	display: block;
	text-indent: -99999px;
	font-size: .01em;
}
.btn-request-a-quote:hover, .btn-view-more:hover {
	background-position: 0 -45px;
	border-bottom: none;
}
.btn-view-more {
	background: url(../images/btn-view-more.png) no-repeat;
	width: 123px;
}

/* ---------------------------------------------------------------------------- */
/* HEADLINES */
/* ---------------------------------------------------------------------------- */
#content .title h1 {
	font-size:30px;
	font-weight:bold;
	color:#fff;
	margin:0;
}
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
	color:#0a2948;
	margin: 0;
	padding-bottom: 8px;
	font-family: "Alright Sans 825589181";
    font-weight: bold;
    font-style: normal;
	text-transform: uppercase;
}
#content h1 {
	font-size: 24px;
}
#content h2 {
	font-size: 20px;
}
#content h3 {
	font-size: 18px;
}
#content h4 {
	font-size: 16px;
}
#content h5 {
	font-size: 14px;
}
#content h6 {
	font-size: 10px;
}

/* ---------------------------------------------------------------------------- */
/* SIDE ITEMS */
/* ---------------------------------------------------------------------------- */
#content #sub-nav {
	padding-bottom: 15px;
	border-bottom: solid 1px #ddd;
	margin-bottom: 20px;
}
#content #sub-nav li {
	list-style: none;
	background: none;
	margin: 0;
	padding: 0 0 2px 0;
}
#content #sub-nav li.active a {
	color:#be279a;

}
#content #sub-nav li.active a:hover {
	text-decoration: none;
}
/* ---------------------------------------------------------------------------- */
/* HEADER */
/* ---------------------------------------------------------------------------- */
.logo {
	float:left;
	background: url(../images/kas-design-logo.png) no-repeat;
	width:149px;
	height:59px;
	text-indent:-9999px;
	margin: 14px 0 0 20px;
}
.logo a {
	display:block;
	width:100%;
	height:100%;
	overflow:hidden;
}
.logo a:hover {
	border-bottom: none;
}
#header {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height: 89px;
	display: block;
	z-index:100;
	overflow: hidden;
}
.header {
	width:980px;
	height:89px;
	display: block;
	margin:0 auto;
	position:relative;
	z-index:100;
	overflow: hidden;
}

#header .phone {
	position: absolute;
	top: 0;
	right: 0px;
	width: 105px;
	height: 65px;
	display: block;
}

#header .phone span {
	color: #fff;
	font-size: 13px;
	font-family: "Alright Sans 825589179";
	display: block;
	margin-top: 34px;
    font-weight: bold;
    font-style: normal;
	text-transform: uppercase;
	text-align: right;
}

#header .navigation {
	position: absolute;
	top: 0px;
	right: 105px;
	height: 65px;
	display: block;
	overflow: hidden;
}
#nav {
	padding:0;
	margin:0;
	list-style:none;
	display:table;
	height: 65px;
	overflow: hidden;
}
#nav li {
	float:left;
	height: 65px;
	margin: 0 5px;
	display: block;
}
#nav li a {
    height: 30px;
    padding: 35px 0 0;
    text-align: center;
    margin: 0 1px;
	font-size: 11px;
	color: #FFF;
	display: block;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;
    text-transform: uppercase;
}
#nav li a:hover {
	text-decoration: none;
	color: #fff;
}
#nav li#nav-services { width: 74px;	}
#nav-services a:hover, li#nav-services.here a {
	background: url(../images/nav-hover.png) no-repeat;
}
#nav-approach a { width: 81px; }
#nav-approach a:hover, li#nav-approach.here a {
	background: url(../images/nav-hover.png) -75px 0 no-repeat; 
}
#nav #nav-work a { width: 55px; }
#nav #nav-work a:hover, li#nav-work.here a {
	background: url(../images/nav-hover.png) -157px 0 no-repeat;
}
#nav li#nav-us { width: 33px; }
#nav-us a:hover, li#nav-us.here a {
	background: url(../images/nav-hover.png) -212px 0 no-repeat;
}
#nav li#nav-news { width: 52px; }
#nav-news a:hover, li#nav-news.here a {
	background: url(../images/nav-hover.png)-246px 0 no-repeat;
}
#nav li#nav-notebook { width: 82px; }
#nav-notebook a:hover, li#nav-notebook.here a {
	background: url(../images/nav-hover.png) -299px 0 no-repeat;	
}
#nav li#nav-contact { width: 72px; }
#nav-contact a:hover, li#nav-contact.here a {
	background: url(../images/nav-hover.png) -382px 0 no-repeat;
}

/* ---------------------------------------------------------------------------- */
/* MAIN AREA */
/* ---------------------------------------------------------------------------- */

#main {
	width:980px;
	overflow:hidden;
	position:relative;
	z-index:10;
	padding: 0;
	margin: 0 auto;
	line-height: 20px;
	clear: both;
}
/* ---------------------------------------------------------------------------- */
/* TITLE BAR / BIG HEADLINE */
/* ---------------------------------------------------------------------------- */
#title-bar {
	position: relative;
	width: 100%;
	height: 269px;
	padding: 0;
	margin: 0 auto 5px;
	z-index: 10;
	background: url(../images/bg-titlebar.png) repeat-x;
}
.title-bar {
	color: #fff;
	width: 960px;
	padding: 0 10px;
	height: 269px;
	display: block;
	position: relative;
	margin: 0 auto;
}
.title-bar.approach {
	background: url(../images/pagetitles/approach.jpg) no-repeat;	
}
.title-bar.our-clients {
	background: url(../images/pagetitles/clients.jpg) no-repeat;	
}
.title-bar.recognition {
	background: url(../images/pagetitles/awards.jpg) no-repeat;	
}
.title-bar.us {
	background: url(../images/pagetitles/us.jpg) no-repeat;	
}
.title-bar.contact {
	background: url(../images/pagetitles/contact.jpg) no-repeat;	
}
.title-bar.news {
	background: url(../images/pagetitles/news.jpg) no-repeat;	
}
.title-bar.notebook {
	background: url(../images/pagetitles/notebook.jpg) no-repeat;	
}
.title-bar.work {
	background: url(../images/pagetitles/work.jpg) no-repeat;	
}
.title-bar.nj-logo-design {
	background: url(../images/pagetitles/identity.jpg) no-repeat;	
}
.title-bar.nj-ecommerce {
	background: url(../images/pagetitles/ecommerce.jpg) no-repeat;	
}
.title-bar.search-engine-marketing {
	background: url(../images/pagetitles/seo.jpg) no-repeat;	
}
.title-bar.nj-web-design {
	background: url(../images/pagetitles/web-design.jpg) no-repeat;	
}
.title-bar.content-management, .title-bar.cms {
	background: url(../images/pagetitles/cms.jpg) no-repeat;	
}
.title-bar.email-marketing {
	background: url(../images/pagetitles/email-marketing.jpg) no-repeat;	
}
.title-bar.web-hosting {
	background: url(../images/pagetitles/hosting.jpg) no-repeat;	
}
.title-bar.services {
	background: url(../images/pagetitles/services.jpg) no-repeat;
}
.title-bar.web-site-analytics {
	background: url(../images/pagetitles/web-analytics.jpg) no-repeat;
}
#title-bar h2 {
	font-size: 15px;
	color: #b93ca4;
	position: absolute;
	top: 114px;
	left: 15px;
	text-transform: uppercase;
	font-family: "Alright Sans 825589181";
    font-weight: normal;
    font-style: normal;
}
.big-headline {
	position: absolute;
	top: 146px;
	left: 15px;
	width: 945px;
}

.big-headline h3, #content .related-work h3 {
	font-size: 33px;
	color: #999;
	line-height: 40px;
	font-family: "Alright Sans 825589822";
    font-weight: normal;
    font-style: italic;
}
.big-headline h3 {
	color: #e7d1e2;	
}
.big-headline h3 span {
	color: #fff;
	font-family: "Alright Sans 825589822";
    font-weight: bold;
    font-style: italic;
}
.big-headline p, .big-headline a {
	color: 	#fff;
}


/* ---------------------------------------------------------------------------- */
/* INSIDE PAGES */
/* ---------------------------------------------------------------------------- */
#content {
	padding: 15px 0 25px 0;
}
#content p {
	padding-bottom: 11px;
}
#content b {
	font-weight: bold;
}
#content .left-side {
	float: left;
	display: block;
	width: 590px;
	padding: 15px 50px 0 15px;
	padding-bottom: 0px;
}
#content .right-side {
	float: right;
	display: block;
	width: 300px;
	padding-top: 15px;
	padding-bottom: 30px;
}
#content .right-side:after {
	content: "";
	display: block;
	clear: both;
}
#content .left-side.contact {
	float: right;
	display: block;
	width: 595px;
	padding-left: 20px;
	padding-top: 15px;
	margin-bottom: 90px;
}
#content .right-side.contact {
	float: left;
	display: block;
	width: 275px;
	padding-top: 15px;
	padding-left: 15px;
}
#content .left-side.notebook {
	float: left;
	display: block;
	width: 675px;
	padding-right: 20px;
	padding-top: 7px;
	border-right: solid 1px #ddd;
}
#content .right-side.notebook {
	float: right;
	display: block;
	width: 238px;
	padding-top: 15px;
	padding-left: 15px;
}
/* ---------------------------------------------------------------------------- */
/* APPROACH */
/* ---------------------------------------------------------------------------- */

#content .coda-nav {
	float: left;
	border-bottom: solid 1px #ccc;
	width: 100%;
	margin-bottom: 15px;
}
#content .coda-nav li {
	float: left;
	list-style: none;
	background-image: none;
	width: auto;
	padding: 0 26px 10px 0;
}
#content .slider-nav li.last {
	padding-right: 0;
}
#content .coda-nav li a {
	color: #999;
	font-size: 14px;
	padding-bottom: 12px;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;
}
#content .coda-nav li a:hover, #content .coda-nav li a.current {
	text-decoration: none;
	border-bottom: solid 1px #862c73;
	color: ##862c73;;
}

noscript div { background: #ccc; border: 1px solid #900; margin: 20px 0; padding: 15px }
.coda-slider-wrapper { 
	width: 980px;
	min-height: 275px;
	display: block;
	position: relative;
	padding-bottom: 40px;
	border-bottom: solid 1px #ccc;
	margin-bottom: 10px;
}

.coda-slider-no-js .coda-slider { 
	overflow: auto !important; 
}

.coda-slider, .coda-slider .panel { 
	width: 910px;
	display: block;
} 

.coda-nav-left a { 
	position: absolute;
	top: 180px;
	left: 0;
	height: 38px;
	width: 38px;
	display: block;
	background: url(../images/arrow-left.png) no-repeat;
	text-indent: -999999px;
	color: #fff;
	font-size: 0.01em;
	z-index: 999;
}
.coda-nav-right a {
	position: absolute;
	top: 180px;
	left: 910px;
	height: 38px;
	width: 38px;
	display: block;
	background: url(../images/arrow-right.png) no-repeat;
	text-indent: -999999px;
	color: #fff;
	font-size: 0.01em;
	z-index: 999;
}
.coda-nav-right a:hover, .coda-nav-left a:hover {
	background-position: 0 -38px;
	border-bottom: none;
}

.panel-wrapper {
	padding: 20px;
}

.coda-slider p.loading { padding: 20px; text-align: center }

.coda-slider-wrapper { clear: both; overflow: auto }
.coda-slider { float: left; overflow: hidden; position: relative }
.coda-slider .panel { display: block; float: left }
.coda-slider .panel-container { position: relative }
.coda-nav-left a, .coda-nav-right a { 
	text-align: center; 
	text-decoration: none 
}
#content .process-img {
	float: left;
	width: 349px;
	padding-right: 31px;
	padding-left: 40px;
	z-index: 1;
}
#content .process-info {
	float: left;
	width: 450px;
}
#content .process-info ul li {
	float: left;
	width: 45%;
}
#content .left-side.approach {
	width: 570px;
}
#content .right-side.approach {
	margin-top: 15px;
	padding-top: 0;
	padding-left: 50px;
	border-left: solid 1px #ccc;
	width: 265px;
}

/* ---------------------------------------------------------------------------- */
/* ABOUT */
/* ---------------------------------------------------------------------------- */

.about-services-list {
	clear: both;
	padding-bottom: 11px;
}
.about-services-list li {
	margin-top: 0;
	padding-top: 0;
	float: left;
	width: 30%;
}
.quote {
	float: right;
	padding: 0 0 20px 25px;
}
.work-collage {
	float: right;
	padding: 0 0 20px 25px;
}
.clipboard {
	float: right;
	padding: 0 20px 10px 12px;
}
.why-us {
	padding-bottom: 15px;
	border-bottom: solid 1px #ccc;
	margin-bottom: 20px;
}
#main .why-us li {
	list-style: none;
	background: url(../images/checkbox.png) no-repeat;
	padding-left: 28px;
	padding-bottom: 8px;
	background-position: 0 1px;
}
/* ---------------------------------------------------------------------------- */
/* CLIENTS */
/* ---------------------------------------------------------------------------- */

#content ul#nav-sub {
	padding-bottom: 15px;
	border-bottom: solid 1px #ccc;
	margin-bottom: 20px;
}
#content ul#nav-sub li {
	background-image: none;
	font-size: 13px;
	padding: 2px 0;
	margin: 0;
}
#content ul#nav-sub li a {
	color: #999;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;
}
#content ul#nav-sub li a:hover, #content ul#nav-sub li.active a {
	color: #862c73;
}
#main .client-logos li {
	background: none;
	width: 145px;
	height: 120px;
	display: block;
	border-right: solid 1px #ddd;
	border-bottom: solid 1px #ddd;
	margin: 0;
	padding: 0;
	text-align: center;
	float: left;
}
#main .client-logos.hp li {
	width: 100px;
	height: 70px;
	border: none;
	margin: 0 20px 13px 0;
	padding: 0;
}
#main .client-logos.hp li img {
	padding-top: 7px;
}
#main .client-logos.hp li.four {
	margin-right: 0;
}
#main .client-logos li.four {
	border-right: none;
}
#main .client-logos li img {
	margin: auto;
	padding-top: 28px;
}
#main .client-list {
	margin-top: 15px;
}
#main .client-list li {
	float: left;
	width: 178px;
	padding-right: 15px;
}
#main .client-list li.three {
	padding-right: 0px;
}
/* ---------------------------------------------------------------------------- */
/* NOTEBOOK */
/* ---------------------------------------------------------------------------- */
#content .notebook-list {
	padding-bottom: 25px;
	clear: both;
	display: block;
}
#content .notebook-list li {
	list-style: none;
	background: none;
	margin: 0 0 20px 0;
	padding: 0;
	border-bottom: solid 1px #ccc;
}
.date {
	float: left;
	width: 38px;
	border-right: solid 1px #ccc;
	padding: 0;
}
.notebook-title {
	float: left;
	padding-left: 12px;
}
#content .date h5, .date h5 {
	color:#862c73;
	font-size: 14px;
	padding: 0;
	text-transform: uppercase;
}
#content .date h4, .date h4 {
	color:#862c73;
	font-size: 20px;
	padding: 0;
	margin-top: -6px;
}
#content .date h6, .date h6 {
	color:#999;
	font-size: 12px;
	padding: 0;
	margin-top: -4px;
}
.big-headline .date h5, .big-headline .date h4, .big-headline .date h6 {
	color: 	#e7d1e2;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;
}
.big-headline .date {
	margin-right: 10px;	
}

#content .notebook-title h3 {
	padding-bottom: 0;
}
#content .notebook-content {
	clear: both;
	display: block;
	margin-top: 10px;
}
#content .notebook-image {
	padding-bottom: 10px;
}
.notebook-list .read-more {
	float: left;
	padding-bottom: 10px;
}
.notebook-list .comments-link {
	float: right;
	padding-bottom: 10px;
}
#content .right-side.notebook ul li {
	padding-bottom: 0;
	margin: 0;
}
.comments {
	margin-top: 35px;
	padding: 25px 0 15px;
	border-top: solid 1px #ddd;
}
#content ul.comment-list li {
	padding: 17px 0 6px 65px;
	margin: 0;
	background: #fff url(../images/comment-quote.png) no-repeat;
	background-position: 15px 17px;
	border-top: solid 1px #ddd;
	line-height: 20px;
}
#content ul.comment-list li.alt {
	background: #f5f5f5 url(../images/comment-quote.png) no-repeat;
	background-position: 15px 17px;
}
#content .comment-form {
	margin: 25px 0;
	background: #f5f5f5;
	padding: 15px;
	border: solid 1px #ddd;
	width: 590px;
	display: block;
}
#content .comment-form .req {
	color: #5d174d;
	font-weight: bold;
}
#content .comment-form .checkbox_txt {
	padding: 10px 0 0 5px;
	margin-top: 10px;
}
.success {
	background: #f5f5f5;
	padding: 15px 15px 8px 15px;
	border: solid 1px #ddd;
	border-bottom: 0;
}
.comment-form .col_full {
	width: 100%;
}
#content .success h6 {
	font-size: 15px;
}
/* ---------------------------------------------------------------------------- */
/* NEWS*/
/* ---------------------------------------------------------------------------- */

#content .news-list li {
	margin: 0 25px 15px 0;
	padding: 0;
	background: none;
	list-style: none;
	float: left;
	width: 206px;
	height: 310px;
	border-bottom: solid 1px #ccc;
}
#content .news-list li.third {
	margin-right: 0;
}
#content .news-image a {
	width: 205px;
	height: 125px;
	display: block;
	margin-bottom: 6px;
	border: solid 1px #ccc;
	padding: 0;
}
#content .news-image a:hover {
	border: solid 1px #666;
}

#content .news-title {
	float: left;
	padding-left: 5px;
	width: 158px;
}
#content .news-title h3 {
	margin-top: 5px;
	margin-left: 5px;
	font-size: 13px;
	line-height: 13px;
}
#content .news-list  a {
	color: #666;
}
#content .news-list h3 a {
	color:#0a2948;
}
#content .news-list #nav_categories li {
	margin: 0;
	padding: 0;
	height: auto;
	border-bottom: none;
	width: auto;
}
#content .news-date {
	text-transform: uppercase;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 8px;
}
.pagination {
	float: none;
	display: block;
	clear: both;
	width: 100%;
}
#content ul.pagination li {
	margin: 0 8px 0 0;
	padding: 3px 12px;
	background: none;
	list-style: none;
	float: left;
	border: solid 1px #dfdede;
	background: url(../images/pagination-btn-back.gif) repeat-x;
	height: 20px;
	font-size: 10px;
	
}
#content ul.pagination li.here {
	background: #fff;
}

/* ---------------------------------------------------------------------------- */
/* SERVICES */
/* ---------------------------------------------------------------------------- */
#content .services-list {
	margin: 10px 0;
}
#content .services-list li {
	background: none;
	float: left;
	width: 300px;
	height: 200px;
	display: block;
	padding: 0 0 20px 0;
	border-bottom: solid 1px #ddd;
	margin: 0 25px 10px 0;
	position: relative;
}
#content .services-list li.three {
	margin-right: 0;
}
#content .services-list .thumb {
	width: 300px;
	height: 94px;
	border: solid 1px #ccc;
	padding: 0;
}
#content .services-list .info {
	width: 300px;
	padding: 10px 15px 0 0;
}
#content .services-list .info p {
	padding: 0;
	margin: 0;
}
#content .services-list .info h4 {
	padding: 5px 0 5px 0;
	margin: 0;
}
.addedinfo {
	border-top: solid 1px #ddd;
	padding: 15px 0 10px 25px;
}
.addedinfo h1 {
	font-size: 13px;
	color: #999999;
	font-family: "Alright Sans 825589181";
    font-weight: bold;
    font-style: normal;
}
.addedinfo a {
	color: #666;
	text-decoration: none;	
}
.addedinfo a:hover {
	text-decoration: underline;
}
#content .services-list h4 a {
	color: #0a2948;
}
.services-viewmore {
	background: url(../images/services-hover.png) no-repeat;
	width: 300px;
	height: 95px;
	display: block;
	position: absolute;
	top: 0;
	left: 1px;
}
.services-viewmore a {
	display: block;
	width: 300px;
	height: 95px;	
}
/* ---------------------------------------------------------------------------- */
/* WORK */
/* ---------------------------------------------------------------------------- */

/* FEATURED ------------------------------------------------------------------- */
#featured-work {
	display: block;
	border-bottom: solid 1px #ccc;
	height: 280px;
	width: 980px;
	margin-bottom: 30px;
	margin-top: -15px;
}
#featured-work .featured-txt {
	float: left;
	width: 465px;
	padding-top: 45px;
	padding-left: 15px;
}
#content #featured-work h2 {
	color: #862c73;
	font-size: 24px;
}
#featured-work .featured-txt p {
	font-size: 17px;
	line-height: 21px;
}
#featured-work .featured-txt a {
	margin-top: 15px;
}

/* WORK CAT NAV ------------------------------------------------------------------ */
#work-cat-nav {
	display: block;
	width: 100%;
	clear: both;
	border-bottom: solid 1px #ddd;	
	margin-bottom: 20px;
}
#work-cat-nav:after {
	content: "";
	display: block;
	clear: both;
}
#work-cat-nav li {
	float: left;
	list-style: none;
	border-right: solid 1px #ddd;
	display: block;
	padding: 0 15px;
}
#work-cat-nav li a {
	color: #999;
	font-size: 12px;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;	
}
#work-cat-nav li a:hover {
	color: #333;
}
/* DETAILS PAGE CAT NAV ------------------------------------------------------- */
#work-detail-cat-nav {
	position: absolute;
	top: 234px;
	right: 0;
	padding: 8px 15px 0;
	background:url(../images/bg-workdetails-topnav.png) no-repeat;
	width: 85px;
	height: 23px;
}
#work-detail-cat-nav li {
	float: left;
	list-style: none;
	border-right: solid 1px #b93ca4;
	display: block;
	padding: 0 0;	
}
#work-detail-cat-nav li a, #work-detail-cat-nav li {
	color: #fff;
	font-size: 12px;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;	
}
#work-detail-cat-nav li.no-border {
	border-right: none;	
}
#work-detail-cat-nav li a:hover {
	text-decoration: underline;	
}
/* CATEGORY SQUARES ----------------------------------------------------------- */
.caetgory-squares {
	display: block;
	float: left;	
}
.category-squares div, #work-cat-nav div {
	height: 7px;
	width: 7px;	
	display: block;
	float: left;
	margin-right: 5px;
	margin-top: 9px;
}
#work-cat-nav div {
	margin-top: 6px;	
}
.cat24 { /* Identity */
	background: #f26411;	
}
.cat25 { /* E-Commerce */
	background: #257701;	
}
.cat16 { /* Web Design */ 
	background: #024588;	
}
.cat27 { /* CMS */
	background: #703487;	
}
.cat23 { /* Print */
	background: #257701;	
}
/* WORK GRID & SERVICES/RELATED WORK GRID ------------------------------------------------------------------ */
#content #work-grid, #content services-grid {
	margin: 0;
	padding: 0;
}
#content #work-grid li, #content #services-grid li {	
	height: 205px; /* 145px; */ 
	width:  300px; /* 226px; */	
	float:left;
	padding:0;
	margin: 0 39px 0 0;
	position:relative;
	background: none;
	list-style: none;
}
#content #services-grid li {
	margin-right: 16px;
	width: 180px;
	height: 130px;	
}
#content #work-grid li.three, #services-grid li.three {
	margin-right: 0;
}
#content #work-grid li.one, #services-grid li.one {
	padding-left: 0;	
}
#work-grid li .project, #services-grid li .project {
	height: 167px; /* 124px; */
	width: 300px; /* 224px; */			
	overflow:hidden;	
	position:relative;
	z-index: 2;
	padding: 0px;
	border: solid 1px #ddd;
}
#services-grid li .project {
	height:110px;
	width:180px;			
}
.project img {
	height: 167px; /* 124px; */
	width: 300px; /* 224px; */
}
#services-grid .project img {
	width: 300px; /* 180px; */
	height: 167px; /* 110px; */	
}
#work-grid .project .info_container, #services-grid .project .info_container {	
	width: 300px; /* 224px; */
	height: 167px; /* 124px; */		
	top:0;	
	z-index:9999;
	position:relative;	
}
#services-grid .project .info_container {	
	width: 300px; /* 180px; */
	height: 167px; /* 110px; */		
}
#work-grid .project div.info, #services-grid .project div.info {
	position:relative;	
	width: 264px; /* 208px; */
	top: -194px; /* -134px; */
	z-index:100;
	height: 107px; /* 108px; */
	color:#FFF;
	padding: 40px 17px 20px; /* 8px 8px; */
	line-height: 16px;
}
#services-grid .project div.info {
	position:relative;	
	width:164px;
	top:-120px;
	z-index:100;
	height:108px;
}
#content #work-grid h5, #content #services-grid h5 {
	margin: 10px 3px 5px 3px;
	padding: 0;
	font-size: 16px;
	color: #fff;
	font-family: "Alright Sans 825589181";
  	font-weight: hold;
  	font-style: normal;
}
#content #services-grid h5 {
	font-size: 13px;
}
#work-grid p, #services-grid p { 
	margin: 0 3px 0 3px;
	padding: 3px;
	font-size: 14px;
	line-height: normal;
	font-family: "Alright Sans 825589180";
	color: #fff;
}
#services-grid p { 
	font-size: 12px;
}
#content #work-grid .btn-view {
	display: block;
	margin-top: 10px;
	background: url(../images/btn-work-view.png) no-repeat;
	width: 57px;
	height: 16px;
	text-indent: -999999px;
	font-size: 0.01em;
}
#content #work-grid h6, #content #services-grid h6 {
	color: #999;
	font-size: 11px;
	margin-top: 5px;
	margin-bottom: 8px;
	font-family: "Alright Sans 825589179";
    font-weight: normal;
    font-style: normal;
	float: left;
}
#content #services-grid h6 {
	font-size: 10px;
	line-height: normal;
	margin-top: 6px;	
}
#work-grid .project div.info_bg, #services-grid .project div.info_bg {	
	position:relative;	
	background: url(../images/work-thumb-hover.png) no-repeat;
	width: 300px; /* 224px; */	
	z-index:50;
	top: -340px; /* -254px; */
	height: 167px;		
}
 #services-grid .project div.info_bg {	
	position:relative;	
	background: url(../images/thumb-hover.png) no-repeat;
	width:180px;	
	z-index:50;
	top:-244px;
	height:110px;		
}
#content .related-work .rws-title h3 {
	font-size: 16px;
	color: #999;
	line-height: 40px;
	font-family: "Alright Sans 825589822";
    font-weight: normal;
    font-style: italic;
	padding: 0;
	margin: 0;
	height: auto; 
}

/* WORK DETAILS ------------------------------------------------------------------ */
#work-header {
	height: 40px;
	width: 100%;
	border-bottom: solid 1px #ccc;
	margin-bottom: 30px;
}
#content #work-header h3 {
	font-size: 28px;
	color: #999;
	font-family: "Alright Sans 825589180";
    font-weight: normal;
    font-style: normal;
}
#work-container {
	width: 100%;
}
#work-container .work-details {
	float: right;
	width: 210px;
	padding-right: 9px;
	padding-top: 15px;
}
#content ul.alist b {
     line-height: normal;
     height: auto;
     font-size: 12px;
     padding: 0;
     margin: 0;
}
#content ul.alist .award_description {
     font-size: 10px;
     line-height: auto;
     padding: 0;
     margin: 0;
}
#work-container .work-images {
	float: left;
	display: block;
	width: 730px;
	height: 525px;
	position: relative;
}
.work-img {
	width: 717px;
	height: 494px;
	display: block;
	margin: 0 auto;
	padding: 0;
	position: relative;
	color: #fff;
	z-index: 1 !important;
	/* border: solid 1px #ccc; */
}
/* You might want to change these options for the main container */
#work-slider, #work-slider li {
	width: 719px;
	height: 496px;
}
#work-slider {
	/* background: url(../images/bg-work-btm-shadow.jpg) bottom center no-repeat; */
	width: 730px;
	height: 494px;
}
/* images container - This is the most important container - Don't change important properties */
#work-slider {
	list-style: none !important;
	float: left;
	margin: 0 !important;
	padding: 0 0 15px 0 !important;
	overflow: hidden !important;
	position: relative !important;
}
/* each slider item - Nothing to change here */
#work-slider li {
	display: none;
	float: left;
	margin: 0;
	position: absolute;
	width: 100%;
}
#content #work-slider li {
	list-style: none !important;
	background: none;
	margin: 0;
	padding: 0;
}
/* Don't edit this part */
#work-slider li.current {
	display: block;
	z-index: 2 !important;
}
/* Don't edit this part */
#work-slider li.next {
	display: block;
	z-index: 1 !important;
}
/* Don't edit this part - prevents inline lists from being hidden */
#work-slider li ul li {
	display: block !important;
	position: relative !important;
}
/*  Left Arrow */
/* Sets position and main configs */
.work-slider_arrow_left {
	bottom: 10px;
	cursor: pointer !important;
	float: left;
	height: 22px;
	left: 10px;
	position: absolute;
	width: 22px;
	z-index: 5;
}
/* left arrow image */
.work-slider_arrow_left {
	background: url(../images/left_arrow.png) no-repeat top left;
}
/* Right Arrow */
/* Sets position and main configs */
.work-slider_arrow_right {
	bottom: 10px;
	cursor: pointer;
	float: left;
	height: 22px;
	left: 37px;
	position: absolute;
	width: 22px;
	z-index: 5;
}
/* Right arrow Background */
.work-slider_arrow_right {
	background: url(../images/right_arrow.png) no-repeat top left;
}

/* SELECTORS */
/* Sets configs for selectors containers : absolute positioned in relation to #slider */
.work-slider_selector, .work-slider_selector_dis {
	list-style: none;
	margin: 0;
	position: absolute;
	bottom: 7px;
	right: 8px; 
	z-index: 5;
}
/* Sets image of selectors */
#content .work-slider_selector li, #content .work-slider_selector_dis li {
	display: block !important;
	background: url(../images/work-slider_selector.png) no-repeat top left;
	cursor: pointer;
	float: left;
	margin: 0 3px !important;
	height: 10px !important;
	position: relative !important;
	width: 10px !important;
	padding: 0 !important;
}
/* Sets the current selector */
#content .work-slider_selector li.current, #content .work-slider_selector_dis li.current {
	background: url(../images/work-slider_selector_current.png) no-repeat top left;
}
/* Disables the selectors */
.work-slider_selector_dis li {
	cursor: default !important;
	z-index: 5;
}
.work-slider-nav {
	z-index: 15;
}
/* Related Work */

.related-work {
	float: none;
	display: block;
	clear: both;
	width: 100%;
	border-top: solid 1px #ddd;
	padding: 15px 0;
}
#content .related-work h5 {
	font-size: 28px;
	color: #999;
	padding-top: 30px;
}

/* Work Header Links */
.work-header-links {
	position: absolute;
	top: 10px;
	right: 5px;
}
#content .work-header-links .return-li {
	padding-top: 6px;
}
#content .work-header-links .return {
	font-size: 12px;	
	color: #999;
	
	padding: 8px 12px;
	border-right: solid 1px #ddd;
	margin: 0 4px 0 0;
}
#content .work-header-links .return:hover {
	color:#0a2948;
}
#content .work-header-links li {
	background: none;
	padding: 0 0 0 8px;
	margin: 0;
	float: left;
	height: 38px;
	display: block;
}
#content .work-header-links li .previous, #content .work-header-links li .next  {
	height: 27px;
	width: 27px;
	display: block;
	text-indent: -999999px;
	font-size: 0.01em;
	color: #fff;
	margin-top: 5px;
}
#content .work-header-links li .previous {
	background: url(../images/arrow-left-sm.png) no-repeat;
}
#content .work-header-links li .next {
	background: url(../images/arrow-right-sm.png) no-repeat;
}
#content .work-header-links li .next:hover, #content .work-header-links li .previous:hover  {
	background-position: 0 -27px;
}

#content .related-work h3 {
	font-size: 25px;
	padding: 38px 20px 0 0;
}
#content .related-work-title {
	align: left;
	text-align: left;	
}
#content .related-work-title h3 {
	padding-left: 32px;	
	line-height: 25px;
}
/* ---------------------------------------------------------------------------- */
/* RECOGNITION */
/* ---------------------------------------------------------------------------- */

#content .awards_list {
	padding-bottom: 20px;
	float: none;
}

#content .awards_list li {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
	width: 186px;
	margin-right: 10px;
	height: 150px;
	display: block;
}
.award-icon {
	float: left;
	width: 40px;
}
.award-info {
	float: right;
	width: 141px;
	font-size: 12px;
	line-height: 16px;
	margin-left: 5px;
}
#content .award-info h6 {
	padding-bottom: 8px;
	font-size: 14px;
	line-height: 14px;
}


/* ---------------------------------------------------------------------------- */
/* FOOTER */
/* ---------------------------------------------------------------------------- */
#footer {
	width:100%;
	min-height: 275px;
	border-top: solid 1px #ddd;
	background: #f6f6f6;
}
.footer {
	width:935px;
	padding:25px 15px 18px 30px;
	margin:0 auto;
	overflow:hidden;
	background: #f6f6f6 url(../images/bg-footer.png) top center no-repeat;
	color: #666;
	position: relative;
	font-size: 12px;
}
.footer h5 {
	font-size: 12px;
}	
.footer h5 a {
	color:#0a2948;
}
.footer h3 {
	font-size:15px;
	
	color:#0a2948;
	margin:0;
}
.copyright a {
	color: #aaa;
}
.footer div {
	float: left;
	padding-right: 60px;
}
.footer h6 {
	font-size: 13px;
	margin-bottom: 8px;
	font-family: "Alright Sans 825589181";
    font-weight: bold;
    font-style: normal;
}
.ft-about {
	width: 105px; /* 115px; */
}
#footer .ft-services {
	width: 225px; /* 155px; */
	display: block;
	padding-right: 30px;
}
.ft-resources {
	width: 115px; /* 135px; */
}
.ft-getstarted {
	width: 155px;
}
.footer .ft-notebook {
	width: 340px;
	padding-right: 0;
}
.footer a {
	color: #666;
}
.footer li {
	line-height: 23px;
}
.footer .notebook-listings {
	margin: 15px 0;
}
.footer .notebook-listings li {
	float: left;
	display: block;
	width: 280px;
	padding-right: 30px;
	padding-bottom: 15px;
}	
.footer .notebook-listings li.last {
	padding-right: 0;
}
.footer-btm {
	width: 950px;
	padding:25px 0 18px 30px;
	display: block;
	margin:0 auto;
}
.social-media li {
	float: left;
	margin-right: 7px;
	display: block;
	width: 28px;
	height: 28px;
	overflow: hidden;
}
.social-media li a {
	text-indent: -99999px;
	width: 28px;
	height: 27px;
	display: block;
	background: url(../images/social-icons.png) no-repeat;
}
.social-media .facebook a {background-position: 0 0;}
.social-media .facebook a:hover {background-position: 0 -29px;}

.social-media .twitter a {background-position: -28px 0;}
.social-media .twitter a:hover {background-position: -28px -29px;}

.social-media .rss a {background-position: -56px 0;}
.social-media .rss a:hover {background-position: -56px -29px;}

.social-media .linkedin a {background-position: -85px 0;}
.social-media .linkedin a:hover {background-position: -85px -29px;}

.social-media .behance a {background-position: -115px 0;}
.social-media .behance a:hover {background-position: -115px -29px;}

.social-media .flickr a {background-position: -144px 0;}
.social-media .flickr a:hover {background-position: -144px -29px;}

.social-media .dribble a {background-position: -172px 0;}
.social-media .dribble a:hover {background-position: -172px -29px;}

.social-media .googleplus a {background-position: -200px 0;}
.social-media .googleplus a:hover {background-position: -200px -29px;}

.copyright {
	width: 840px;
	display: block;
	float: left;
}
.copyright p {
	color: #aaa;
	font-size: 12px;
	margin-top: 10px;
	padding-bottom: 25px;
	line-height: 19px;
}
.copyright p b {
	color: #666;
	font-weight: normal;
}
.bbb {
	width: 110px;
	display: block;
	float: right;
	padding-top: 8px;
}
.bbb .bbblogo {
	background: url(../images/bbb.jpg) no-repeat;
	text-indent: -99999px;
	font-size: .01em;
	width: 109px;
	height: 42px;
	display: block;
}
.subscriber {
	margin: 10px 0;
	clear: both;
	width: 320px;
}
.footer .subscriber .inputs {
	float: left;
	padding-right: 8px;
	margin-right: 8px;
	border-right: solid 1px #ccc;
	width: 220px;
}
.footer .subscriber .submit {
	float: left;
	width: 78px;
	padding: 0;
	margin: 0;
	border: none;
}
.subscriber:after {
	content: "";
	display: block;
	clear: both;
}
.subscriber input {
	background: url(../images/subscriber-input-field.png) no-repeat;
	width: 205px;
	height: 21px;
	padding: 5px;
	border: none;	
	float: left;
	margin-bottom: 6px;	
	color: #999;	
}
.subscriber input:focus {
	color: #333;
}
.subscriber .btn {
	background: url(../images/btn-add-me.png) no-repeat;
	width: 82px;
	height: 43px;
	display: block;
	text-indent: -999999px;
	overflow: hidden;
	font-size: 0.01em;
	color: #fff;
	float: left;
	margin-left: 3px;
	border: none;
}
.subscriber .btn:hover {
	background-position: 0 -43px;
}
p.small {
	font-size: 11px;
	line-height: normal;
}
.ft-notebook span {
	color: #000;
}

.footer ul li a:hover {
	color: #5d174d;
}
#footer h2.acc_trigger, .services-box h2.acc_trigger {
	padding: 0;	
	margin: 0;
	width: 225px;
	display: block;
	height: 23px;
	float: left;
	line-height: 23px;
}
.services-box h2.acc_trigger {
	width: 280px;
}
#footer h2.acc_trigger:hover, .services-box h2.acc_trigger:hover {
	background: url(../images/footer-diagonal.png) no-repeat;
}
.services-box h2.acc_trigger:hover {
	background: url(../images/hp-diagonal.png) no-repeat;
}
#footer h2.acc_trigger a, .services-box h2.acc_trigger a {
	display: block;
	padding: 0;
}
#footer h2.acc_trigger.active, .services-box h2.acc_trigger.active {
	background: url(../images/footer-arrow-up.png) no-repeat;
}
.services-box h2.acc_trigger.active {
	background: url(../images/hp-arrow-up.png) no-repeat;
}
#footer h2.acc_trigger.active a, .services-box h2.acc_trigger.active a {
	color: #5d174d;
	font-weight: bold;
	background: url(../images/footer-arrow-up.png) no-repeat;
}
.services-box h2.acc_trigger.active a {
	background: url(../images/hp-arrow-up.png) no-repeat;
}
#footer h2.acc_trigger a:hover, .services-box h2.acc_trigger a:hover {
	color: #5d174d;
}
#footer .acc_container, .services-box .acc_container {
	margin: 0 0 5px; 
	padding: 0;
	overflow: hidden;
	font-size: 13px;
	width: 225px;
	clear: both;
}
.services-box .acc_container {
	width: 280px;
}
#footer .acc_container .block, .services-box .acc_container .block {
	width: 100%;
	border-bottom: solid 1px #ddd;
	float: left;
}
#footer .acc_container .block p, .services-box .acc_container .block p {
	padding: 8px 0;
	font-size: 12px;
	margin: 0;
}
.services-box .acc_container .block p.link {
	padding: 0 0 8px 0;
}
#footer .acc_container .block p a, .services-box .acc_container .block p a  {
	font-weight: bold;
	color: #5d174d;
}
#footer .acc_container h3, .services-box .acc_container h3 {
	margin: 0 0 10px;
	padding: 0 0 5px 0;
	border-bottom: 1px dashed #ccc;
}
#footer .acc_container img, .services-box .acc_container img {
	float: left;
	display: block;
	width: 41px;
	padding: 10px 15px 10px 0;
}
.services-box .acc_container .service_summary {
	float: left;
	width: 200px;
	display: block;
}
.footnotes {
	font-size: 11px;
	color: #999;
}	
#content .footnotes a {
	color: #999;
}
#content .footnotes a:hover {
	text-decoration: underline;
}





/* ---------------------------------------------------------------------------- */
/* FAQ */
/* ---------------------------------------------------------------------------- */

.question{
cursor: pointer;
font-weight: bold;
margin: 5px 0 0;
padding: 5px;
border: solid 1px #ddd;
background: url(../images/plus-box.png) no-repeat;
background-position: right 4px;
}
.open{ 
color: #862c73;
background: url(../images/minus-box.png) no-repeat;
background-position: right 4px;
}
.closed{ 
color: #999;
}


/* ---------------------------------------------------------------------------- */
/* PAYMENTS PAGE */
/* ---------------------------------------------------------------------------- */

.quote_container {
	width: 836px;
	margin: 30px auto 0;
	padding:  10px;
	padding-bottom: 14px;
 	background: #fff url(../images/quote-box_btm.jpg) bottom center no-repeat;
}
.quote_box {
	padding:  10px;
	width: 816px;
	border: solid 1px #ddd;
}
#quote-inner {
	background: #f8f8f8;
	min-height: 300px;
	padding: 25px;
}

#fc_tb_closeWindowButtonBot {
	height: 12px !important;;
	width: 304px !important;;
	padding: 0  !important;;
	margin: 8px 0 0 !important;;
	display: block !important;;
	text-indent: -99999px !important;;
	color: #fff !important;;
	font-size: .01em !important;;
	float: left !important;;
	background: url(https://projects.kasdesign.com/images/payments/return-to-payments.png) !important;
}

a#fc_tb_closeWindowButtonTop:hover, a#fc_tb_closeWindowButtonBot:hover {
	background-position: left -24px;
}