@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }
div.clearer { clear:both; }
:focus { outline: 0; }
input[type="hidden"] {
        margin: 0 !important;
        padding: 0 !important;
        background-image:none !important;
        width:0px !important;
        height:0px !important;
}
html {font-size:100%;border-left:6px solid #fbf900;padding-top:0px;}
body    {background:#1b1c1d; color:#dce1e4;font-family: Georgia, 'Times New Roman', Times, serif; font-size:17px; background-attachment:fixed; }
h1      { margin-bottom:23px;margin-top:65px; z-index: 99;position:relative;
          width:111px;
          height:111px;
          display:block;
          float: left;
}
h1 a    { width:111px; height:111px; background:url(../img/kettle.gif) 0 0 no-repeat transparent; display: block; text-indent: -999em;text-align: left;}
h2      { font-family:'SquareSerifBold','courier new',serif;color:white; margin-bottom:30px;line-height:0.83em;font-size:62px;width:555px;margin-left:67px;}
h2 strong {font-family:'SquareSerifLight','courier new',serif;display:block;}
h3      { font-family:'SquareSerifDemi','courier new',serif; color:white; font-size:30px; text-transform:uppercase; }
h3 em {font-family: 'SquareSerifLight','courier new',serif;text-transform:none;text-transform:uppercase;}
#top h3 {color:black;}
p       { line-height:26px; letter-spacing:-.005em; font-size:18px;color:#7F8388; }
.form p {color:black;font-family: georgia,serif;}
p a     { font-style:italic;color:#FBF900;text-decoration:none; }
p a:hover     { }
#fade {
        background-color:#000000;
        filter:alpha(opacity=70);
        KHTMLOpacity:.7;
        MozOpacity:.7;
        opacity:.7;
        z-index:300;
        position:absolute;
        top:0px;
        left:0px;
        width:100%;
        height:100%;display:none;
}
.popup {position:absolute;top:100px;left:50%;margin-left:-250px;width:499px;background-color:white;z-index:400;display:none;padding:30px;}
.statusMessage {display:none;}
.close-pop {position:absolute;right:30px;top:30px;color:black;}

::-moz-selection{ background: #fffc00; color:black; text-shadow: none; }
::selection { background:#fffc00; color:black; text-shadow: none; }
a, a em { color:#fffc00;text-decoration:none;-moz-transition:background-color .2s;-webkit-transition:background-color .2s;transition:background-color .2s;}
a:hover {background-color:#FBF900;color:black;}
a:active {background-color:white;color:black;}
a:link { -webkit-tap-highlight-color: #FBF900; }
p em {font-style:italic;}

.header {/*background:transparent url(../img/header_bg.gif) repeat-x 0 0;*/width:auto;margin:0;padding:40px 0 0 70px;position:relative; background-color: #252525; overflow: hidden;
        -moz-box-shadow:0 4px 10px black;
        -webkit-box-shadow:0 4px 10px black;
        box-shadow:0 4px 10px black;
        height:920px;
}
.header p {width:540px;margin-right:6.125%;margin-left:67px;font-size:1.3em; line-height:1.2em;max-width:730px;margin-bottom:15px;color:#666666;}
/*.header .pager {
    position: absolute;
    z-index: 100;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}*/
.header .pager-btn,
.header .pager-btn:active{
        position:absolute;
        top:48%;
        right:0;
        background: transparent url(../img/hero-btn-right.png) no-repeat 0 0;
        height:51px;
        width:33px;
        -moz-transition:width .2s ease-out;
        -webkit-transition:width .2s ease-out;
        -o-transition:width .2s ease-out;
        transition:width .2s ease-out;
        margin:0;
        z-index: 90;
}
.header .pager-btn:hover {
        width:54px;
        background-position:0 0;
}
.header .prev,
.header .prev:active{
        right:auto;
        left:0;
        background: transparent url(../img/hero-btn-left.png) no-repeat 100% 0;
}
.header .prev:hover {
        background-position:100% 0;
}
.bottom-bar {
        position: fixed;
        bottom: 0px;
        left: 0;
        right: 0;
        background: rgb(0, 0, 0); /* The Fallback */
        background: rgba(0, 0, 0, 0.7);
        padding:10px 8% 0 60px;
        height:55px;
        z-index: 40;
}
.bottom-bar img {
        margin-right:20px;
        float:left;
}
.bottom-bar .view-study {
        color:#898989;
        font-size:14px;
        float:left;
        width:390px;
        margin-top:4px;
}
/*.bottom-bar .study-2 .view-study {
    margin-top:-2px;
}*/
#hero-carousel {
        position: absolute;
        left: 0;
        top: 40px;
        width:3000px;
        z-index: 1;
}
#hero-carousel h1 {
        position: absolute;
        left:63px;
        top: 65px;
        margin:0;
}
#hero-carousel .hero {
        float:left;
        position:relative;
        visibility: hidden;
}
#hero-carousel .hero.active {
        /*overflow: hidden;*/
}
.hero h2 {
        position:relative;
        margin-top:200px;
        z-index: 30;

        -webkit-transition: -webkit-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -moz-transition: -moz-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -o-transition: -o-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -ms-transition: -ms-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        transition: transform 1s cubic-bezier(0.25, 0, 0.25, 1);
}
.hero1 h2, .hero2 h2 {
        width:350px;
}
.hero h2 a {
        color:white;
}
.hero h2 a:hover {
        color:#FFFC00;
        background-color: transparent;
}
.hero h2 a:active,
.hero h2 a:focus {
        color:white;
        background-color: transparent;
}
.hero p {
        position:relative;
        z-index: 30;

        -webkit-transition: -webkit-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -moz-transition: -moz-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -o-transition: -o-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -ms-transition: -ms-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        transition: transform 1s cubic-bezier(0.25, 0, 0.25, 1);
}
.heroimg {
        position:relative;
        float:left;
        z-index: 1;

        -webkit-transition: -webkit-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -moz-transition: -moz-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -o-transition: -o-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -ms-transition: -ms-transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        transition: transform 1s cubic-bezier(0.25, 0, 0.25, 1);
        -webkit-backface-visibility: hidden;
}
.hero2 .heroimg, .hero1 .heroimg, .hero3 .heroimg {
        position:absolute;
        top:0;
        left:0;
}
.hero1 .heroimg1  {
        left: 150px;
        top: -30px;
}
.hero1 .heroimg1b  {
        left: 540px;
        top: 20px;
}
.hero2 .heroimg2 {
        top:-50px;
        left:190px;
}
.hero2 .heroimg2b {
        left: 1000px;
        top: 420px;
}
.hero2 .heroimg2c {
        left: 295px;
        top: 365px;
}
a.heroimg2c {
        background-color: transparent;
}
a.heroimg2c:hover img {
        background-color: transparent;
        position: relative;
        top: -1px;
}
a.heroimg2c:active img {
        background-color: transparent;
        position: relative;
        top: 1px;
}
.hero3 .heroimg3 {
        left: auto;
        right: 0;
        top: 0;
}
.hero3 .heroimg3 img {
        position: absolute;
        top: 0;
        right: 0;
}
.hero3 .heroimg3 .portrait-bg {
        display: none;
}
.hero3 .heroimg3 img.snowflake {
        top: -130px;
        right: -69px;
        -webkit-animation: rotateEl 180s infinite linear;
        -moz-animation: rotateEl 180s infinite linear;
        -o-animation: rotateEl 180s infinite linear;
        animation: rotateEl 180s infinite linear;
}
@-webkit-keyframes rotateEl {
        from {
        -webkit-transform: rotate(0deg);
}
to {
        -webkit-transform: rotate(-360deg);
}
}
@-moz-keyframes rotateEl {
        from {
        -moz-transform: rotate(0deg);
}
to {
        -moz-transform: rotate(-360deg);
}
}
@-o-keyframes rotateEl {
        from {
        -o-transform: rotate(0deg);
}
to {
        -o-transform: rotate(-360deg);
}
}
#snglow {
        background: -moz-radial-gradient(center, ellipse cover, rgba(62,62,62,0) 0%, rgba(62,62,62,0) 1%, rgba(62,62,62,0.9) 36%, rgba(62,62,62,0) 66%, rgba(62,62,62,0) 100%);
        background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(62,62,62,0)), color-stop(1%,rgba(62,62,62,0)), color-stop(36%,rgba(62,62,62,0.9)), color-stop(66%,rgba(62,62,62,0)), color-stop(100%,rgba(62,62,62,0)));
        background: -webkit-radial-gradient(center, ellipse cover, rgba(62,62,62,0) 0%,rgba(62,62,62,0) 1%,rgba(62,62,62,0.9) 36%,rgba(62,62,62,0) 66%,rgba(62,62,62,0) 100%);
        background: -o-radial-gradient(center, ellipse cover, rgba(62,62,62,0) 0%,rgba(62,62,62,0) 1%,rgba(62,62,62,0.9) 36%,rgba(62,62,62,0) 66%,rgba(62,62,62,0) 100%);
        background: -ms-radial-gradient(center, ellipse cover, rgba(62,62,62,0) 0%,rgba(62,62,62,0) 1%,rgba(62,62,62,0.9) 36%,rgba(62,62,62,0) 66%,rgba(62,62,62,0) 100%);
        background: radial-gradient(center, ellipse cover, rgba(62,62,62,0) 0%,rgba(62,62,62,0) 1%,rgba(62,62,62,0.9) 36%,rgba(62,62,62,0) 66%,rgba(62,62,62,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003e3e3e', endColorstr='#003e3e3e',GradientType=1 );
        width: 1200px;
        height: 1200px;
        position: absolute;
        top: -350px;
        right: -270px;
}
.hero3 .heroimg3 #snc {
        position: relative;
        -webkit-transition: -webkit-transform 5s cubic-bezier(0.230, 1.000, 0.320, 1.000);
        -moz-transition: -moz-transform 5s cubic-bezier(0.230, 1.000, 0.320, 1.000);
        -o-transition: -o-transform 5s cubic-bezier(0.230, 1.000, 0.320, 1.000);
        transition: transform 5s cubic-bezier(0.230, 1.000, 0.320, 1.000);
}
.hero3.fromleft .heroimg3 #snc,.hero3 .heroimg3 #snc {
        -webkit-transform: translate3d(1000px, -1500px, 0);
        -moz-transform: translate3d(1000px, -1500px, 0);
        -o-transform: translate(1000px, -1500px);
        -webkit-backface-visibility: hidden;
}
/*.hero3.fromright .heroimg3 #snc,.hero3.exit .heroimg3 #snc {
    -webkit-transform: translate3d(-1000px, 1500px, 0);
    -moz-transform: translate(-1000px, 1500px);
    -o-transform: translate(-1000px, 1500px);
    transform: translate(-1000px, 1500px);
}*/
.hero3.active .heroimg3 #snc {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -webkit-backface-visibility: hidden;
}
.hero3 .heroimg3a {
        left: auto;
        right: -230px;
        top: -230px;
}
.fromleft h2{
        -webkit-transform: translate3d(-100px, 0, 0);
        -moz-transform: translate(-100px, 0);
        -o-transform: translate(-100px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft p:nth-child(2){
        -webkit-transform: translate3d(-150px, 0, 0);
        -moz-transform: translate(-150px, 0);
        -o-transform: translate(-150px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft p:nth-child(3){
        -webkit-transform: translate3d(-200px, 0, 0);
        -moz-transform: translate(-200px, 0);
        -o-transform: translate(-200px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg {
        -webkit-transform: translate3d(-250px, 0, 0);
        -moz-transform: translate(-250px, 0);
        -o-transform: translate(-250px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg1b {
        -webkit-transform: translate3d(-400px, 0, 0);
        -moz-transform: translate(-400px, 0);
        -o-transform: translate(-400px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg2 {
        -webkit-transform: translate3d(-1000px, 0, 0);
        -moz-transform: translate(-1000px, 0);
        -o-transform: translate(-1000px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg2b {
        -webkit-transform: translate3d(-500px, 0, 0);
        -moz-transform: translate(-500px, 0);
        -o-transform: translate(-500px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg2c {
        -webkit-transform: translate3d(-1500px, 0, 0);
        -moz-transform: translate(-1500px, 0);
        -o-transform: translate(-1500px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg3 {
        -webkit-transform: translate3d(-350px, 0, 0);
        -moz-transform: translate(-350px, 0);
        -o-transform: translate(-350px, 0);
        -webkit-backface-visibility: hidden;
}
.fromleft .heroimg3 .snowflake {
        -webkit-transform: translate3d(-300px, 0, 0);
        -moz-transform: translate(-300px, 0);
        -o-transform: translate(-300px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright h2{
        -webkit-transform: translate3d(300px, 0, 0);
        -moz-transform: translate(300px, 0);
        -o-transform: translate(300px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright p:nth-child(2){
        -webkit-transform: translate3d(350px, 0, 0);
        -moz-transform: translate(350px, 0);
        -o-transform: translate(350px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright p:nth-child(3){
        -webkit-transform: translate3d(400px, 0, 0);
        -moz-transform: translate(400px, 0);
        -o-transform: translate(400px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg {
        -webkit-transform: translate3d(550px, 0, 0);
        -moz-transform: translate(550px, 0);
        -o-transform: translate(550px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg1b {
        -webkit-transform: translate3d(1000px, 0, 0);
        -moz-transform: translate(1000px, 0);
        -o-transform: translate(1000px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg2 {
        -webkit-transform: translate3d(1000px, 0, 0);
        -moz-transform: translate(1000px, 0);
        -o-transform: translate(1000px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg3 {
        -webkit-transform: translate3d(350px, 0, 0);
        -moz-transform: translate(350px, 0);
        -o-transform: translate(350px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg2b {
        -webkit-transform: translate3d(500px, 0, 0);
        -moz-transform: translate(500px, 0);
        -o-transform: translate(500px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg2c {
        -webkit-transform: translate3d(1500px, 0, 0);
        -moz-transform: translate(1500px, 0);
        -o-transform: translate(1500px, 0);
        -webkit-backface-visibility: hidden;
}
.fromright .heroimg3 .snowflake {
        -webkit-transform: translate3d(300px, 0, 0);
        -moz-transform: translate(300px, 0);
        -o-transform: translate(300px, 0);
        -webkit-backface-visibility: hidden;
}
.enter h2 {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -webkit-backface-visibility: hidden;
}
.enter p:nth-child(2) {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -webkit-backface-visibility: hidden;
}
.enter p:nth-child(3) {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -webkit-backface-visibility: hidden;
}
.enter .heroimg {
        -webkit-transform: translate3d(5px, 0, 0);
        -moz-transform: translate(5px, 0);
        -o-transform: translate(5px, 0);
        -webkit-backface-visibility: hidden;
}
.simple-nav-c {
        display: block;
        bottom: 80px;
        left: 50%;
        position: absolute;
        z-index: 25;
}
.simple-nav {
        margin-left: -50%;
}
.simple-nav li {
        float:left;
        position: relative;
        margin-right:4px;
        display: block;
}
.simple-nav li a {
        background:transparent url(../img/simple-nav.png) no-repeat 0 -14px;
        width:14px;
        height:14px;
        text-indent:-9999em;
        display:block;
}
.simple-nav li a:hover,
.simple-nav li.active a{
        background-position: 0 0;
}

.bottom-bar .view-study:hover,
.bottom-bar .view-study:focus,
.bottom-bar .view-study:active {
        background-color:transparent;
}
.bottom-bar .view-study:hover em {
        background-color:#FBF900;color:black;
}
.bottom-bar .view-study em {
        font-style: normal;
        color:white;
        font-family: 'SquareSerifBook','courier new',serif;
}
.bottom-bar .study {
        filter:alpha(opacity=0);
        KHTMLOpacity:0;
        MozOpacity:0;
        opacity:0;
        top:0;
        left:0;
        position: absolute;
        padding:10px 7% 0 60px;
}
.bottom-bar .study-0 {
        display:block;
}
/*#our-work {position:absolute;right:6.5%;bottom:55px;clear:both;width:81px;text-align:center;letter-spacing:.1em;font-family:'SquareSerifMedium','courier new',serif;font-size:21px;padding:53px 10px 103px;background:transparent url(../img/our_work.gif) no-repeat 0 100%;color:#89b4c2;height:50px;text-transform: uppercase;line-height:21px;}
#our-work:hover {color:#fffc00;background-position:0 0%;}*/
#our-work {
        color:#ffff00;
        text-align: right;
        padding-right:55px;
        background: transparent url(../img/our-work.png) no-repeat 70px 0;
        font-size: 18px;
        line-height: 18px;
        display: block;
        padding-top:4px;
        height: 41px;
        float: right;
        text-transform: uppercase;
        font-family: 'SquareSerifMedium','courier new',serif;
        width:60px;
}
#our-work:hover {
        background-position: 70px -45px;
}
#top {height:0;width:100%;overflow:hidden;position:fixed;top:40px;left:0;z-index:100;background-color:#efece5;-moz-box-shadow:0 0 30px black;-webkit-box-shadow:0 0 30px black;box-shadow:0 0 30px black;}
#our-work {bottom:-20px;}

.close-tab {position:absolute;right:7%;top:11px;background:#EFECE5 url(../img/icon_close.gif) no-repeat center center;width:20px;height:19px;text-indent:-9999em;display:block;padding:7px;-moz-transition:all .2s;-webkit-transition:all .2s;transition:all .2s;}
.close-tab:hover {background-color:#FBF900;}
.tab-container {width:91%;padding:0 9% 0 25px;height:40px;position:fixed;top:0;background:black ;z-index:110;left:0;line-height: 40px;}
.form .tab-container {width:88%;padding-left:70px;}
.hd {border-top:1px solid #35383B;border-bottom:1px solid #35383B;padding:7px 4px;margin-bottom:25px;height:42px;line-height:35px;}
#top .hd {border-top:1px solid #b4b1ac;border-bottom:1px solid #b4b1ac;margin-bottom:18px;}
#top .content, #top .form-content {/*margin-top:14px;border-top:1px solid #b4b1ac;padding-top:14px;*/}
.tab-div p, .tab-div a, .tab-div li,.tab-div h4 {color:#35383B6;}
.hd h3 {float:left;font-size:1.3em;line-height:42px;width:72%;color:#FBF900;position:relative;}
.hd .pager {float:right;width:28%;position:relative;}
.pager p {float:right;font-size:14px;line-height:42px;position:relative;}
.pager p em {font-size:12px;margin:0 5px;}
.pager a {float:right;margin-left:10px;position:relative;}
.pager-btn {background:transparent url(../img/icons_arrow.png) no-repeat 0 0;width:42px;height:42px;text-indent:-9999em;display:block;}
.pager-btn:hover,
.pager-btn:focus,
.pager-btn:active{
        background-color:transparent;
}
.prev:hover {background-position:0 -42px;}
.prev:active, .prev.pressed {background-position:0 -84px;}
.next {background-position:100% 0;}
.next:hover {background-position:100% -42px;}
.next:active, .next.pressed {background-position:100% -84px;}
.tab-div {width:88%;margin:0 auto 0 75px;;padding:43px 0;}
p.share {float:right;width:30%;text-transform:uppercase;color:#666;text-shadow:0 1px 2px black;font-size:13px;line-height:40px;text-align:right;position:relative;}
p.share span {float:right;font-family:'SquareSerifBook','courier new',serif;}
p.share a {float:right;margin-left:5px;margin-top:11px;line-height:1em;}
p.share a:hover {background-color:transparent;}
p.share a:active,
p.share a:focus {position:relative;top:1px;background-color:transparent}
.icon_in {background:transparent url(../img/icons_share.png) no-repeat -0px -164px;width:22px;height:23px;text-indent:-9999em;display:block;text-align:left;}
.icon_in:hover {background-position: 0 -205px;}
.icon_fb {background:transparent url(../img/icons_share.png) no-repeat 0 -82px;width:22px;height:23px;text-indent:-9999em;display:block;text-align:left;}
.icon_fb:hover {background-position: 0px -123px;}
.icon_tw {background:transparent url(../img/icons_share.png) no-repeat -0px 0px;width:22px;height:23px;text-indent:-9999em;display:block;text-align:left;}
.icon_tw:hover {background-position: 0px -41px;}
.tab {float:left;width:70%;}
.tab ul {}
.tab li {float:left;}
.tab li a {color:white;line-height:30px;text-transform:uppercase;font-family:'SquareSerifBook','courier new',serif;font-size:13px;line-height:40px;text-shadow:0 1px 2px black;display:block;padding:0 12px;

           -moz-transition:background-color,padding .3s;
           -webkit-transition:background-color,padding .3s;
           -o-transition:background-color,padding .3s;
           -ms-transition:background-color,padding .3s;
           transition:background-color,padding .3s;

           height:40px;
}
.tab li a:active,
.tab li a:focus {
        background-color: transparent;
}
/*.tab li a#top-link {background:transparent url(../img/icon_arrowup.png) no-repeat 0 0;width:35px;height:40px;text-indent:-9999em;display:block;padding:0;

        -moz-transition:background-color,background-position .3s;
        -webkit-transition:background-color,background-position .3s;
        -o-transition:background-color,background-position .3s;
        -ms-transition:background-color,background-position .3s;
        transition:background-color,background-position .3s;

        visibility: hidden;}*/
.tab li a#top-link {
        background: transparent url(../img/home.png) no-repeat 0 0;
        width:37px;
        height:32px;
        text-indent:-9999em;
        display:block;
        padding:0;
        margin-top: 3px;
}
.tab li a#top-link:hover {background-position:0 -32px;}
.tab li a:hover {background-color:#666;color:white;}
.tab-container .tab li a.selected {background:#EFECE5 url(../img/icon_close2.gif) no-repeat 87% 0; padding-right:36px;color:black;text-shadow:none;

                                   -moz-transition:background-color,padding .3s;
                                   -webkit-transition:background-color,padding .3s;
                                   -o-transition:background-color,padding .3s;
                                   -ms-transition:background-color,padding .3s;
                                   transition:background-color,padding .3s;

                                   cursor:pointer;}
.tab-container .tab li a.selected:hover  {background-position:87% -40px;}
.tab-container .tab #about_contact a.selected {background-position:93% 0;}
.tab-container .tab #about_contact a.selected:hover {background-position:93% -40px;}
#top-carousel {width:80%;overflow:hidden;height:235px;}
#top-carousel ul {width:4000px;}
#top-carousel ul li {float:left;width:285px;margin-right:18px;}
/*.ie8 .threecol, .ie7 .threecol, .ie6 .threecol {width:30%;}*/
.threecol {float:left;width:30%;margin-right:5%;}
.threecol p {font-style:normal;}
.threecol h4 {margin-bottom:14px;font-family:'SquareSerifDemi';font-size:.9em;color:black;}
.threecol li {font-size:1em;padding:.3em 0; border-top:1px solid #b4b1ac;text-transform:uppercase;font-family:'SquareSerifBook','courier new',serif;letter-spacing:.05em;}
.threecol .action { border-bottom:1px solid #b4b1ac;}
.threecol .action li {padding:0;height:36px;}
.threecol .action li a {padding:.4em .6em;display:block;color:black;font-family:'SquareSerifMedium';font-size:14px;-moz-transition:background-color .2s;-webkit-transition:background-color .2s;transition:background-color .2s;}
.threecol .action li a.icon {padding-left:36px;text-indent:0;width:auto;line-height:25px;}
.threecol .action li a.icon:hover {background-color:#fbf900;}
.threecol .action li a.icon_mail {background:#EFECE5 url(../img/icons_share.png) no-repeat 6px -238px;}
.threecol .action li a.icon_mail:hover {background:#fbf900 url(../img/icons_share.png) no-repeat 6px -279px;}
.threecol .action li a.icon_fb {background:#EFECE5 url(../img/icons_share.png) no-repeat 6px -74px;}
.threecol .action li a.icon_fb:hover {background:#fbf900 url(../img/icons_share.png) no-repeat 6px -115px;}
.threecol .action li a.icon_tw {background:#EFECE5 url(../img/icons_share.png) no-repeat 6px 8px;}
.threecol .action li a.icon_tw:hover {background:#fbf900 url(../img/icons_share.png) no-repeat 6px -33px;}
.threecol .action li a:hover {background-color:#fbf900;}
.threecol .action li a em {font-size:1em;font-family:'SquareSerifMedium','courier new',serif;color:black;float:left;line-height:1.8em;}
.threecol .action li a span {float:right;font-family: /*"chaparral-pro-1","chaparral-pro-2",sans-serif*/Georgia, 'Times New Roman', Times, serif;font-style:italic;text-transform:none;line-height:25px;display:block;}
#top .content {float:left;width:100%;position:relative;}
#aboutwrapper {overflow:hidden;}
#aboutwrapper .content-wrapper {}
#aboutwrapper .content {}
.form-content {}
.btn {background:#1a1a1a;border:1px solid black;color:white;font-family:'SquareSerifBook','courier new',serif;display:block;margin-bottom:.8em;text-align:center;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;-moz-transition:none;-webkit-transition:none;transition:none;}
.btn:hover {background: #757575;
            background: -moz-linear-gradient(top, #757575 0%, #5c5c5c 100%);
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#757575), color-stop(100%,#5c5c5c));
            background: -webkit-linear-gradient(top, #757575 0%,#5c5c5c 100%);
            background: -o-linear-gradient(top, #757575 0%,#5c5c5c 100%);
            background: -ms-linear-gradient(top, #757575 0%,#5c5c5c 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#757575', endColorstr='#5c5c5c',GradientType=0 );
            background: linear-gradient(top, #757575 0%,#5c5c5c 100%);border:1px solid #35383B;}
.btn:active {background: #575757;
             background: -moz-linear-gradient(top, #575757 0%, #7c7c7c 100%);
             background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#575757), color-stop(100%,#7c7c7c));
             background: -webkit-linear-gradient(top, #575757 0%,#7c7c7c 100%);
             background: -o-linear-gradient(top, #575757 0%,#7c7c7c 100%);
             background: -ms-linear-gradient(top, #575757 0%,#7c7c7c 100%);
             filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#575757', endColorstr='#7c7c7c',GradientType=0 );
             background: linear-gradient(top, #575757 0%,#7c7c7c 100%);}
.btn span {padding:.4em 1em;display:block;border-top:1px solid black;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}
.btn:hover span {border-top:1px solid #919191;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}
.btn:active span {border-top:1px solid #35383B;}
.action a {text-transform:none;font-family: "chaparral-pro-1","chaparral-pro-2",sans-serif;letter-spacing:0;}
.icon {padding-left:29px;background:transparent url(../img/bullet.gif) no-repeat left center;}
#top .btn {color:white;}
.last {margin-right:0!important;}
.client_show {margin-bottom:20px;border-bottom:1px solid #b4b1ac;padding-bottom:14px;height:92px;}
.client_show a {max-width:25%;float:left;display:block;position:relative;}
.client_show a img {width:100%;}
.fivecol {/*width:14.81%;*/float:left;position:relative;margin-right:15px;width:133px;}
h5 {font-family:'SquareSerifDemi','courier new',serif;font-size:14px;margin-bottom:9px;color:black;text-transform:uppercase;}
.fivecol li {color:black;font-size:14px;margin:6px 0;}
.fivecol li a {text-decoration:underline;color:black;display:block;width:90%;padding:4px 5px 1px;margin:-4px -5px -1px;}
.fivecol li span {width:90%;padding:4px 5px 1px;display:block;}
#portfoliowrapper .fivecol h5 {}
#jobswrapper,#aboutwrapper {}
#jobswrapper .threecol,#aboutwrapper .threecol {width:24.053%;margin-right:2.673%;}
#jobswrapper .threecol {width:51.7%;}
#jobswrapper .last {width:22.55%;margin-right:0;}
#aboutwrapper .copy {width:50.55%;/*width:74.55%;*/padding-top:0;line-height:22px;}
#aboutwrapper .last {width:22.606%;}
#aboutwrapper .last p {font-size:18px;font-family:'SquareSerifDemi';color:black;line-height:20px;  margin-bottom:18px; }
#aboutwrapper .last p a {color:#35383B;text-decoration:none;font-size:18px;font-family:'SquareSerifMedium';-moz-transition:background-color .2s;-webkit-transition:background-color .2s;transition:background-color .2s;}
.threecol p {font-size:16px; margin-bottom:10px;color:black; width:90%; line-height: 24px; }
.threecol p span { white-space: nowrap }
p.col1 {width:270px;margin-right:32px;float:left;}
p.col2 {width:270px;float:left;}

div.greeting p    { width:660px; margin-bottom:22px; }

div#top_gradient    { position:fixed; top:0px; left:0px; background-image:url(http://kettlenyc.com/img/gradient_top.png); background-repeat:repeat-x; z-index:2; height:103px; width:100% }
div#container       { width:88%;margin:0 auto 0 0;padding:43px 0 1px 70px;background-color:#1b1c1d;}
p.recent {font-size:12px;text-transform:uppercase;color:#DCE1E4;font-family: 'SquareSerifBook';letter-spacing:.1em;margin:0 0 15px 3px;}

#footer {position:relative;min-height: 528px;}
#footer .right {float:right;margin-top:-8%;position:relative;max-width:66.6%;font-size: 1.3em;}
#footer h3 {border-top:1px solid #35383b;border-bottom:1px solid #35383b;line-height:42px;font-family:'SquareSerifBook','courier new',serif;margin-bottom:30px;font-size:1.3em;position:relative;color:#FBF900;}
#footer h3 strong {font-family:'SquareSerifDemi','courier new',serif;}
#footer .content {max-width:220px;/*background:transparent url(../img/dotted.gif) repeat-x 0 100%;padding-bottom:20px;*/float:left; text-align: left;}
#footer p {margin-bottom:18px;font-size:14px;line-height:23px;}
.footer-inner {max-width:822px; text-align:center;}

div#loginwrapper    { position:fixed; top:-60px; left:0px; z-index:3; width:100%;  }
div.inside          { top:0px !important; }


a.about_sel_out         { background-image:url(http://kettlenyc.com/img/out.png); background-position:0px 35px; cursor:default; cursor:pointer; }
a.about_sel_in          { background-image:url(http://kettlenyc.com/img/in.png); background-position:0px 35px; cursor:default; cursor:pointer; }
a.about_unsel_out       { background-image:url(http://kettlenyc.com/img/out.png); }
a.about_unsel_in        { background-image:url(http://kettlenyc.com/img/in.png); }
a.project_sel_out       { background-image:url(http://kettlenyc.com/img/out.png); background-position:-116px 0px; }
a.project_sel_in        { background-image:url(http://kettlenyc.com/img/in.png); background-position:-116px 0px; cursor:default; }
a.project_unsel_out     { background-image:url(http://kettlenyc.com/img/out.png); background-position:-116px 35px; }
a.project_unsel_in      { background-image:url(http://kettlenyc.com/img/in.png); background-position:-116px 35px; }
a#logout                { display:block; position:relative; float:left; margin-left:-10px; margin-top:10px; width:30px; height:9px; text-indent:-99999em; background-image:url(http://kettlenyc.com/img/logout.png); cursor:pointer; z-index:3 }

div#login_form      { background-color:#FBF900; height:60px; width:100%; top:0px; left:0px; }

a#lost_login            { position:absolute; left:98px; top:23px; display:block; background-image:url(http://kettlenyc.com/img/lost_login.gif); width:216px; height:31px; text-indent:-99999em; background-position:0 -62px; }
a#lost_login:hover      { background-position:0 -31px; }
a.error_login           { background-position:0 0 !important; }
a.error_login:hover     { background-position:0 -31px !important; }

input.project_login_text    { position:absolute; top:23px; color:#b2b2b2; width:188px; border:2px solid #FBF900; height:23px; background-color:#fff; font-family:'courier new'; font-size:22px; padding:2px 4px; line-height:23px; letter-spacing:-.025em; /*text-transform:uppercase;*/ }
input#kettle_username       { left:511px; }
input#kettle_password       { left:718px; }
div#try_again               { position:absolute; width:129px; height:27px; background-image:url(http://kettlenyc.com/img/try_again.png); top:25px; left:382px; }

input#kettle_submit         { position:absolute; top:23px; left:924px; width:51px; height:31px; background-image:url(http://kettlenyc.com/img/ok_login.gif); border:none; background-color:transparent; background-position:0 -31px; cursor:pointer; background-repeat:no-repeat; }
input#kettle_submit:hover   { background-position:0 0px; }

div.video       { min-height:370px; height:auto !important; height:370px; }
div.clip        { margin-left:9px; }

div.element_spacer          { height:8px; }

.project {margin-bottom:50px;}
.project-container {max-width:945px;}
.project .description {max-width:220px;float:left; position:relative;display:block;}
.project .description p {margin-bottom:23px;margin-top:10px; font-size:14px; line-height:23px;}
#container p a {text-decoration:underline;padding:2px 4px;margin: 0 -4px;}
#container p a:hover {text-decoration:none;}
p a {font-style:normal;color:#cacaca;}
.project .description p.quote {font-size:20px;color:#cacaca;margin-bottom:10px;/*padding-top:20px;background:transparent url(../img/dotted.gif) repeat-x 0 0;*/font-family:'SquareSerifLight','courier new',serif;}
.project .description p.byline {font-size:12px;letter-spacing:.1em;color:#666666;text-transform:uppercase;line-height:1.2em;}
.project .description p.byline span {font-style:italic;font-size:14px;display:block;line-height:1em;letter-spacing:0;text-transform:none;margin-bottom:5px;}
.project .elements {float:right;margin:0;position:relative;/*margin-left:5%;height:497px;*/min-width:625px;display:block;max-width:660px;}
.project .element_video {position: relative;padding-bottom: 56.25%;padding-top: 30px;height: 0;overflow: hidden;max-width:688px;margin:0 auto;}
.project .element_video iframe,
.project .element_video object,
.project .element_video embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.project .element_video .poster { position:absolute;max-width:668px;height:100%;top:0;left:0; z-index:10;background:#1B1C1D;}
.project .element_video .element_video_inner {  }
#project_6 .elements {height:auto;}
.element {
        height:497px;
        width:668px;
        text-align: center;
}
.element img {/*max-width:100%;float:right;*/cursor:pointer; }
#twitter-feed .element img {
        margin-top:0;
}
#twitter-feed .element {
        display:none;
}
#twitter-feed .element:first-child {
        display:block;
}
.element img[src="img/ajax-loader.gif"] {
        margin-top:228px;
}
div.description div.award   { background-image:url(http://kettlenyc.com/img/award_badge.gif); background-position:top left; background-repeat:no-repeat; padding-left:21px; }
div.description div.first   { margin-top:16px; }

.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

form label { color:black;display:block;margin-bottom:3px;font-size:11px;font-family:'SquareSerifMedium';margin-left:2px;}
form input, form textarea { font-size:14px; border:1px solid #cfccc4;display:block;margin-bottom:10px;background-color:white;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;padding:10px 5px;width:68.246%;font-family:georgia,serif; -moz-box-shadow:0 1px 4px #efefef inset; -webkit-box-shadow:0 1px 4px #efefef inset; box-shadow:0 1px 4px #efefef inset;}
.left_col form input {
        width:158px;
}
form input:focus, form textarea:focus {-moz-box-shadow:0 0 5px #c4c1bc;-webkit-box-shadow:0 0 5px #c4c1bc;box-shadow:0 0 5px #c4c1bc;}
form textarea {height:150px; }
#submit,#submit-button {width:33.1%;float:left;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;font-size:18px;padding:4px;cursor:pointer;}
#sig-form #submit {
        width:120px;
}
input[type="submit"] {-webkit-appearance: none;}
.btn_cancel {font-size:18px;background-color:#d9d5cb; color:#26272a;width:33.1%;float:left;padding:5px 5px 4px 5px;border:1px solid #c4bfb5;margin-right:2%;}

.update {background-color:#FBF900;position:relative;top:40px; color:black;width:100%;z-index:50;padding:24px 0 20px;}
.close-update {position:absolute;right:6%;top:11px;background:#FBF900 url(../img/icon_close.gif) no-repeat center center;width:20px;height:19px;text-indent:-9999em;display:block;padding:7px;}
.close-update:hover {background-color:#EFECE5;}
.update .date {text-align:left;width:auto;float:left;padding-left:70px;}
.update .feature {width:65.625%;float:left;margin-left:21px;border-left:1px dotted black;padding-left:21px;}
.update .feature h4 {font-size:20px;text-transform:uppercase;font-family:'SquareSerifMedium';}
.update .feature p {line-height:1.2em;color:black;}
.update .date h4 {font-family:SquareSerifBold;font-size:20px;text-transform:uppercase;margin-bottom:0;}
.update .date span {font-size:18px;font-family:SquareSerifLight;}

#global_footer {padding-top:20px;border-top:1px solid #35383B;padding-bottom:30px;}
#global_footer .block  {width:215px;float:left;}
/*#global_footer .large_block  {width:287px;}*/
#global_footer .block p {font-size:12px;color:#cacaca;font-family:'SquareSerifDemi';display:inline-block;margin-right:20px;line-height:1.15em;margin-left:5px;display:block;float:left;margin-bottom:10px;}
#global_footer .first p {font-size:15px;}
#global_footer .block p a {font-size:14px;font-family:/* "chaparral-pro-1","chaparral-pro-2",sans-serif*/Georgia, 'Times New Roman', Times, serif;font-style:italic;padding:2px 5px;margin-left:-5px;text-decoration:none;display:inline-block;}

body.form {background:transparent url(../img/header_bg.gif) repeat 0 0;}
div#form_container {padding:80px 60px;background:none;}
.form-wrapper {width: 98.4%;border:1px solid black;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin-bottom:20px;}
.form-wrapper h3 {padding:18px;border-top:1px solid #232424;border-left:1px solid #232424;border-right:1px solid #232424;border-bottom:1px solid #232424;font-family:'SquareSerifLight';font-size:24px;background-color:black;}
.form-wrapper h3 strong {font-family:'SquareSerifDemi';}
.form-wrapper .form-content {padding:33px 22px;background-color:#efece5;-moz-border-radius:0  03px 3px;-webkit-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;}
.form-wrapper .form-content .left_col {width:21.4467%;float:left;margin-right:4%;}
.form-wrapper .form-content .left_col p, #form_container p {color:black;line-height:1.2em;margin-bottom:15px;font-size:16px;}
.form-wrapper .form-content .left_col p strong {font-family:'SquareSerifDemi';font-size:18px;}
.form-wrapper .form-content .right_col {width:74.553%;float:left;}
.form-wrapper .form-content .row {position:relative;}
.form-wrapper .form-content .row .error {border:1px solid #b94e00;}
.form-wrapper .form-content .row .valid {border:1px solid #5b9556;}
.form-wrapper .form-content .row div {position:absolute;left:70%;width:192px;top:22px;padding-bottom:13px;background:transparent url(../img/error_bubble.gif) no-repeat 100% 100%;font-family: "chaparral-pro-1","chaparral-pro-2",sans-serif;;font-style:italic;font-size:13px;border:none;display:inline-block}
.form-wrapper .form-content .left_col .row div {left:75%;}
.form-wrapper .form-content .row label.error {padding:13px 20px 0 50px;width:120px;background:transparent url(../img/error_bubble.gif) no-repeat 0 0%;border:none;min-height:20px;display:inline-block;}
#errors, #success {display:none;}
#errors.visible, #success.visible {display:block;}

#switch {background:transparent url(../img/switch.png) no-repeat 0 0; width:178px;height:68px;position:fixed;bottom:60px;right:6%;z-index:1000;display:none;}
.fb_iframe_widget iframe {
        width:140px!important;
}
#kettle-report {
        position:absolute;
        top:65px;
        right:6%;
        width:236px;
        background-color:white;
        -moz-border-radius:4px;
        -webkit-border-radius:4px;
        border-radius:4px;
        -moz-box-shadow:0 0 30px black;
        -webkit-box-shadow:0 0 30px black;
        box-shadow:0 0 30px black;
        z-index: 50;
        color:black;
        display: none;
}
#were-hiring {
        position:absolute;
        top:65px;
        right:3%;
        z-index: 50;
        color:black;
        display: none;
}
#kettle-report a:hover {
        background-color:transparent;
}
.report-top {
        padding:10px 10px 15px 20px;
}
.report-arrow {
        position: absolute;
        top:-16px;
        right:46px;
        background: transparent url(../img/arrow-up.png) no-repeat 0 0;
        width:28px;
        height:16px;
}
#kettle-report h3 {
        font-size:16px;
        font-family: 'SquareSerifDemi','courier new',serif;
        margin-bottom:15px;
        color:black;
}
.report-tw {
        background:transparent url(../img/report-twitter.gif) no-repeat 0 3px;
        padding-left:30px;
        font-family: Arial,Helvetica,sans-serif;
        font-size: 12px;
        line-height: 16px;
        color:black;
        display:block;
        width:140px;
}
.report-tw:hover {
        color:#33ccff;
}
.report-fb  {
        background: rgb(230,230,230);
        background: -moz-linear-gradient(top, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(230,230,230,1)), color-stop(100%,rgba(255,255,255,1)));
        background: -webkit-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 100%);
        background: -o-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 100%);
        background: -ms-linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e6e6', endColorstr='#ffffff',GradientType=0 );
        background: linear-gradient(top, rgba(230,230,230,1) 0%,rgba(255,255,255,1) 100%);
        padding:15px 10px 20px 20px;
        -moz-border-radius:0 0 4px 4px;
        -webkit-border-radius:0 0 4px 4px;
        border-radius:0 0 4px 4px;
}
.report-fb img {
        float:left;
        margin-right:10px;
        width:40px;
        margin-top: 5px;
}
.report-fb .like {
        float:left;
        width:140px;
}
.report-fb .like a {
        color:#3b5998;
        font-size: 12px;
        margin-bottom: 5px;
        display: inline-block;
        font-family: arial, helvetica, sans-serif;
        line-height: 13px;
}
.report-fb .like a strong {
        font-weight: bold;
        font-size: 13px;
}
.report-close {
        width:23px;
        height:22px;
        background: transparent url(../img/close-report.gif) no-repeat 0 0;
        position: absolute;
        right: 40px;
        top: 40px;
        display: block;
        text-indent: -9999em;
}
.report-close:hover {
        background-position: 0 -22px;
}
#were-hiring a.report-close {
        background-image:url(../img/close-hiring.png);
        width:22px;
        height:23px;
        position: absolute;
        right: 40px;
        top: 40px;
        display: block;
        text-indent: -9999em;
        padding: 0;
}
#were-hiring a.report-close:hover {
        background-image:url(../img/close-hiring.png);
        background-position: 0 -23px;
}
.form #were-hiring {
        display:none!important;
}
#were-hiring {
        width:254px;
        padding-bottom:49px;
        background: transparent url(../img/hiring.png) no-repeat 100% 100%;
}
#were-hiring .hiring-inner {
        padding:134px 50px 18px;
        width:154px;
        background: transparent url(../img/hiring.png) no-repeat 0 0;
        text-align: center;
}
#were-hiring a {
        color:#898989;
        font-family: 'SquareSerifBook';
        font-size: 12px;
        line-height: 13px;
        padding: 10px 21px;
        display: inline-block;
}
#were-hiring a strong {
        color:black;
        font-family: 'SquareSerifBold';
        font-size: 14px;
}
#were-hiring a:hover {
        background: transparent url(../img/hiring-hover.png) no-repeat 50% 50%;
}

.featured {
        padding:30px 35px 20px;
        min-height: 122px;
}
.featured h5 {
        color:#666;
        padding-bottom: 11px;
        margin-bottom: 23px;
        background: transparent url(../img/dotted.gif) repeat-x 0 100%;
}
#twitter-feed {

}
#twitter-feed .hd {
        margin-bottom:0;
}
#twitter-feed .elements {
        float:none;
        width:100%;
        text-align: center;
        max-height: none;
        max-width: none;
}
#twitter-feed .elements .element {
        height: auto;
        width:625px;
        margin:0 auto;
        text-align: center;
        padding:60px 0 10px;
        font-size: 36px;
        font-family: 'SquareSerifBook','courier new',serif;
        color:#959595;
}
#twitter-feed .elements .element a {
        color:white;
}
#twitter-feed .elements .element a:hover,
#twitter-feed .elements .element a:focus,
#twitter-feed .elements .element a:active {
        color:black;
}
#twitter-feed .elements .element a:focus,
#twitter-feed .elements .element a:active {
        color:black;
        background-color:white;
}
#twitter-feed .elements .element span {
        display:none;
}
#twitter-feed .profile {
        width:150px;
        margin: 15px auto 0;
}
#twitter-feed .profile img {
        float:left;
        position:relative;
        margin-right:12px;
        width:auto;
}
#twitter-feed .profile .info {
        font-family: Georgia, 'Times New Roman', Times, serif;
        width:90px;
        float:left;
        font-size: 14px;
        text-align: left;
        line-height: 1.2em;
        padding-top: 5px;
}
#twitter-feed .profile .info a {
        font-size: 14px;
        color:white;
        margin-bottom: 3px;
        display: inline-block;
}
#twitter-feed .profile .info em {
        font-size:12px;
        color:#666666;
        text-transform: uppercase;
        display: inline-block;
}
#sig-code {
        margin-bottom:30px;
}
#sig-code code {
        font-size:12px;
        line-height:16px;
        color:black;
        height:120px;
        overflow-y: scroll;
        overflow-x: visible;
        display:block;
}
#sig-code code a {
        color:black;
}
#sig-preview {
        margin-bottom:30px;
        background-color:white;
}
#sig-preview a:hover {
        background-color: transparent;
}
#sig-code p {
        float:left;
        position:relative;
}
#d_clip_container {
        float:left;
        position:relative;
        margin-left:10px;
}
#d_clip_container a {
        color:black;
}
#d_clip_container span{
        color:black;
        margin-left:10px;
}
/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
   consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */

@media screen and (max-width: 1024px) {
        html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; }
        p {font-size:1em;line-height:1.25em;}
        .project .elements {margin: 0 0 0 1.8%;max-width:66.666%;}
        .project .elements img {max-width:100%;}
        .element {
                width:auto;
        }
        .heroimg3 {
                margin: -220px -220px 0 0;
        }
}
@media screen and (max-device-width: 1024px) {
        #switch {display:none!important;}
        .tab li a#top-link {visibility:hidden!important;}
        #footer .right {max-width:50%;top:26px;}
        .poster {display:none;}
        .header .pager  {
                display:block;
        }
        #our-work {
                display:block;
        }
        .prev:hover {background-position:0 0;}
        .next:hover {background-position:100% 0;}
        .header .pager-btn:hover {width:33px;}
        #snc {
                margin: 60px 120px 0 0;
        }
}
@media screen and (max-width: 1000px) {
        #container h2 {font-size:3em;width:100%;}
        h2 {width:90%;font-size:3em;}
        .header {/*padding:17% 0 50px 70px*/}
        .hero h2 {
                margin:60px 0 20px 186px;
                width: 50%;
        }
        .hero h2, .hero3 h2 {
                margin-top:95px;
        }
        .hero p {
                margin-left:5%!important;
        }

        .hero1 .heroimg1  {
                left: 50%;
                margin-left: -596px;
                top: 160px;
        }
        .hero1 .heroimg1b  {
                left: 50%;
                margin-left: -182px;
                top: 210px;
        }
        .hero2 .heroimg2 {
                left: 50%;
                margin-left:-572px;
                top: 230px;
        }
        .hero2 .heroimg2b {
                left: 610px;
                top: 620px;
        }
        .hero2 .heroimg2c {
                left: 0px;
                top: 547px;
        }
        .heroimg2 {
                margin-top: -98px;
        }
        .header p {width:75%;}
        .tab-container,.form .tab-container {position:absolute;top:0;width:90%;padding:0 5%;margin:0;}
        .tab-div {width:90%;margin:0 auto;padding:40px 0 0;}
        .header, div#container {width:90%;padding-left: 5%;padding-right: 5%;}
        #top {position:absolute;top:40px;}
        .tab li a#top-link {display:none;}
        #aboutwrapper .last {width:46.606%;}
        .client_show {height:auto;}
        .fivecol {width:125px;}
        .project .elements,.project .description {float:none;width:100%;}
        .project .description {clear:both;}
        /*.project .description a {display:block;}*/
        .project .elements,.project .description {width:100%;padding:0;max-width:100%;margin:0;}
        .project .elements {min-width:100%;height:100%;max-width:668px;margin-bottom:20px;}
        .project .elements img {float:none;max-width:100%;width:auto;}
        .project .elements .element { text-align:center; }
        .project .description p {margin-bottom:0;}
        #footer .content {max-width:33.33%;}

        div#form_container {padding:40px 5%;}
        .client_show img {width:24%;}
        #switch {display:none;}
        .tab li a#top-link {visibility:hidden!important;}
        .bottom-bar .study {
                width: 77%;
        }
        .bottom-bar .view-study {
                width: 64%;
        }
        .bottom-bar .study-2 .view-study {
                margin-top:-2px;
                width:361px;
        }
        .bottom-bar .study-1 .view-study {
                margin-top:4px;
        }
}
@media screen and (max-device-width: 1024px) and (orientation:landscape){
        .header { min-height:640px; }

}
@media screen and (max-device-width: 1000px) and (orientation:portrait){
        #aboutwrapper .last {width: 30.606%;}
        #jobswrapper .last {width: 30.55%;}
        .header { min-height:877px; }
        .bottom-bar .study-1 .view-study {
                margin-top:-2px;
        }
        .heroimg3  {
                margin: 0;
        }
        .hero3.fromleft .heroimg3 #snc,.hero3 .heroimg3 #snc {
                -webkit-transform: translate3d(0px, 1000px, 0);
                -moz-transform: translate(0px, 1000px);
                -o-transform: translate(0px, 1000px);
                -webkit-backface-visibility: hidden;
        }
        #snc {
                margin: 500px 50px 0 0;
        }
}
@media screen and (max-width: 640px) {
        #top {width:640px;}
        .tab-container, .form .tab-container {/*width:576px;*/}
        .update {width:599px;}
        .header, div#container,,div#form_container { width:572px;}
        div#form_container {padding-top:60px;}
        .form-wrapper h3 {padding:10px;font-size:20px;}
        .form-wrapper .form-content .left_col,.form-wrapper .form-content .right_col {float:none;width:100%;margin-bottom:10px;}
        form label {margin-top:10px;}
        form .row.clearfix {margin-top:10px;}
        form input, form textarea {width:97%;margin-bottom:0;}
        .form-wrapper .form-content .row label.error,
        .form-wrapper .form-content .row div {position:static;background:none;color:#B94E00;width:100%;padding:0;margin:0 0 10px 0;height:12px;}
        #submit,#submit-button,.btn_cancel {width:47.3%;line-height:29px;}
        #footer .right {margin:0;float:none;}
        #footer .content {width:100%;float:none;max-width:100%;}
        .element {
                height:auto;
                min-height:400px;
        }
        .element img[src="img/ajax-loader.gif"] {
                margin-top:128px;
        }
        #twitter-feed .elements .element {
                width:auto;
                min-height:0;
                font-size:24px;
        }
        .bottom-bar {
                padding:10px 5% 0 5%;
                z-index: 40;
        }
        #global_footer .block {
                width:33%;
        }
}
@media screen and (max-width: 480px) {
        .project .elements img { width:320px;}
}
@media screen and (max-device-width: 480px){
        h1 {
                margin:0px 0 0 15px;
                float:none;
        }
        #fb-root, .header .pager-btn {
                display:none;
        }
        h2 {font-size:2em;width:100%;}
        .simple-nav, 
        .header .pager, 
        .bottom-bar {
                display:none;
        }
        .header {
                height:auto;
                min-height: 0;
        }
        .hero h2, .hero p {
                margin:15px 0 15px 15px!important;
                width:auto;
        }
        #kettle-report, #were-hiring {
                display:none!important;
        }
        .header p {width:auto;font-size:1em;line-height:1.1em;}
        p, #container li, a {font-size:.9em;line-height:1.3em;}
        .update,#top {width:100%;}
        .header,div#form_container,.tab-container, .form .tab-container { width:90%;padding:60px 5% 0;}
        div#container {
                width:90%;padding:30px 5% 0;
        }
        .header {
                padding:65px 5% 25px;
                height: auto!important;
        }
        #hero-carousel .hero {
                height: auto!Important;
                display:none;
        }
        #hero-carousel .hero0 {
                display:block;
        }
        .tab-container, .form .tab-container {padding-top:0;}
        .tab li a {padding:0 5px;}
        .tab li a.our-work-link {
                display:none;
        }
        p.share span {display:none;}
        .threecol {float:none;width:100%;margin-bottom:15px; padding:0;}
        #footer { min-height:0;height:auto; }
        #footer .right {position:static;margin:0 auto;display:block;}
        #footer .content {float:none;width:100%;max-width:100%;padding-bottom:0;border-bottom:0;background:none;margin-bottom:0;}
        .footer-inner {max-width:auto;}
        .project .elements {}
        .update {padding:5%;width:90%;}
        .update .date {float:none;text-align:left;border-bottom:1px dotted black;width:100%;margin-bottom:10px;padding-bottom:10px;padding-left:0;}
        .update .feature {float:none;border:none;margin:0;padding:0;width:100%;}
        .close-update {right:5%;top:5%;}
        #global_footer .block {width:33%;margin:0;}
        .form-wrapper h3 {padding:10px;font-size:20px;}
        .form-wrapper .form-content .left_col,.form-wrapper .form-content .right_col {float:none;width:100%;margin-bottom:10px;}
        form label {margin-top:10px;}
        form .row.clearfix {margin-top:10px;}
        form input, form textarea {width:97%;margin-bottom:0;}
        .form-wrapper .form-content .row label.error,
        .form-wrapper .form-content .row div {position:static;background:none;color:#B94E00;width:100%;padding:0;margin:0 0 10px 0;height:12px;}
        .fivecol {width:45%;}
        #portfoliowrapper h5 {margin-bottom:1%;}
        #portfoliowrapper ul {margin-bottom:3%;}
        #jobswrapper .threecol, #aboutwrapper .threecol {padding-top:0;float:none;width:100%;}
        .form-wrapper .form-content {padding:5%;}
        .element {
                height:auto;
                min-height:400px;
                padding:0;
        }
        .element img[src="img/ajax-loader.gif"] {
                margin:68px 0;
        }
        .featured {
                padding:0;
        }
        .project .elements {max-width:320px;}
        .project .elements img {
                width:auto;
        }
        #hero-carousel {
                position:relative;
                left:auto;
                top:auto;
                width:auto;
        }
        #hero-carousel .hero {
                float:none;
        }
        .header .pager  {
                display:none;
        }
        #our-work {
                display:none;
        }
        #twitter-feed .elements .element {
                padding: 40px 0 0px;
        }
        .project .hd {
                height:auto;
        }
        .hd h3 {
                width:63%;
        }
        .hd .pager {
                width:37%;
        }
        #twitter-feed .hd h3 {
                width:80%;
        }
        #twitter-feed .hd .pager {
                width:20%;
        }
}
@media screen and (max-device-width: 320px),
only screen and (max-device-width:400px) and (orientation:portrait){
        .tab li a {font-size:10px;}
        .fivecol {width:44%;}
        .hd {height:21px;line-height:21px;}
        .hd h3 {font-size:.9em;line-height:21px;width:60%;}
        .hd .pager {width:40%;}
        .pager-btn {width:21px;height:21px;background-size:200% 300%;}
        .pager p {line-height:21px;}
        .pager a {margin-left:5px;}
        .prev.pressed {
                background-position:0 100%;
        }
        .next.pressed {
                background-position:100% 100%;
        }
        .project .description p.quote {font-size:1em;}
        #global_footer .block {float:none;width:100%;margin-bottom:10px;}
        form input, form textarea {width: 95%;}
        #submit,#submit-button, .btn_cancel {width: 46.3%;}
        .tab {
                width:80%;
        }
        p.share {
                width:20%;
        }
        #were-hiring-link {
                display:none;
        }
        .element {
                min-height:210px;
        }
        .element_video, #twitter-feed .element {
                min-height:0;
        }
}
@media all and (-webkit-min-device-pixel-ratio: 2) {
}
@media all and (orientation:portrait) {

}

@media all and (orientation:landscape) {
}

@media print {
        * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
            -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
        a, a:visited { color: #444 !important; text-decoration: underline; }
        a[href]:after { content: " (" attr(href) ")"; }
        abbr[title]:after { content: " (" attr(title) ")"; }
        .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
        pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
        thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
        tr, img { page-break-inside: avoid; }
        @page { margin: 0.5cm; }
        p, h2, h3 { orphans: 3; widows: 3; }
        h2, h3{ page-break-after: avoid; }
}

@font-face {
        font-family: 'SquareSerifBook';
        src: url('fonts/SquareSerif-Book-webfont.eot');
        src: url('fonts/SquareSerif-Book-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-Book-webfont.woff') format('woff'),
                url('fonts/SquareSerif-Book-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-Book-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;

}
@font-face {
        font-family: 'SquareSerifBookItalic';
        src: url('fonts/SquareSerif-BookItalic-webfont.eot');
        src: url('fonts/SquareSerif-BookItalic-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-BookItalic-webfont.woff') format('woff'),
                url('fonts/SquareSerif-BookItalic-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-BookItalic-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;

}
@font-face {
        font-family: 'SquareSerifMedium';
        src: url('fonts/SquareSerif-Medium-webfont.eot');
        src: url('fonts/SquareSerif-Medium-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-Medium-webfont.woff') format('woff'),
                url('fonts/SquareSerif-Medium-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-Medium-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;

}

@font-face {
        font-family: 'SquareSerifDemi';
        src: url('fonts/SquareSerif-Demi-webfont.eot');
        src: url('fonts/SquareSerif-Demi-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-Demi-webfont.woff') format('woff'),
                url('fonts/SquareSerif-Demi-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-Demi-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;

}
@font-face {
        font-family: 'SquareSerifLight';
        src: url('fonts/SquareSerif-Light-webfont.eot');
        src: url('fonts/SquareSerif-Light-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-Light-webfont.woff') format('woff'),
                url('fonts/SquareSerif-Light-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-Light-webfont.svg#webfontvXhP2W8a') format('svg');
        font-weight: normal;
        font-style: normal;

}
@font-face {
        font-family: 'SquareSerifBold';
        src: url('fonts/SquareSerif-Bold-webfont.eot');
        src: url('fonts/SquareSerif-Bold-webfont.eot?iefix') format('eot'),
                url('fonts/SquareSerif-Bold-webfont.woff') format('woff'),
                url('fonts/SquareSerif-Bold-webfont.ttf') format('truetype'),
                url('fonts/SquareSerif-Bold-webfont.svg#webfont') format('svg');
        font-weight: normal;
        font-style: normal;

}
