@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:italic; font-weight:bold; }
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:10px solid #00abec;padding-top:0px;}
body    {background:#1b1c1d; color:#dce1e4;font-family: Georgia, 'Times New Roman', Times, serif; font-size:17px; background-attachment:fixed; }
h1      { width:auto; height:37px; background-image:url(../img/logo.png); background-position:8px 0; background-repeat:no-repeat; text-indent:-99999em; margin-bottom:30px;padding-bottom:15px;background-size:338px 37px;padding-left:8px;border-bottom:1px solid #00ABEC;margin-right:6.5%;}
h2      { font-family:'Georgia','Times New Roman','Times',serif; color:white; /*text-transform:uppercase;*/margin-bottom:30px;line-height:107px;font-size:105px; font-style: italic;margin-left:15px; font-weight:bold;}
h2 strong {font-family:'Georgia','Times New Roman','Times',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:#00abec;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: #00abec; color:black; text-shadow: none; }
::selection { background:#00abec; color:black; text-shadow: none; }
a { color:#00abec;text-decoration:none;-moz-transition:background-color .2s;-webkit-transition:background-color .2s;transition:background-color .2s;}
a:hover {background-color:#00abec;color:black;}
a:focus,
a:active {background-color:white;color:black;}
a:link { -webkit-tap-highlight-color: #FBF900; }
p em {font-style:italic;}

.header {margin-bottom:70px;background:transparent url(../img/header_bg.gif) repeat-x 0 0;width:auto;margin:0 auto 0 0;padding:130px 0 0 70px;position:relative;padding-bottom:50px;}
.header p {width:540px;margin-right:6.125%;margin-left:5px;font-size:1.3em; line-height:1.2em;max-width:730px;margin-bottom:15px;color:#00ABEC;}
#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:#EFECE5;height:50px;text-transform: uppercase;line-height:21px;}
#our-work:hover {color:#00abec;background-position:0 0%;}
#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, .header h1, .header h2, .header p {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
}
.header h2, .header p {position:relative;left:-20px;}
#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:#00abec;}
.tab-container {width:91%;padding:0 9% 0 38px;height:40px;position:fixed;top:0;background:#141515 ;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:#00abec;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.gif) no-repeat 0 0;width:42px;height:42px;text-indent:-9999em;display:block;}
.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;}
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#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:hover {background-position:0 -40px;background-color:#666;}
.tab li a:hover {background-color:#666;color:white;}
.tab li a:focus {background:none;}
.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:#00abec0;}
.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:#00abec url(../img/icons_share.png) no-repeat 6px -279px;}
.threecol .action li a.icon_in {background:#EFECE5 url(../img/icons_share.png) no-repeat 6px -156px;}
.threecol .action li a.icon_in:hover {background:#00abec url(../img/icons_share.png) no-repeat 6px -197px;}
.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:#00abec 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:#00abec url(../img/icons_share.png) no-repeat 6px -33px;}
.threecol .action li a:hover {background-color:#00abec;}
.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:160px;}
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:none;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%;}
#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:#00abec;}
#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;}
#footer p {margin-bottom:18px;font-size:16px;line-height:23px;}
.footer-inner {max-width:822px;}

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:#00abec; 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: 16px, line-height:23px;font-size:16px;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%;*/min-width:625px;height:497px;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;}
.elements img {/*max-width:100%;float:right;*/cursor:pointer;}
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:gerogia,serif; -moz-box-shadow:0 1px 4px #efefef inset; -webkit-box-shadow:0 1px 4px #efefef inset; box-shadow:0 1px 4px #efefef inset;}
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%;margin-right:2%;float:left;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;font-size:18px;padding:4px;cursor:pointer;}
input[type="submit"] {-webkit-appearance: none;}
.btn_cancel {font-size:18px;background-color:#d9d5cb; color:#26272a;width:33.1%;float:left;padding:5px;border:1px solid #c4bfb5;}

.update {background-color:#00abec;position:relative;top:40px; color:black;width:100%;z-index:50;padding:24px 0 20px;}
.close-update {position:absolute;right:6%;top:11px;background:#00abec 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:23.942%;float:left;}
#global_footer .large_block  {width:32%;}
#global_footer .block p {font-size:12px;color:#cacaca;font-family:'SquareSerifDemi';display:inline-block;margin-right:20px;line-height:1.4em;margin-left:5px;display:block;float:left;}
#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;}
.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 .right_col .row {position:relative;}
.form-wrapper .form-content .right_col .row .error {border:1px solid #b94e00;}
.form-wrapper .form-content .right_col .row .valid {border:1px solid #5b9556;}
.form-wrapper .form-content .right_col .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 .right_col .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;}
/* 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 {width:100%;}
}
@media screen and (max-device-width: 1024px) {
    #our-work, #switch {display:none!important;}
    .tab li a#top-link {visibility:hidden!important;}
    #footer .right {width:50%;top:26px;}
    .poster {display:none;}
}
@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}
    .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;}
    .project .elements img {margin-bottom:20px;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%;}
    #our-work, #switch {display:none!important;}
    .tab li a#top-link {visibility:hidden!important;}
}
@media screen and (max-device-width: 1000px) and (orientation:portrait){
    #aboutwrapper .last {width: 30.606%;}
    #jobswrapper .last {width: 30.55%;}
}
@media screen and (max-width: 640px) {
    #top {width:640px;}
    .tab-container, .form .tab-container {width:576px;}
    .update {width:599px;}
    .header, div#container,.project .elements img,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 .right_col .row label.error,
    .form-wrapper .form-content .right_col .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%;}
}
@media screen and (max-width: 480px) {
    .project .elements img { width:320px;}
}
@media screen and (max-device-width: 480px){
    h2 {font-size:2em;width:100%;}
    .header p {width:100%;font-size:1em;line-height:1.1em;}
    p, #container li, a {font-size:.9em;line-height:1.3em;}
    .update,#top {width:100%;}
    .header, div#container,div#form_container,.tab-container, .form .tab-container { width:90%;padding:60px 5% 0;}
    .header {padding:65px 5% 25px}
    .tab-container, .form .tab-container {padding-top:0;}
    .tab li a {padding:0 5px;}
    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 .right_col .row label.error,
    .form-wrapper .form-content .right_col .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%;}
}
@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:64%;}
    .hd .pager {width:36%;}
    .pager-btn {width:21px;height:21px;background-size:200% 300%;}
    .pager p {line-height:21px;}
    .pager a {margin-left:5px;}
    .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%;}
}
@media all and (-webkit-min-device-pixel-ratio: 2) {
    h1      { background-image:url(../img/kettle2x.gif); }
}
@media screen and (max-device-width: 1024px) {

    .prev:hover {background-position:0 0;}
    .next:hover {background-position:100% 0;}
}
@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;

}