/*
IC North America.
*/

/*STYLING RESETS, this resets all the browser issues, and resets everything to 0*/

html, body, div, span, input, textarea, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, em, img, strong, ol, ul, li, fieldset, form, label, legend, table, tbody,tr, td {margin: 0;padding: 0;border: 0;outline: 0;}

body {color: #ffffff;background: #000000; text-align: center; font-family:  Helvetica, arial,verdana, serif; line-height: 15px; font-size: 12px;}

a { text-decoration: none; color: #000000; font-weight: bold;}
	
a:hover {text-decoration: underline; color: #000000; }

input, textarea {border: solid black 1px;}

br.secret{height: 0px; line-height: 0px; clear: both;}

h1 {font-size: 32px; line-height: 30px; position: relative;}
h1 span.left { font-size: 30px; line-height: 68px; background: transparent url('/img/rings.png') no-repeat -200px 0; width: 65px; height: 65px;  text-align: center; position: absolute; left: 20px; top: -17px;}
h1:hover span.left {background-position: 1px 3px;}
h1.active span.left {background-position: -60px -177px;}
h1.active, h1.active a {color: #FF326C!important; }

#flashMessage {font-size: 24px; font-weight: bold; color: #000000; background: #ffffff; padding: 20px 0;}

.nobold {font-weight:normal;}
.largeblack {font-weight: bold; font-size: 14px;}

div.black { background: #000000; color: #ffffff;}
div.white { background: #ffffff; color: #333333;}

div.spacer50 {width: 100%; height: 50px;}
div.spacer35 {width: 100%; height: 35px;}
div.spacer30 {width: 100%; height: 30px;}
div.spacer25 {width: 100%; height: 25px;}
div.spacer20 {width: 100%; height: 20px;}
div.spacer15 {width: 100%; height: 15px;}
div.spacer10 {width: 100%; height: 10px;}

.wrapper {  width: 900px; margin: 0 auto; text-align: left; }

p {margin-bottom: 10px; text-align: justify; text-justify: inter-word;}

.download { color: #787878; text-decoration: none;}

#footer p { font-size: 10px;}

/* Navigation */
#nav { font-size: 11px; /*font-family: Orator;  text-transform: uppercase;*/}
#nav ul {list-style-type: none; float: right; margin-top: 15px; margin-right: 73px; _margin-right: 45px;}
#nav ul li {float: left; display: inline; margin-right: 20px; border-bottom: solid 2px #000000; }

#nav a {color: #ffffff; text-decoration: none; display: block; font-weight: normal;}
#nav a.america, #nav a.chinese {float: left; margin-left: 100px;}

/*nav highlights*/
.about-us #aboutus, .what-we-do #whatwedo, .what-weve-done #whatwevedone, .who-we-are #whoweare, 
.case-studies #casestudies, .careers #careers, .contact-us #contactus,
.industrial-design #whatwedo, .interface-design #whatwedo, .what-we-offer #whatweoffer,
.design-research #whatwedo, .strategic-innovation #whatwedo, .our-thinkings #ourthinkings  { border-bottom: solid 2px #ffffff;}

.aboutusonly #whatwedo, .aboutusonly #whatwevedone { border-bottom: solid 2px #ffffff;}
.aboutusonly #aboutus, .aboutusonly #whoweare, .aboutusonly #whatwevedone, .aboutusonly #casestudies, .aboutusonly #careers, .aboutusonly #contactus { border-bottom: solid 2px #000000;}

/*header info*/
#headeropen {display: none;}
.bwlogo { float: left; margin-left: 100px; _margin-left: 50px;}
	.bwlogo a {width:349px; height: 129px; background: url('/img/bwlogo.jpg') no-repeat; display: block;}
	.black .bwlogo a {background-position: top left;}
	.white .bwlogo a {background-position: bottom left;}
	
.bwdb {float: right; margin-right: 93px; _margin-right: 55px;}
	.bwdb a {width:188px;height: 20px; background: url('/img/bwdb.jpg') no-repeat; display: block;}
	.black .bwdb a {background-position: bottom left; }
	.white .bwdb a {background-position: top left;}


/* Page Content */
#pageContent .left, #wwd .content .left {float: left; width: 490px; margin: 0 30px 0 100px;_ margin: 0 30px 0 50px; }
#pageContent .right, #wwd .content .right {float: left; width: 180px; }
#pageContent .full, #wwd .content .full {float: left; width: 700px; margin: 0 30px 0 100px;_ margin: 0 30px 0 50px; }

#wwd .content .left p {margin: 0 0 10px 0;}

#pageContent h2 {font-size: 20px; font-weight: bold; color: #FF326C; line-height: 22px; margin-bottom: 10px;}
#pageContent .content h2 {margin: 0 100px 10px;}

.dbschoollist { list-style-type: none;}
.dbschoollist li {width: 245px; float: left;}

.right ul {margin: 5px 0 0 20px;}


/* What We Do Section 
	This is the whole footer code section*/

#wwd h1 {padding-left: 100px;}
#wwd h1 span.right {display: block; float: left; text-transform: uppercase;}
#wwd h1 a {color: #ffffff; line-height: 38px; font-weight: normal!important;}
#wwd .content .left p {margin: 0 0 10px;}

.content p {margin: 0 100px 10px;}
.content ul, .content ol {margin: 0 130px 10px;}
#wwd ul {margin: 10px 90px 10px;}

#wwd .white {display: none;}

/*Now for the page templates for WWD*/
.strategic-innovation #header, .design-research #header, .industrial-design #header, .interface-design #header {display: none;}
.strategic-innovation #headeropen, .design-research #headeropen, .industrial-design #headeropen, .interface-design #headeropen {display: block;}

.strategic-innovation #strategicinnovation, .design-research #designresearch, .industrial-design #industrialdesign, .interface-design #interfacedesign { display: none;}
.strategic-innovation #strategicinnovationwhite, .design-research #designresearchwhite, .industrial-design #industrialdesignwhite, .interface-design #interfacedesignwhite {display: block;}

#wwd .item {font-size: 12px; font-weight: normal; text-transform: capitalize; margin-right: 15px; font-family: 'OratorSlanted'; line-height: 18px;}
#wwd a, #wwd a:hover {text-decoration: none;}

/*homepage*/
.thumb_grid { list-style-type: none; width: 706px; margin-left: 96px;}
.thumb_grid li { display: block; float: left; background: url('/img/homegrid/shadow.jpg') no-repeat top left; width: 122px; height: 93px; margin: 0 24px 24px 0; _margin: 0 18px 18px 0;}
.thumb_grid li img {margin: 4px;}
.thumb_grid li.last {margin-right: 0px;}
.videodiv, .contentdiv { display: none;}


.fancy_div img {float: left;}

/*Career Pages*/
/* admin pages*/
.formlist {list-style-type: none;}
.formlist li {margin: 0 0 10px; clear:both;}
.formlist li label {display: block; width: 150px; float: left;}
.formlist li input, .formlist li textarea { padding: 3px; }
.formlist li textarea {width: 480px; height: 300px;}

.content h3 {margin: 0 0 0 100px; }
.isactive { font-size: 11px; color: green; padding: 10px 0 0 0;}
.notactive { font-size: 11px; color: red; padding: 10px 0 0 0; }

.careersside h3 {margin-bottom: 15px; }
.careersside p.title {font-weight: bold; text-transform: uppercase;	}
.careersside ol { margin: 0 0 20px 26px; font-weight: bold; list-style-type: decimal-leading-zero;}
.careersside ol li { margin: 0 0 5px 0;}

.career h1 {font-size: 30px; margin-bottom: 10px;}
.career .location {font-weight: bold; text-transform: uppercase; float: left; width: 315px;}
.career .print {font-weight: bold; text-transform: uppercase; float: right;}
.career h4 {margin: 10px 0 5px; text-transform: uppercase; font-size: 13px;}
.career ul {margin: 0 0 0 20px;}

/*print career*/
body.print { background: #ffffff; padding: 10px 0 50px; }
.print h1 {margin: 0 100px ;}
.print h4 {margin: 10px 100px 5px 100px;}
.print ul { margin: 0 120px;}
.printbottom .content { border-top: solid 1px black; width: 700px; margin: 0 100px;}
.printbottom h4 {text-transform: uppercase; margin: 10px 0 5px 0;}
.printbottom p {margin: 0 0 10px 0;}

/*people pages*/
.mainslide p { margin: 0 0 10px 0; }
.mainslide p.title { height: 60px; overflow: hidden; text-align: left; text-justify: none; font-size: 10px;}
.mainslide p.title a {font-size: 12px;}
.mainslide { list-style-type: none; margin: 0!important;}
.mainslide li { float: left; width: 124px; margin-right: 20px;}
.mainslide li .image { width: 124px; height: 124px; background: url('/img/people/frame/medium.jpg') no-repeat top left;}
.mainslide li .image img { margin: 5px; }

.minislide {list-style-type: none; margin: 0!important;}
.minislide li {float: left; width: 55px; margin-right: 15px;}
.minislide p {margin: 0!important;}
.minislide li .image {width: 55px; height: 55px; background: url('/img/people/frame/small.jpg') no-repeat top left;}
.minislide li .image img {margin: 2px;}

.jclite { float: left; width: 700px!important;}
#leftarrow, #rightarrow, #leftarrow2, #rightarrow2 { float: left; padding: 100px 44px;}

.smalljclite {float: left; width: 336px!important; }
#minileftarrow, #minirightarrow, #minileftarrow2, #minirightarrow2 { float: left;  padding:13px;}
#minileftarrow, #minileftarrow2 { margin-left: 62px;}

.accordionButton {font-size: 22px; text-decoration: none; margin:10px 0 0 80px; line-height: 30px;  /*font-family: 'OratorSlanted'!important; text-transform: uppercase;*/ }
.accordionButton .minus { display: none; font-family:  Helvetica, arial,verdana, serif;}
.accordionButton .plus {display: inline; font-family:  Helvetica, arial,verdana, serif;}
.accordionactive .minus {display: inline!important; }
.accordionactive .plus {display: none!important;}
.accordionButton:hover {text-decoration: none;}

.peopleblock { display: none; }
.peoplenav a {margin-right: 15px; }
.peoplenav a.last {margin: 0 ;}
.peoplenav a.active, .peoplenav a:hover {text-decoration: none; line-height: 52px; border-bottom: solid 2px #000000;}
.peopletitle {font-weight: bold;}

.largeprofile {width: 188px; height: 188px; background: url('/img/people/frame/large.jpg') no-repeat top left;}
.largeprofile img {margin: 6px;}
h1.persontitle {font-size: 16px; line-height: 20px; margin: 0!important;} 


.slideshow { width: 700px; float: left; }
.slideshow ul { list-style-type: none; }
.slideshow ul li {float: left; }
.slideshowprevious, .slideshownext { display: block; width: 100px; height: 525px; text-indent: -9000px; overflow: hidden; font-size: 0px; line-height: 0px;  float: left; background: url('/img/slideshow-left.jpg') no-repeat;}
.slideshowprevious {background-position: -100px 215px; }
.slideshownext {background-position: -200px 215px;}
.slideshowprevious:hover { background-position: 0 215px; cursor: pointer;}
.slideshownext:hover { background-position: -300px 215px; cursor: pointer;}
.back {margin: 0 100px 0 0; float: right;}


/*case studies*/
.login p { margin: 10px 0 0 0 !important;}
.login input {padding: 3px;}
.loginbutton { margin: 10px 0 0 0; border: none; background: #fff; color: #000; font-weight: bold; text-transform: uppercase; padding: 3px;}
.loginbutton:hover { background: #000; color: #fff; cursor: pointer;}

.smallsidebar {color: #4d4d4d; font-size: 11px;}

/*contact Us*/
.form { margin-top: -13px; }
.form .title {margin: 0 0 15px 0; font-weight: bold; font-size: 14px; }

.contactform { width: 180px; }
.contactform ul { margin: 0; }
.contactform ul li { display: block; margin: 0; padding-bottom: 8px; }
.contactform ul li label { display: block;  vertical-align: top; color: #000; font-size: 12px; padding-bottom: 1px; }
.contactform ul li input, .contactform ul li textarea { display: block; font-size: 12px; width: 172px; padding: 3px; }
.contactform ul li textarea { height: 100px; }
.contactform .submit { margin-top: -5px; margin-left: 130px; border: none; background: #fff; color: #000; font-weight: bold; width: 50px!important;}
.contactform .submit:hover { background: #000; color: #fff; cursor: pointer; }
.contactform ul li label.small { width: 30px; }
.contactform ul li span { display: inline-block; font-size: 12px; font-weight: bold; color: #333; }
.contactform .error-message {color: #FF326C;}
.contactmap { position: relative; margin-top: -13px; display: block; width: 487px; height: 284px;}

.marker { position: absolute; z-index: 99; height: 16px; width: 16px; }
.marker.i1 { left: 47px; top: 116px; }
.marker.i2 { left: 115px; top: 101px; }
.marker.i3 { left: 120px; top: 116px; }
.marker.i4 { left: 319px; top: 154px; }
.marker.i5 { left: 387px; top: 141px; }
.marker.i6 { left: 394px; top: 125px; }

.cols { padding-top: 30px; /*font-family:'Orator';*/ }
.cols .col { float: left; padding-left: 10px; }
.cols .col1 { width: 180px; }
.cols .col2 { width: 130px; padding-left: 10px; }
.cols .col3 { width: 135px; padding-left: 10px; }
.cols .col ul { margin: 0; padding: 0; list-style: none; }
.cols .col li { line-height: 15px; line-height: 16px; }
.cols .col li h3 { color: #000; margin: 0; padding: 0; padding-bottom: 8px; /*font-family:'Orator';*/ }
.cols .col li h3.sub { padding-top: 16px; }
.cols .col li.space { padding-bottom: 10px; }
.cols a { font-weight: normal; color: #333333; }

.sidenav li {margin-bottom: 5px;}
.spacing {margin-bottom: 10px;}


.blockedin {border-top: 14px solid black; border-bottom: 2px solid black; padding: 10px 0 0 0; color: #525253; font-size: 14px; line-height: 16px; font-weight: bold;}
h1.transpink {color: #FF326C; opacity: 0.9; font-size: 48px; margin: 15px 0;}
h1.transpink sup {font-size: 12px;}
h2.giantblack {font-size: 30px; line-height: 36px; color: #000!important;}
.bearsprite {display: block; width: 180px; height: 180px; background: url('/img/bearsprite.jpg') no-repeat top left; text-indent: -9000px; line-height: 0; font-size: 0;}
.bearsprite:hover {background-position: bottom left;}

ul.pinklist {list-style-type: none; color: #FF326C;}
ul.pinklist li {width: 200px; float: left;}
.backgroundbears {background: #fff url('/img/backgroundbears.jpg') 0 270px no-repeat!important;}
.pdflinks a {line-height: 18px; color: #ee2470; text-decoration: none;}
.pdflinks a img {vertical-align: middle;}

.careerslide {width: 490px!important; height: 500px!important;}
.careerslide li {width: 490px!important; height: 500px!important;}

@font-face{font-family:'Orator';src:url('oratorstd-webfont.eot');src:url('oratorstd-webfont.eot?#iefix') format('embedded-opentype'),url('oratorstd-webfont.woff') format('woff'),url('oratorstd-webfont.ttf') format('truetype'),url('oratorstd-webfont.svg#LatoBlack') format('svg');font-weight:normal;font-style:normal;}@font-face{font-family:'OratorSlanted';src:url('oratorstd-slanted-webfont.eot');src:url('oratorstd-slanted-webfont.eot?#iefix') format('embedded-opentype'),url('oratorstd-slanted-webfont.woff') format('woff'),url('oratorstd-slanted-webfont.ttf') format('truetype'),url('oratorstd-slanted-webfont.svg#LatoBlack') format('svg');font-weight:normal;font-style:normal;}