/*

RESET.CSS

*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

body {font-size:75%;color:#333;font-family:"Helvetica Neue", Arial, Helvetica, sans-serif;}

/* Headings
----------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {font-weight:normal;}
h1 {font-size:3em;line-height:1.2;margin-bottom:0.5em;}
h2 {font-size:2em;line-height:1.2;margin-bottom:0.75em;}
h3 {font-size:1.5em;line-height:1.2;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}

/* Text elements
----------------------------------------------------------- */

p {margin:0 0 1.5em;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a {color: #EF2C38;text-decoration:underline;}
a:hover, a:active {color: #ED1C24;}

blockquote {margin:1.5em;font-style:italic;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1.1em 'andale mono', 'lucida console', monospace;line-height:1.5;}

/* Lists
----------------------------------------------------------- */

li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 0 .8em 0;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}

/* Tables
----------------------------------------------------------- */

table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
th, td, caption {padding:4px 5px;vertical-align:top;}
tfoot {font-style:italic;}
caption {background:#eee;}

/* Forms
----------------------------------------------------------- */

label { font-weight : bold; }
fieldset { padding : 1.4em; margin : 0 0 1.5em 0; }
legend { font-weight : bold; font-size : 1.2em; }
textarea { width : 390px; height : 250px; padding : 5px; }

/* CSS Document */

body {font: 0.813em arial, verdana, sans-serif; color: #333;background:#fff url(/images/frogsite_background.gif) no-repeat top center;}
#wrap {width:964px;margin:10px auto 0;}
.header {width:960px;height:49px;position:relative;}
.header h1 {float:left;text-indent:-9999px;background:transparent url(/images/strawberryfrog-logo.gif) no-repeat;width:209px;height:49px;margin:0;padding:0;}
ul.location li, ul.nav li, ul.social li, ul.subMenu li, ul.subMenuDetail li{display:inline;}
ul.location {float:right;background:#fff url(/images/clocks.gif) no-repeat;width:209px;height:49px;text-indent:-9999px;margin:0;}
a {outline:none;}

.rounded, .thumbs, .blank-thumbs {  -moz-border-radius:     1.5ex;  -webkit-border-radius:  1.5ex;}

/* Main Navigation */
.navBar {width:960px;height:50px;margin:0;position:relative;}
#home .navBar {background:transparent url(/images/navBar-home.png) no-repeat 0px 0px;}
#what .navBar {background:transparent url(/images/navBar-what.png) no-repeat 0px 0px;}
#work .navBar {background:transparent url(/images/navBar-work.png) no-repeat 0px 0px;}
#who .navBar {background:transparent url(/images/navBar-who.png) no-repeat 0px 0px;}
#contact .navBar {background:transparent url(/images/navBar-contact.png) no-repeat 0px 0px;}
#news .navBar {background:transparent url(/images/navBar-news.png) no-repeat 0px 0px;}.navBar ul {padding-top:6px;margin:0;}
.navBar ul {list-style:none;text-transform:uppercase;font-weight:bold;font-size:1.077em; letter-spacing: 0.2px;}

.navBar ul li {  margin:0; padding:0 5px;  float: left; text-align: center; margin-right: 1px; }

.navBar ul li a {  line-height: 29px;  text-align: center;}
.navBar ul li a, .navBar ul li a:hover {  text-decoration:none;color:#fff;}

.navBar ul li.news {float:right;}
.navBar ul li.home        {width: 51px;margin-left:12px;}
.navBar ul li.what        {width: 146px; }
.navBar ul li.work        {width: 88px; }
.navBar ul li.who         {width: 86px; }
.navBar ul li.contact     {width: 76px;}
.navBar ul li.news        {width: 101px;margin-right:9px;}

#home .navBar ul li.home ,
#what .navBar ul li.what ,
#work .navBar ul li.work ,
#who .navBar ul li.who ,
#contact .navBar ul li.contact ,
#news .navBar ul li.news ,
.navBar ul li:hover {
  background-color:#fff;
  -moz-border-radius:     .7ex;
  -webkit-border-radius:  .7ex;
}

#home .navBar ul li.home a, #home .navBar ul li:hover a {color:#971d2b;}
#what .navBar ul li.what a, #what .navBar ul li:hover a {color:#2ea443;}
#work .navBar ul li.work a, #work .navBar ul li:hover a {color:#234390;}
#who .navBar ul li.who a, #who .navBar ul li:hover a {color:#464646;}
#contact .navBar ul li.contact a, #contact .navBar ul li:hover a {color:#707070;}
#news .navBar ul li.news a, #news .navBar ul li:hover a {color:#234390;}

#home .navBar .arrow, #what .navBar .arrow, #contact .navBar .arrow {background:transparent url(/images/navArrow.gif) no-repeat center bottom;width:11px;height:10px;margin:0;padding:0;}
#home .navBar .arrow {position:absolute;bottom:0;left:35px;}
#what .navBar .arrow {position:absolute;bottom:0;left:145px;}
#what .page-show .navBar .arrow,
#who .page-show .navBar .arrow,
#work .page-show .navBar .arrow {display: none}

#contact .navBar .arrow {position:absolute;bottom:0;left:465px;}

/* page backgrounds */
#home .container {background:#fff url(/images/homebg.jpg) no-repeat;width:960px;height:320px;color:#fff;}
#home .container h2 {font-size: 1.25em;font-weight:600;letter-spacing:-0.2px;}
#home .container h1 {color:#bfd532;font-size:2.308em;text-transform:uppercase;font-weight:600;}
#home .container .content p {line-height:18px;}
#home .container .content {width:380px;;padding:20px 0 0 20px;}
#what .container .content {width:960px;min-height:479px;color:#fff;margin-bottom:2px;color:#707070;}
#what .whatLeft {background:#eef4c9 url(/images/whatbg.jpg) repeat-x;min-height:463px;width:799px;float:left;padding-top:20px;position:relative;}
#work  .colA, #work .colB {width:340px;float:left;}
#work .colB {padding-left:40px;}
#what .whatLeft .colA, #what .whatLeft .colB {float:left;width:43%;}
.whatLeft .colB {padding-left:40px;}
#what .whatLeft h1 {color:#2ea443;font-size:2.308em;text-transform:uppercase;background: transparent url(/images/redarrow.png) no-repeat center left;padding-left:20px;font-weight:bold;}
#what .content h2, #who .content h2, #work .content h2 {font-size:1.154em;font-weight:600;}
#what .whatLeft .socialIcon {position:absolute;top:0px;right:0px;}
#work .container .content {width:960px;color:#fff;margin-bottom:2px;color:#707070;}
#work .container #detailbg {background:#CAD6FE url(/images/workbg.jpg) repeat-x;padding-top:22px;}
#work .container .content a {color:#0f6cb6;font-weight:bold;text-decoration:none;}
#work .container .content a:hover {text-decoration:underline;}
#work .container h1 {color:#234390;font-size:1.538em;text-transform:uppercase;background: transparent url(/images/redarrow.png) no-repeat center left;padding-left:20px;font-weight:bold;}
#work .container h1 span {color:#0f6cb6}
#work .content, #who .content {margin-bottom:1px;float:left;}

.leftCol {width:690px;float:left;}
.rightCol {width:159px;float:right;padding-right:2px;}
.rightCol .logo {height:115px;text-align:center;}
#work .content .rightCol h2 {color:#707070;text-transform:uppercase;text-align:center;font-weight:bold;font-size:0.923em;margin:5px 0;}
.prev, .next {text-indent:-99999px;display:block;width:25px;height:41px;margin: 0 0 20px 48px;position:absolute;}
.prev {top:106px;margin:0 0 20px 45px;}
.next {top:25px}
.prev a {background:transparent url(/images/workdetail-arrows.png) no-repeat 0px -64px;display:block;width:25px;height:41px;}
.prev a:hover  {background-position: -45px -65px;}
.next a {background:transparent url(/images/workdetail-arrows.png) no-repeat 0px 0px;display:block;width:25px;height:41px;}/* H V */
.next a:hover  {background-position: -45px 0px;}

.back {float:right; ;background:transparent url(/images/backarrow.png) no-repeat left center;padding:3px 15px;font-variant:small-caps;color:#707070;font-size:15px;}
.back a {font-variant:small-caps;color:#707070!important;font-size:15px;text-decoration:none;font-weight:bolder;letter-spacing:1px;}
#who .back {position:absolute;bottom:20px;right:20px;}
#what .back {position:absolute;bottom:20px;right:20px;}
.midCol .back {position:absolute;bottom:15px;right:7px;}
#who .whoProfile {background-color:#d0d0d0;color:#707070;padding:20px 100px 10px 0;width:381px;float:left;position:relative;}
#who .whoProfile h1 {background:url("/images/redarrow.png") no-repeat scroll left center transparent;padding-left:20px;}
#who .whoProfile h1, #who .whoProfile h2 {font-size:1.538em;line-height:1em;text-transform:uppercase;font-weight:600;color:#464646;margin:0;}
#who .whoProfile h2 {color:#707070;}
#who .whoProfile h3 {font-size:1.154em;font-weight:600;margin:0;margin:15px 0 10px;}
#who .whoProfile h2, #who .whoProfile h3 {padding-left:20px;}
#who .whoProfile p {margin: 0 0 8px;}
#who .whoPic {
  float:left;margin-left:2px;
  width: 475px;
  height: 449px;
  background-color: transparent;
  background-repeat: no-repeat;
  }
#contact .container {background:#fff url(/images/contactbg.gif) no-repeat;width:960px;height:478px;color:#fff;}
#contact .container .content {position:relative;}

#contact .office {
  color: #707070;
  background-color:#fff;
  position:absolute;
  font-size:0.923em;
  padding:10px;
  clear:both;
  filter:alpha(opacity=70);
  opacity: 0.7;
  -moz-opacity:0.7;
}

#contact .office h3 {text-transform:uppercase;font-size:1.077em;font-weight:bold;color:#0f6cb6;margin:0;}
.address, .email_address {margin-top:5px}
.email_address .address a {color:#ED1C24; text-decoration:none}
.email_address .address a:hover {text-decoration:underline}

.email_address span.name {color:#333333;}
.time {color:#234390;font-weight:bold;}
#contact .container .content #office-new-york {  left:68px; top:105px; width:185px; }
#contact .container .content #office-amsterdam {   left:478px;  top:19px; width:196px; }
#contact .container .content #office-mumbai {    left:632px; top:236px; width:216px; }
#contact .container .content #office-sao-paulo { left:363px; top:271px; width:188px; }

#news .container .content {background-color:#D0D0D0;color:#707070;padding-top:22px;width:960px;}
#news .container .content .media {padding:0 20px 20px;}
#news .container .content h1  {color:#234390; font-size:1.538em; font-weight:600; line-height:1em; margin:0;text-transform:uppercase; background:url("/images/redarrow.png") no-repeat scroll left center transparent;
padding-left:20px;}

/* sub Menu */
ul.subMenu, ul.subMenuDetail {background:transparent url(/images/redarrow.png) no-repeat center left;padding-left:10px;margin-bottom:7px;}
.page-show ul.subMenu {background:none;}
ul.subMenu, ul.subMenu a, ul.subMenuDetail, ul.subMenuDetail a {color:#b7b7b7;font-size:0.96em;font-weight:bold;text-transform:uppercase;text-decoration:none;}
ul.subMenu li,ul.subMenuDetail li  {padding:0 8px;}
.page-show  ul.subMenu, ul.subMenu a {margin-bottom:7px;}
.page-show  ul.subMenu {padding-left:10px;}
#work ul.subMenu li.active a, #work ul.subMenu li a:hover,#work ul.subMenuDetail li.active a, #work ul.subMenuDetail li a:hover {color:#0f6cb6;}
#who ul.subMenu li.active a, #who ul.subMenu li a:hover, #who ul.subMenuDetail li.active a, #who ul.subMenuDetail li a:hover {color:#464646;}

#news ul.subMenu li.active a, #news ul.subMenu li a:hover, #news ul.subMenuDetail li.active a, #news ul.subMenuDetail li a:hover  {color:#464646;}
#news ul.subMenuDetail {text-align:right;padding-right:15px;}

/* ticker */

.ticker {background:transparent url(/images/tickerbg.gif) no-repeat;margin:2px 0;height:42px;font:bold 1.846em Arial, Helvetica, sans-serif;text-transform:uppercase;clear:both; width: 960px;overflow: hidden;}
.ticker div {white-space:nowrap; margin:6px 0 0;}
.ticker a {text-decoration: none; color:#FFF;}
.ticker a:hover {text-decoration: none; color:#FFF;}

#home .ticker span {color:#ed1c24;}
#what .ticker span {color:#bfd532;}
#work .ticker span {color:#0F6CB6;}
#who .ticker span {color:#707070;}
#contact .ticker span {color:#707070;}
#news .ticker span {color:#76C4EB;}

/* THUMBS */
div.thumbs, div.blank-thumbs  {width: 158px; height: 159px;text-align: center;margin:1px;}
div.thumbs a {display: block;width: 158px;height: 159px;text-decoration:none!important;}

.thumbs a img { position:relative; top:-60px }
#home .thumbs_wrapper, #what .thumbs_wrapper, #work .thumbs_wrapper, #who .thumbs_wrapper  {float:left;position:relative;}
#home .thumbs h4, #what .thumbs h4, #work .thumbs h4, #who .thumbs h4 {position:absolute;top:45%;left:0;}
#home .thumbs h4, #work .thumbs h4, #who .thumbs h4, #what .thumbs h4 {font-weight:600;color:#fff;text-decoration:none;text-transform:uppercase;font-size:14px;position:absolute;top:45%;width:100%;text-align:center;margin:0;padding:0;}
#work .thumbs h4 {color:#70c8eb;}
#who .thumbs h4 {color:#cdcdcd;}
#what .thumbs h4.blue {color:#0f6cb6;width:123px;margin-left:19px;top:20%;}
#what .thumbs h4.green {color:#2ea443;width:123px;margin-left:19px;top:20%;}


.blank-thumbs .mask,
.thumbs .mask {  width: 158px ;  height: 159px;  filter:alpha(opacity=50);  -moz-opacity:0.5;  -khtml-opacity: 0.5;  opacity: 0.5;
  background: transparent url(/images/mask_10px.gif);}

#what .blank-thumbs .mask,
#what .page-index .thumbs .mask,
#home .thumbs .mask {
  filter:alpha(opacity=000);
  -moz-opacity:0.0;
  -khtml-opacity: 0.0;
  opacity: 0.0;
}



/* footer */
.footer {clear:both;padding-bottom:200px;padding-top:10px;background:#fff url(/images/footerbg.jpg) no-repeat 40% 100%;}

.footer p.facebook_status,.footer p.twit {
  min-height:38px;float:left;width:600px;color:#0f6cb6;font-size:1em;font-weight:bold;
  padding:0 20px 0 60px;}

.footer p.facebook_status { background:transparent url(/images/smfrog-facebook.gif) no-repeat left center; }
.footer p.twit { background:transparent url(/images/smfrog-twitter.gif) no-repeat left center; }
.footer p.facebook_status a, .footer p.twit a {color:#0f6cb6; text-decoration: none;}


ul.social {width:280px;float:right;padding:0;height:28px;padding-top:10px;text-align:right;border-left:1px solid #ccc;}
ul.social li a {padding:0 3px;}
.addthis_toolbox a {display:inline;}

/* GLOBAL */
 p {margin: 0 0 8px;}

#locale{float: right; font-size:10px; width: 240px; height:50px; margin: 0; overflow: hidden;}
#locale div {float: left; text-align: center; margin: 0 6px;
  filter:alpha(opacity=60);  -moz-opacity:0.6;  -khtml-opacity: 0.6;  opacity: 0.6;line-height:18px;padding:0;}
#locale div a {text-decoration: none; color:#136bb2;}

#locale div:hover,
body.mumbai #locale .mumbai,
body.new-york #locale .new-york,
body.amsterdam #locale .amsterdam,
body.sao-paulo #locale .sao-paulo
{
  filter:alpha(opacity=100);
  -moz-opacity:1.0;
  -khtml-opacity: 1.0;
  opacity: 1.0;
}


/* Breadcrubms */
.breadcrumbs {width:450px;position:absolute;top:23px; left:209px; font-size: 10px;}
.breadcrumbs, .breadcrumbs a {color:#666666; text-decoration: none; }
.breadcrumbs a {padding: 0 4px;}
.breadcrumbs a:hover {text-decoration: underline;}

.bio_content {padding: 20px 0 0 20px;}
.capability_content {padding-left:20px;}

/* creative item slider */

#work #creative_items {
  position:relative;
  width:630px;
  overflow:hidden;
  margin:2em 20px;
  text-align: center;
/*  clear: both;*/
}

#work .creative_item {
  text-align: center;
  float: left;
  position:relative;
  width:630px;
  overflow:hidden;
}

#work #creative_items .inner {  width: 5000px;  }
#work .container .content div.description {
  width: 720px;padding-left:20px;}

.rightCol { width:159px;float:right;padding-right:2px;}
.midCol   { width:100px;float:right;position:relative;height:320px;}

#work #creative_items_wrapper {  width: 780px;padding-left:20px;float:left;position:relative;}  }

.at-first .prev,   .at-last .next   { background: transparent; }
.at-first .prev a, .at-last .next a { display: none; }

/* UTILITY */
.clear {  clear: both; }