html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }

.sprites-sprite, .logo, .tooltip .arrow, section.nav-slides .previous, section.nav-slides .next, section.nav-slides .squares, .logo-footer, .social li a.facebook, .social li a.twitter, .social li a.linkedin, .made-in-ny { background: url('/css/img/sprites-s9af6a9bc63.png') no-repeat; }

@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400,300; src: local("Open Sans"), local("Open Sans"), url("http://fonts.googleapis.com/css?family=Open+Sans:400,300&subset=latin") format("woff"); }

/* color schemes
sprites-sprite(square-[category]) 27x26
sprites-sprite(square-[category]-sm) 16x15
about: #3366cc
other: #33cc33
services: #cc0033
work: #cc6600
site: #330066

page profile: 210x175
home thumb: 300x230
*/
/* generic */
html, body { background: #eeedef; }

a { text-decoration: none; }

.hidden { display: none; }

.non-touch-ui { cursor: pointer; }

/* header section */
header { text-align: left; position: relative; margin: 0 auto 20px; padding-left: 0; padding-right: 0; max-width: 1044px; min-width: 320px; height: 99px; overflow: hidden; border-bottom: 5px #c5c4c4 solid; }
@media only screen and (min-width: 0) and (max-width: 540px) { header { height: 198px; } }

.grid { position: absolute; }

.logo { position: absolute; top: 36px; left: 40px; display: block; width: 251px; height: 25px; background-position: 0 -164px; }
@media only screen and (min-width: 0) and (max-width: 540px) { .logo { left: 35px; float: left; } }

.nav-widget { position: absolute; display: block; right: 0; top: 0; width: 216px; height: 99px; z-index: 99; font-size: 100%; font-family: 'Open Sans', sans-serif; }
@media only screen and (min-width: 0) and (max-width: 540px) { .nav-widget { top: 99px; left: 36px; float: left; clear: left; } }

.tooltip { background-color: #fff; position: relative; height: 33px; pointer-events: none; }
.tooltip.hide { overflow: hidden; }
.tooltip .arrow { position: absolute; left: -8px; top: 10px; width: 8px; height: 13px; background-position: 0 -536px; }
.tooltip .tt-text { position: absolute; font-size: 90%; padding: 10px 5px; letter-spacing: 0; text-transform: uppercase; white-space: nowrap; }

.nav-widget > span { position: absolute; display: block; width: 36px; height: 33px; cursor: pointer; }
.nav-widget > span.r2c1 { top: 0; left: 36px; }
.nav-widget > span.r1c2 { top: 33px; left: 0; }
.nav-widget > span.r2c2 { top: 33px; left: 36px; }
.nav-widget > span.r2c3 { top: 33px; left: 72px; }
.nav-widget > span.r3c2 { top: 66px; left: 36px; }

/* header section */
/* thumbnails section */
section.thumbnails { margin: 0 auto; position: relative; padding: 0; width: 940px; }
@media only screen and (max-width: 940px) { section.thumbnails { width: auto; } }

section.thumbnails > *:first-child { margin-left: 0; }
@media only screen and (max-width: 940px) { section.thumbnails > *:first-child { margin: 0 0 16px 16px; } }
@media only screen and (max-width: 320px) { section.thumbnails > *:first-child { margin: 0 10px 10px; } }

.thumb { overflow: hidden; margin: 0 16px 16px 0; width: 300px; height: 278px; float: left; }
@media only screen and (max-width: 940px) { .thumb { margin: 0 0 16px 16px; } }
@media only screen and (max-width: 320px) { .thumb { margin: 0 10px 10px; } }

.thumb:nth-child(3n+3) { margin-right: 0; }
@media only screen and (max-width: 940px) { .thumb:nth-child(3n+3) { margin: 0 0 16px 16px; } }
@media only screen and (max-width: 320px) { .thumb:nth-child(3n+3) { margin: 0 10px 10px; } }

.thumb img { display: block; -webkit-transition: all 700ms ease; /* Fade to color for Chrome and Safari */ -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */ -webkit-backface-visibility: hidden; /* Fix for transition flickering */ -moz-filter: grayscale(100%); filter: grayscale(100%); filter: gray; /* IE6-9 */ /*filter: url(desaturate.svg#greyscale);

<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
	<filter id="greyscale">
	<feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0
	0.3333 0.3333 0.3333 0 0
	0.3333 0.3333 0.3333 0 0
	0 0 0 1 0" />
	</filter>
</svg>
*/ filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+ */ }
@media only screen and (max-width: 940px) { .thumb img { width: 300px; } }

.thumb img.reset { -webkit-filter: grayscale(0%); filter: none; -webkit-transition: all 700ms ease; /* Fade to color for Chrome and Safari */ }

.thumb div { -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; max-height: 100%; width: 300px; height: 48px; background-color: #666; color: #fff; text-align: center; font-family: 'Nunito400', sans-serif; line-height: 48px; max-width: 100%; }

.thumb .people { background-color: #ff6633; }

.thumb .work { background-color: #ff3333; }

.thumb .services { background-color: #009933; }

.thumb .about { background-color: #3366cc; }

.thumb .slides { width: 0; height: 0; }

div.solid { height: 280px; line-height: 280px; }

div.black-color { background-color: #000; }

/* end thumbnails section */
/*
	Top Section
*/
div.site-color { background-color: #330066; }

div.people-color { background-color: #ff6633; }

div.work-color { background-color: #ff3333; }

div.services-color { background-color: #009933; }

div.about-color { background-color: #3366cc; }

div.home-color { background-color: #666666; }

.divtheme-color { background-color: #452a70; }

div.about-square { left: 29px; }

.people-square { top: 28px; left: 58px; }

.work-square { top: 28px; }

.services-square { top: 56px; left: 29px; }

.squares { width: 85px; height: 82px; }
.squares div { position: absolute; width: 27px; height: 26px; }

ul.slidesjs-pagination { margin-top: 10px; padding: 0; width: 100%; list-style: none; text-align: center; }
ul.slidesjs-pagination li { position: relative; display: inline; margin-right: 10px; }
ul.slidesjs-pagination li:last-child { margin-right: 0px; }
ul.slidesjs-pagination li a { position: relative; display: inline-block; height: 16px; text-indent: -9999px; width: 16px; }

.invisible { display: none; margin: 0 auto; }

section.nav-slides { position: relative; margin: 25px auto; width: 180px; height: 82px; }
section.nav-slides .previous { background-position: 0 -336px; float: left; margin-top: 15px; margin-right: 15px; width: 32px; height: 53px; }
section.nav-slides .next { background-position: 0 -393px; float: left; margin-top: 15px; margin-left: 15px; width: 32px; height: 53px; }
section.nav-slides .squares { background-position: 0 -450px; position: relative; float: left; width: 85px; height: 82px; }
section.nav-slides .squares .icon { cursor: pointer; }

.foot-note { clear: both; width: 100%; font-size: 113%; line-height: normal; }

.slide span { display: block; margin-top: 4px; color: #452a70; text-transform: uppercase; font-size: 87.5%; }

.slide h2 { padding: 0; color: #e55303; text-transform: uppercase; font-weight: 400; font-size: 175%; }

.slide p { margin-top: 15px; width: 500px; color: #858585; text-align: justify; font-weight: 300; font-size: 106%; line-height: 200%; }
@media only screen and (min-width: 0) and (max-width: 500px) { .slide p { width: 100%; } }

.slides.slides-space { margin-bottom: 20px; }

.slides { overflow: hidden; margin: 0 auto; max-width: 964px; width: 964px; height: auto; border-bottom: 68px solid #452a70; background-color: #fff; font-family: 'Open Sans', sans-serif; position: relative; }
@media only screen and (min-width: 0) and (max-width: 964px) { .slides { width: 100%; } }
.slides .slide { position: absolute; overflow: hidden; padding: 40px; width: 884px; height: auto; }
@media only screen and (min-width: 0) and (max-width: 320px) { .slides .slide { padding: 10px; width: 300px; } }
.slides .first-column { position: relative; float: left; }
.slides .first-column img { display: block; margin-right: 20px; margin-bottom: 10px; width: 210px; height: 175px; border: 1px solid #eee; float: left; }
@media only screen and (min-width: 0) and (max-width: 540px) { .slides .first-column img { float: none; } }
.slides .second-column { position: relative; float: right; width: 347px; }
@media only screen and (min-width: 0) and (max-width: 964px) { .slides .second-column { float: left; margin-top: 20px; width: 100%; } }

.inner-slides { position: relative; max-width: 100%; width: 347px; height: auto; }
.inner-slides img { display: block; max-width: 100%; height: auto; border: 0; vertical-align: middle; -ms-interpolation-mode: bicubic; }
@media only screen and (min-width: 0) and (max-width: 680px) { .inner-slides img { margin: 20px 0 0; } }

/* end Top Section */
/* footer section */
footer { position: relative; clear: both; overflow: hidden; margin: 0 auto; min-width: 320px; max-width: 1044px; height: 220px; border-top: 5px solid #c5c4c4; background-color: #e1e1e1; font-size: 100%; font-family: 'Open Sans', sans-serif; }
@media only screen and (min-width: 321px) and (max-width: 680px) { footer { height: 285px; } }
@media only screen and (min-width: 0) and (max-width: 320px) { footer { height: 336px; } }
footer .container { overflow: hidden; height: 180px; }
@media only screen and (min-width: 321px) and (max-width: 680px) { footer .container { height: 240px; } }
@media only screen and (min-width: 0) and (max-width: 320px) { footer .container { height: 278px; } }

.logo-footer { background-position: 0 -193px; position: relative; display: block; float: left; margin-top: 30px; margin-left: 42px; width: 219px; height: 22px; }

.sub-menu { display: block; float: right; margin-top: 32px; }
@media only screen and (min-width: 0) and (max-width: 680px) { .sub-menu { display: none; } }
.sub-menu li { float: left; margin-right: 45px; }
.sub-menu li a { color: #452a70; text-transform: uppercase; }

.email { float: left; clear: left; margin-top: 14px; margin-left: 42px; font-size: 95%; }
.email a { color: #452a70; }

.phone { float: left; clear: left; margin-top: 14px; margin-left: 42px; color: #452a70; }

.social { float: left; clear: left; margin-top: 18px; margin-left: 39px; }
.social li { position: relative; display: inline; float: left; margin-right: 8px; }
.social li a { display: block; text-indent: -9999px; }
.social li a.facebook { background-position: 0 -297px; width: 35px; height: 35px; }
.social li a.twitter { background-position: 0 -219px; width: 36px; height: 35px; }
.social li a.linkedin { background-position: 0 -258px; width: 35px; height: 35px; }

.made-in-ny { background-position: 0 0; position: absolute; top: 73px; right: 5px; z-index: 99; display: block; float: right; float: right; clear: right; width: 161px; height: 160px; }
@media only screen and (min-width: 681px) and (max-width: 768px) { .made-in-ny { top: 50px; } }
@media only screen and (min-width: 321px) and (max-width: 680px) { .made-in-ny { top: 90px; } }
@media only screen and (min-width: 0) and (max-width: 320px) { .made-in-ny { top: 130px; } }

.copyright { position: relative; overflow: hidden; padding-top: 14px; width: 100%; height: 100%; background-color: #b8b7b7; color: #fffefe; text-align: center; text-transform: uppercase; letter-spacing: 1px; font-weight: 300; font-size: 10pt; font-family: 'Open Sans', sans-serif; line-height: normal; }

/* end footer section */
