/* =============================================================================
   HTML5 Boilerplate CSS: h5bp.com/css
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, time { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


video {
  max-width: 100%;
  height: auto;
}
p {margin:0.2em 0; font-size:1.2em; line-height:1.28em;}
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, select, time { font-family: sans-serif; color: #000000; }

body { margin: 0; font-size: 0.7em; line-height: 1.4; background-color:#f3f2f0; color:#414141;

}

::-moz-selection { background: #e33a13; color: #fff; text-shadow: none; }
::selection { background: #e33a13; color: #fff; text-shadow: none; }

a { color: #000; }
a:visited { color: #000; }

a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

#news nav ul li a.news:hover,
#work nav ul li a.work:hover,
#about nav ul li a.header:hover,
#contact nav ul li a.contact:hover,
#career nav ul li a.career:hover {
color:#000000;
cursor:text;
}

.showMoreBtn, .case .caseImg, footer ul, .closeBtn, .showMoreBtn, .showLessBtn, .staffHeading, .email  {cursor: pointer;}

.case.opened .caseImg {cursor: auto;}

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea {border:1px solid #dedede; font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }
input, textarea { font-family: georgia, serif; color: #929292; font-style: italic; font-size:1.15em; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }



/* ==========================================================================
   Typography:
   ========================================================================== */

body.comic * {
  font-family:'ComicSansW01-BoldItalic' !important;
}

body.comic h3 {
    font-size:15px;
}

body.comic #flashContent object {
    display:none;
}

body.comic #flashContent {
    background:url('../images/PDILogoComic.png') no-repeat 0 0;
}



h1, h2, h3, h4 { font-weight:normal; color:#000000; text-transform:uppercase;}

header h1 {
  font-size:1.8em;
  text-transform:none;
  margin:0.4em 0 0.3em 0;
}

h2 {
font-size:2.4em;
text-transform:uppercase;
margin:0.5em 0;
}

section.content h1 {
font-size:3.2em;
text-transform:uppercase;
margin:0.5em 0;
}

section#contact div p a {
font-size:1.35em;
text-transform:uppercase;
margin:0.2em 0 0.3em 0;
}

h3 {
font-size:1.6em;
text-transform:uppercase;
margin:0.1em 0 0.5em 0;
}

.contactOffice h3 {
margin:0.1em 0 0.2em 0;
}

#career h3 {
font-size:21px;
text-transform:uppercase;
margin:0.8em 0 0.1em 0;
}

#career h3.first {
margin:0.0em 0 0.1em 0;
}



section#contact .w4.first div {

}

section#contact .w4.first div div {

}

section#contact .w4 > div {

}


section#contact .offices h2  {

margin:0.6em 0 0.1em 0;
}


section#contact .offices .w4 > div {
padding:0em 0 1em 0;
}


section#contact h2  {
font-size:2.3em;
}

.contactInformation  {
font-size:15px;
line-height:19px;
color:#000000;
float: right;
text-align: right;
margin-top:2px;
}

.contactInformation b {
font-weight:normal;
}

.newstext{
  font-size:1.2em;
  line-height:1.15em;
  padding:0 0 10px 0;
}
 .newstext p {
  font-size:0.9em;
  padding:0 0 10px 0;
}


section#about  p {
width:95%;
}


#news nav ul li a.news,
#work nav ul li a.header,
#about nav ul li a.about,
#contact nav ul li a.contact,
#career nav ul li a.career,
h1, h2, h3, section.staff div p a,
section#work section div.case article h2,
section#contact .contactForm  input.submitInput,
.pagination span
 {
font-family:'HelveticaNeueW01-77BdCn 692722', Helvetica, Arial, sans-serif;
}

time, nav ul li {
font-family:'HelveticaNeueW01-UltLtC 673371', Helvetica, Arial, sans-serif;
}


 .contactInformation,  section#work section div.case article h3, .pagination {
font-family:'HelveticaNeueW01-47LtCn 692686', Helvetica, Arial, sans-serif;
}


.contactInformation h1, .contactInformation b, .showMoreBtn, .showLessBtn  {
font-family:'HelveticaNeueW01-67MdCn 692710', Helvetica, Arial, sans-serif;
}

.contactInformation h1{
  margin:0 0 0.3em 0;
}

time {
line-height:1.0em;
font-size:1.4em;
}

section#contact .contactForm  input.submitInput {
  font-size:1.55em;
  font-style:normal;
  text-transform:uppercase;
}

/* ===== Primary Styles ========================================================
   Author:
   ========================================================================== */


/* ==========================================================================
    Responsive Grid Elements
   ========================================================================== */

.w4 {
  clear:both;
}



.w2 section, .w2 article section  {
 width:49%;
 margin:2% 0 0 2%;
 float:left;
}


.contactForm .w2 {
  width:49%;
  float:left;
  margin:0 0 0 2%;
}

.contactForm .w1 {
  width:23.5%;
  float:left;
  margin-top: -15px;
}


#news .w4 article {
 width:23.5%;
 margin:1% 0 1% 2%;
 *margin:1% 0 1% 1.9%;
 float:left;
}



.offices .w4 > div {
  width: 23.5%;
  margin:1px 0 1% 2%;
  float:left;
}

.offices .w4 > div.first {
 margin-top:1px;
}

#news article.m4, #news article.m0  {
 margin-left:0;
}

section#news section.news {
   margin:0 0 62px;
   z-index:1;
}


.news > article {
 width:23.5%;
 margin:0 0 0 2%;
 float:left;
}

.news > div {
  overflow: hidden;
}



.w4 div.first,
.w2 div.first, #career section.w2 .first, #about section.w2 article:first-child, .w2 .first {
margin:0 0 0 0;
}




/* ==========================================================================
   Generic elements
   ========================================================================== */

nav, footer, #header {
border-top:2.2em solid #000;
}

.sub-w-menu nav {
  border-top: none;
}

.sub-w-menu section.content {
  padding-top: 0;
}

.sub-w-menu .contactForm p {
  margin-bottom: 1em;
}

.sub-w-menu p {
  max-width: 600px;
}

section {
  width:100%;
  overflow:hidden;
  position:relative;
}


div.respImage {
  width:96%;
  float:none;
  padding:2%;
  background-color:#ffffff;
  -moz-box-shadow:    0px 0px 1px 1px #dcdcdc;
  -webkit-box-shadow: 0px 0px 1px 1px #dcdcdc;
  box-shadow:         0px 0px 1px 1px #dcdcdc;
  margin:0 0 0 1px;
  border:none;
}

.respImage img {
  width:100%;
}

span.topLine, span.bottomLine {
  height:auto;
  width: 100%;
  padding:0;
  margin:0;
  display:block;
  border-top: 1px dotted #D6D6D6;
  border-bottom: 1px dotted #FFFFFF;


}

span.topLine {
    margin:0  0 0.8em 0;
}

span.bottomLine {
position:absolute;
bottom:0;
}

.bDash {
  border-bottom:1px dotted #FFFFFF;
  border-top:1px dotted #D6D6D6;
  display:block;
  margin:10px 0 25px 0;
}

#logo span img {display:none;}


.PDILogo {
  height:22px;
  background:url('../images/spritePDI.png') no-repeat 1px -201px;
  width:280px;
  display: block;
  overflow: hidden;
}

.PDILogo a {
  display: block;
  text-align: left;
  text-indent: -999em;
  overflow: hidden;
}

.PDILogoFooter {
   float: left;
   text-decoration: none;
   font-size: 1.2em;
}

.PDILogoFooter span {
  display: none;
  margin:15px 0 20px 0;
}

.fb-like {
  margin:10px 0 0 20px;
}



/* ==========================================================================
   Animation classes
   ========================================================================== */

.animateBox {
  height:0;
  overflow:hidden;
}



/* ==========================================================================
   Navigation
   ========================================================================== */


nav {
  width:100%;
  margin:0 0 0em 0;
  overflow: hidden;
}


nav ul {
  margin:1em 0 1em -1px;
  overflow: hidden;
}


nav ul li {
  float:left;
  font-size:5em;
  text-transform:uppercase;
}

nav ul li a {
  text-transform:uppercase;
  text-decoration:none;
  color:#000000;
  cursor:pointer;
}

nav ul li.active {
  float:left;
  text-transform:uppercase;
}

nav select { display: none; }


/* ==========================================================================
   Section Content - for template without NEWS/CASE/ABOUT-sections
========================================================================= */

section.content {
  margin:0 0 1.5em 0;
  padding:1.5em 0 1.5em  0;
  border-top:2.2em solid black;
}


/* ==========================================================================
   SUBPAGE - for template without NEWS/CASE/ABOUT-sections
========================================================================= */
.subpage section.content {
  margin:0 0 2em 0;
  padding:4em 0 4em  0;
  border-top:none;
}

.subpage section.content p {
  width:95%;
}

.subpage #header header {
  margin:20px 0 20px 0;
}

.subpage .wrapper {
  width:828px;
  margin:55px 0px 20px 57px;

}

.subpage #header {
  border-top:21px solid black;
  border-bottom:21px solid black;
  margin-top: 0px;
}

.subpage #logo {
  display:none;
}

.subpage .contactInformation {
  float:left;
  text-align: left;
}

.subpage section.content h3 {
  margin:1em 0 0 0;
}

 .subpage section.content h1 {
  margin:0.4em 0 0 0;
}

.subpage section.content h2 {
  margin:0.8em 0 0em;
}
.subpage section.content p {
  margin:0.4em 0 1em 0;
}

.subpage .contactInformation .contactSocial {
  line-height:1.2;
}

.subpage .PDILogoFooter span {
    display: block;
}
.subpage .PDILogoFooter img {
    display:none;
}


/* ==========================================================================
   Form - Evaluation
========================================================================= */
.utvarderingForm label {
  display:block;
  margin:30px 0 10px 0;
  font-family:'HelveticaNeueW01-67MdCn 692710', Helvetica, Arial, sans-serif;
  letter-spacing:1.2;
}

.utvarderingForm div input {
  padding:2px 4px;
}

.utvarderingForm .checkboxes div label {
  display:inline;
  margin:0;
  font-size:12px;
}
.utvarderingForm .commentsLabel label, .utvarderingForm .comments label {
  font-size:12px;
  margin-top:15px;

}

.error_message {
  display: block;
  width:100%;
  color:#830f0f;
}

.error_message ul {
  padding:0 0 0 20px;
}

.error_message ul li {
  margin:0;
  padding:0;
}

.utvarderingForm input[type="text"]  {
  min-height:25px;
  min-width:200px;
}
.utvarderingForm .checkboxes {
  margin:20px 0 0 0;
}

.utvarderingForm .checkboxes input {
  margin-left:5px;
}


.utvarderingForm .comments {
  margin:0px 0 45px 20px;
}

.utvarderingForm .commentsLabel {
  margin:10px 0 50px 20px;
}



.utvarderingForm fieldset {
  max-width:550px;
  font-size:14px;
}

.utvarderingForm .formHeader {
  font-size:20px;
  font-family:'HelveticaNeueW01-67MdCn 692710', Helvetica, Arial, sans-serif;
  letter-spacing:1.2;
  margin:10px 0;
}

.utvarderingForm label {
  font-size:15px;
}




.utvarderingForm .submit input {
  margin:30px 0 40px 0;
  min-height:30px;
  width:262px;
  color:#384654;
  border:1px solid #dcdcdc;
  background-color:#e7e7e7;
}

.utvarderingForm .submit input:hover {
  background-color:#dcdcdc;
}


/* ==========================================================================
   Section About
========================================================================= */

section#about {
  margin:0 0 1.5em 0;
}

section#about section.w1 div {
}

section#about section.w1 div div {
  margin:10px 0;
  overflow: hidden;
}
section#about section.w1 div img {
 margin:0 0 16px 0px;
 display: block;
 float:left;
}


 section#about .clientsBrands {
   margin:20px 0 2% 0;
   position:relative;
   overflow:hidden;
   height:90px;
   width:1400px;
 }
ul.logolist {
   width:1400px;

}

.m-list.sub {
 padding:0px 0 10px 0;
 margin:0px 0 10px 0;
 width: 100%;
 float: left;
}

.m-list.sub li {
  display: block;
}

.m-list.sub li a {
  padding:0 15px 0 0px;
  position: relative;
  font-size: 12px;
}

.m-list.sub li:first-child a {
  padding:0 15px 0 0;
  position: relative;
}


.m-list.sub li:last-child a:after {
  display: none;
}

.our-services h3 {
 margin-top: 15px;
}

@media only screen and (min-width : 768px) {
  .m-list.sub li {
    display: inline;
  }

  .m-list.sub li a {
    padding:0 15px 0 15px;
    position: relative;
    font-size: 12px;
  }

  .m-list.sub li a:after {
    content: '/';
    display: block;
    position: absolute;
    right: -7px;
    top: -2px;
  }

  .our-services h3 {
   margin: 0.1em 0 0.5em 0;
  }
}

     /* ==========================================================================
   Section news
   ========================================================================== */

section#news, div#news {
  overflow: visible;
}

section#news .news, div#news .news {
  overflow: visible;
}

section#news .news section, div#news .news div {
  overflow: visible;
}

section#news article, div#news article {
  position:relative;
}

section#news article .newswrapper, div#news article .newswrapper {
  position:absolute;
  bottom:0px;
}

section#news article .newsheader, div#news article .newsheader  {
  margin:0 0 0 2px !important;
}


section#news article img, div#news article img {

}

section#news article .boxWrap, div#news article .boxWrap {
  height:193px;
  overflow:hidden;
  position:relative;
}

section#news article h2, div#news article h2 {
   margin:0px 0 4px 0;
}

.wrapper {
  width:980px;
  height:100%;
  margin:0 0 60px 60px;
}

#header{
  margin-top:45px;
}

.box {
  width:225px;
  min-height:225px;
  margin:10px 10px 10px 10px;
  background-color:#efefef;
  float:left;
}

.newsImage {
  border:1px solid #efefef;
  width:320px;
  height:183px;
  padding:4px;
  background-color:#ffffff;
}


.newsImage div {
    background-color:#ffffff;
  -webkit-box-shadow: inset 0px 0px 40px #eeeeee;
  -moz-box-shadow: inset  0px 0px 40px #eeeeee;
  box-shadow: inset  0px 0px 40px #eeeeee;
}



.newsImage div img {
  width:100%;
  height:100%;
}


section#news .boxShadow, section#news .boxShadow {
  position: absolute;
  bottom: -20px;
  height: 40px;
  width: 100%;
}
section#news .boxShadow .boxShadowInner, section#news .boxShadow .boxShadowInner {
  overflow: hidden;
  height: 20px;
  width: 100%;
  z-index: 6;
  position: relative;
}

section#news .boxShadow .boxShadowInner .shadow3, div#news .boxShadow .boxShadowInner .shadow3 {
  background: url(../images/newsShadow3.png) repeat-x left bottom;
  width: 100%;
  height: 20px;
  position: absolute;
  top: 20px;
}


section#news .boxShadow .boxShadowBottom, div#news .boxShadow .boxShadowBottom {
  overflow: hidden;
  height: 20px;
  width: 100%;
  position: relative;
  bottom: 0;
  padding: 0 5px;
  left: 0px;
}

section#news .boxShadow .shadow1, div#news .boxShadow .shadow1 {
  background: url(../images/newsShadow1.png) no-repeat top right;
  height: 20px;
  right: 5px;
  position: absolute;
  bottom: 0;
  width: 100%;
}

section#news .boxShadow .shadow2, div#news .boxShadow .shadow2 {
  background: url(../images/newsShadow2.png) no-repeat;
  height: 20px;
  position: absolute;
  bottom: 0px;
  width: 100%;
  opacity: 0;
  -moz-opacity: 0;
  filter:alpha(opacity=0);

}




/* =============================================================================
   Header section
   ========================================================================== */


#header header a {
  text-decoration:none;
}

#header header {
  margin:23px 0;
  overflow:hidden;
  height:142px;
}


header {
  width:100%;
}


header div ::-moz-selection {
  background: #000;
  color: #fff;
  text-shadow: none;
}

header div ::selection {
  background: #0000;
  color: #fff;
  text-shadow: none;
}


div#logo {
  margin-left:-2px;
}

.contactInformation .contactAdress {
  display:block;
  margin:8px 0 0  0;
}

.contactInformation .contactSocial {
  display:block;
  line-height:18px;
}

#flashContent {
  width:470px;
  height:142px;
  position: absolute;
}

/* =============================================================================
   Footer section
   ========================================================================== */

footer ul{
  float:right;
  list-style:none ;
}

footer ul li {
  float:left;
}

footer ul li a{
  display:block;
  width:32px;
  height:32px;
  background:url('../images/spritePDI.png') no-repeat 0 0;
}

footer ul li.vimeo a {
  background-position:-36px 0px;
}

footer ul li.vimeo:hover a {
  background-position:-36px -32px;
}

footer ul li.facebook:hover a {
  background-position:0 -32px;
}



/* =============================================================================
   Career section
   ========================================================================== */


section#career {
  padding-bottom:62px;
}


section#career p {
  width:95%;
}



/* =============================================================================
   Case section
   ========================================================================== */

#work section {
  overflow:visible;
}


#work section hgroup{
  margin-left:-2px;
}


section.caseW {
  z-index:1;
  padding:0 0 45px 0;
}

section.caseW, section#work {
  overflow:visible;
}

section#work {
  margin:0 0 3px 0px;
}



section#work section div.case, .caseTexts, .caseVideo {
  height:432px;
}

section#work section div.case {
  width:49%;
  padding: 0 0 35px 0;
  position: absolute;

}

section#work .boxShadow {
  height: 35px;
  width: 300px;
  right: 0;
  position: absolute;
  bottom: 0;
  background: url(../images/caseShadow.png) no-repeat top right;
  z-index: 0;
}


section#work section div.case .caseContent {
  background: #fff;
  height: 100%;
  width: 100%;
  -webkit-box-shadow:  0px 0px 5px #e1e0de;
  -moz-box-shadow:   0px 0px 5px #e1e0de;
  box-shadow:   0px 0px 5px #e1e0de;
}
 .caseTexts, .caseVideo {
  width:100%;
}

 .caseTexts {
  background:#ffffff;
  position: absolute;
  z-index:1;
}

 .caseVideo {
  position: absolute;
  z-index:2;
  top:4px;
}

#work .row {
  overflow: visible;
}


.video-img{
  position:absolute;
  z-index:2;
  top:0;
  left:0;
  width:100%;
  height:98%;
  background:url(../images/caseArrow.png) no-repeat 50% 50%;
}




.case.leftA.opened .caseTexts  {
 right:2px;
}


.case.leftA .caseTexts, .case.rightA .caseVideo {
 right:0;
}


section#work section div.case .caseImg  {
  width:640px;
  height:360px;
  -webkit-transition:opacity 0.09s ease-in-out ;
  -moz-transition:opacity 0.09s ease-in-out ;
  -o-transition:opacity 0.09s ease-in-out ;
  transition:opacity 0.09s ease-in-out ;
  opacity:1;
  -moz-opacity: 0.1;
  filter:alpha(opacity=100);
}



section#work section div.case .caseImg:hover   {

  opacity: 0.9;
  -moz-opacity: 0.9;
  filter:alpha(opacity=90);
}



section#work section div.case.opened .caseImg:hover  {
  opacity: 1;
  -moz-opacity: 1;
  filter:alpha(opacity=100);
}

section#work section div.case .caseImg  img {
  width:100%;
  height:100%;
}


section#work section div.case .caseWrap
{
  border:1px solid #e1e0de;
  background-color:#ffffff;
  height:320px;

}
section#work section div.case .caseVideoContainer
{
position:absolute;
z-index:2;
top:11.5%;
height:85%;
width:93.25%;
background-color:#ffffff;
margin:0 25px 0 23px;
}

section#work section div.case .caseVideoContainer .video
{
display:none;
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}


.video iframe,
.video object,
.video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.video-wrapper {
  width: 640px;
  max-width: 100%;
  position: relative;
}


section#work section div.case .caseVideoContainer p
{
  padding:1.5% 0;
  font-size:11px;
  color:#565656;
}



section#work section div.leftA {
  left:0;

}

section#work section div.rightA {
  right:0;

}


section#work section div.row {
  width:100%;
  margin:0% 0 1% 0;
  position:relative;
  height:445px;
  z-index:2;
}

footer div.row {
  width:100%;
  margin:1% 0 1% 0;
  position:relative;
  overflow: hidden;
  height:350px;
}

section#work section div.case article{
margin:3.25% 0 3.5% 3.65%;
width:92%;
}

section#work section div.case article .caseInfo{
width:100%;
border-top:1px dotted #d6d6d6;
border-bottom:1px dotted #d6d6d6;
padding:3% 0;
margin:2% 0;
}

section#work section div.case article .caseInfo span{
display:block;
clear:both;
overflow:hidden;
margin:0.1em 0;
}


section#work section div.case article .caseText{
position:absolute;
bottom:20px;
width:90%;
}


section#work section div.case article .caseInfo h4{
font-weight:bold;
font-size:1em;
margin:0 0 0 0;
text-transform:none;
float:left;
min-width:40px;


}

section#work section div.case article h2 {
font-size:1.5em;
display:inline;
letter-spacing:0.04em;
}


section#work section div.case article h3 {
font-weight:normal;
font-size:1.5em;
display:inline;
letter-spacing:0.05em;
}

section#work section div.case article .caseText h2 {
font-weight:normal;
font-size:3em;
margin:0.2em 0;
display:block;
line-height:1.0em;
width:90%;
}




/* =============================================================================
   } Contact section
   ========================================================================== */



section#contact {
padding:0 0 6% 0;
}


section#contact div p {
margin:0px;
padding:0px 0 0 0;
}


section#contact .staff div p {
border-top:1px dotted #ffffff;
border-bottom:1px dotted #d6d6d6;
height:6.9em;
margin:0 1% 0 0;
padding:0.8em 0 0 0;
width:23.5%;
float:left;
position:relative;
}





section#contact .staff .contactForm  p {
border-top:none;
border-bottom:none;
height:auto;
margin:0 1% 0 0;
padding:0 0 0.8em 0;
width:auto;
display:block;

}


section#contact .staff div p.n0,  section#contact .staff div p.n1, section#contact .staff div p.n2, section#contact .staff div p.n3 {
    border-top:none;
    padding:0.8em 0;
}

section#contact .staff div p.last{
  border-bottom:none;
  height:7em;

}


section#contact .staff .contactForm div {
overflow:visible;
}


section#contact .staff div div  {
border-top:1px dotted #d6d6d6;
}


section#contact .staff div  {
overflow:hidden;
}

section#contact .staff  h2.staffHeading  {
padding-left:15px;
background:url('../images/arrowsPDI.png') no-repeat left 9px;
margin-top:4%;
}

section#contact .staff  h2.staffHeading.active  {
background-position: left -76px;
}

section#contact div p a {
display:block;
text-decoration:none;
text-transform:uppercase;
color:#000000;
}

section#contact div p span {
display:block;
}

section#contact .contactForm  textarea,
section#contact .contactForm  input {
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0px 0px 5px #eeeeee;
-moz-box-shadow: inset  0px 0px 5px #eeeeee;
box-shadow: inset  0px 0px 5px #eeeeee;

}

section#contact .contactForm  textarea {
  height:153px;
  width:95%;
  padding:12px 12px 20px 12px;
}



section#contact  .contactForm #contactForm #to {
    color: #bbbbbb;
}

section#contact .contactForm  input {
  height:5%;
  margin:0 0 2% 0;
  padding:12px 12px 13px 12px;
  width:92%;

}

section#contact .contactForm  .w2 {
  height:185px;
}

section#contact .contactForm  input.submitInput {
  width:20%;
  -webkit-box-shadow: 0px 0px 0px ;
  -moz-box-shadow: 0px 0px 0px;
  box-shadow: 0px 0px 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  background-color: #ffffff;
  color:#000;
  margin:3% 0 0 0;
  padding: 2.5% 3%;
}


section#contact .contactForm input.blankField {
  margin:0;
  padding:0;
  border:0px;
  border-radius: 0;
  box-shadow: 0px;
  line-height: 0;
}

section#contact .contactForm {
margin:2% 0 4.5% 0;
}


section#contact .officeAdress {
padding:4% 0 5% 0;
border-bottom:1px dotted #D6D6D6;
height:147px;
}

section#contact .officeAdress span a {
text-transform:none;
font-size:13px;
color:#7c7c7c;
}

section#contact .contactOffice {
padding:4% 0;
border-top:1px dotted #ffffff;
}

.staffwrapper {
  display:none;
}

/* =============================================================================
   } Buttons & Logos
   ========================================================================== */
.closeBtn {
      background:url('../images/closeBtn.png') no-repeat;
      height:40px;
      width:40px;
      position:absolute;
      top:-17px;
      display:none;
      z-index:5;
}

.rightA .closeBtn {
      left:-17px;
}

.leftA .closeBtn {
      right:-17px;
}

.pagination {
  display:block;
  position:absolute;
  text-transform:uppercase;
  left:0;
}

.showLessBtn, .showMoreBtn, .pagination {
    bottom:21px;
}

#news .showLessBtn, #news .showMoreBtn, #news .pagination {
    bottom:-39px;
}

.showLessBtn, .showMoreBtn {
  background:url('../images/spritePDI.png') no-repeat;
  text-transform:uppercase;
  position:absolute;
  font-size:16px;
  padding:2px 0 0 29px;
  display:block;
  height:26px;
  z-index:2;
}

.showLessBtn.inactive, .showMoreBtn.inactive {
  opacity: 0.1;
  -moz-opacity: 0.1;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
  filter:alpha(opacity=20);
  cursor:default !important;
}

.showMoreBtn {
  background-position: -40px -67px;
  right:0;
}

.showLessBtn {
  right: 80px;
  background-position: -40px -96px;
}



.randomlogos {
  display:inline-block;
}



ul.randomlogos  {
  list-style-type:none;
  margin:0;
}

ul.pagination  {
  display:none;
}


.randomlogos li {
  float:left;
}


ul.logolist {

 list-style-type:none;
 padding:0;
 overflow: hidden;
}

.logotypeContainer {
  height:100px;
}


ul.logolist li {

 float:left;

}

ul.logolist li img {
 max-width:100%;
 width:auto;
}



.boxshadowtest{
  -webkit-box-shadow: inset 0px 0px 40px #eeeeee;
  -moz-box-shadow: inset  0px 0px 40px #eeeeee;
  box-shadow: inset  0px 0px 40px #eeeeee;
}
/*




         _______                   _____
        /::\    \                 /\    \
       /::::\    \               /::\    \
      /::::::\    \             /::::\    \
     /::::::::\    \           /::::::\    \
    /:::/~~\:::\    \         /:::/\:::\    \
   /:::/    \:::\    \       /:::/__\:::\    \
  /:::/    / \:::\    \     /::::\   \:::\    \
 /:::/____/   \:::\____\   /::::::\   \:::\    \
|:::|    |     |:::|    | /:::/\:::\   \:::\____\
|:::|____|     |:::|____|/:::/  \:::\   \:::|    |
 \:::\   _\___/:::/    / \::/   |::::\  /:::|____|
  \:::\ |::| /:::/    /   \/____|:::::\/:::/    /
   \:::\|::|/:::/    /          |:::::::::/    /
    \::::::::::/    /           |::|\::::/    /
     \::::::::/    /            |::| \::/____/
      \::::::/    /             |::|  ~|
       \::::/____/              |::|   |
        |::|    |               \::|   |
        |::|____|                \:|   |
         ~~                       \|___|




/* =============================================================================
   } Queries
   ========================================================================== */

/* Smartphones (portrait and landscape) ----------- */




@media only screen
and (min-width : 0px)
and (max-width : 689px) {
/* Styles */

.wrapper, .subpage .wrapper {
width: 282px;
margin: 19px 19px 0 19px;
padding: 0 0 15px 0;
}

div#logo {
    margin-left: 0px;
}

#flashContent, .PDILogo {
  display: none;
}

.subpage .PDILogo {
  display:block;
  margin-bottom: 7px;
  width: 140px;
  background-position:1px -201px;
  margin-bottom: 8px;
}

.subpage section.content h1 {
  font-size:2.4em;
}

.subpage section.content h2 {
  font-size:1.4em;
}


/* Typography-- */
h3, #career h3 {
    font-size: 15px;
}

.contactInformation h1 {
    font-size: 1.6em;
}


 section#about .clientsBrands, ul.logolist  {
   width:282px;
 }


/*FORM*/


.utvarderingForm fieldset, .utvarderingForm input, .utvarderingForm textarea  {
  max-width:262px;
  font-size:14px;
}

.utvarderingForm .submit input {
  width:282px;
}

/* HEADER-- */

#header header {
  margin:0;
  height:auto;
}

section#header {
    border-top:none;
    margin-top:21px;
}


section#news article {
    width:98%;
    margin:0;
}


div#logo {
    background: url("../images/spritePDI.png") no-repeat scroll left -416px transparent;
    height: 80px;
    width: 161px;
}

.contactInformation {
  width:100%;
  float: left;
  text-align: left;
  line-height:1.18em;
  margin:15px 0 15px -0.05em;
  padding:1.0em 0 0 0;
 }

.contactInformation .contactAdress {
  margin:0px;
 }

/* NAVIGATION-- */

nav, footer, .contactInformation, section.content, .subpage #header  {
    border-top:7px solid black;
}


.subpage #header {
    border-bottom:7px solid black;
}


.subpage #header header {
    margin:0;
}

.subpage .contactInformation {
    border-top:0px;
    border-bottom:0px;
    padding: 0;
}

nav  {
/*+10 för border*/
  border-bottom:1px dotted #ffffff;
  margin:0 0 15px 0;
  padding:0;
}


nav ul {
  margin:0.5em 0 0 0;
  padding:0 0 0.5em 0;
  overflow: hidden;
  border-bottom:1px dotted #D6D6D6;

}


nav ul li {
  letter-spacing:0.04em;
  font-size:1.35em;
  text-transform:uppercase;
  display:block;
  font-family:'HelveticaNeueW01-ThinCn 673383', Helvetica, Arial, sans-serif;
}

nav ul li a {
  text-transform:uppercase;
  text-decoration:none;
  color:#000000;
  cursor:pointer;
}

nav ul li.active {
  text-transform:uppercase;
}

section#work {
    margin: 0 0 10px;
}



/* NEWS-- */

section#news article {cursor: pointer;}

section#news {
    padding:0;
}

section#news header nav  {
    margin-bottom:0;
}
section#news .news section {
    margin: 0 0 0;
}

section#news section.news  {
  margin:0 0 43px;
}

section#news section.news article {
  padding:10px 0 2px 0;
  height:auto;
  border-top:1px dotted #FFFFFF;
  border-bottom:1px dotted #D6D6D6;
}

section#news section.news article.m0 {
  border-top:none;
}

section#news article .boxWrap {
  height:auto;
  overflow: visible;
}

section#news article .newswrapper {
  position:relative;
  bottom:auto;

}


.newsImage {
  width:270px;
  height:154px;
  margin:0 0 10px 0;
}

section#news article .newsheader {
  margin:0.3em 0;
}

section#work section div.case article h1, section#work section div.case article h2 {
  font-size:1.5em;
}

section#work section div.case.opened article h2 {
  line-height:1.1em;
}


section#work section div.case article .caseText h2
{
  line-height:1.2em;
  color:#ffffff;
}



/* STAFF-- */


section#career {
    padding-bottom: 20px;
}
section#contact .contactForm {
  margin: 2% 0 14.5% 0;
}
#contactWrapper.contactForm form {
  position: relative;
}
#contactWrapper.contactForm .w1{
  padding-top: 200px;
}
#contactWrapper.contactForm .w2{
  position: absolute;
  top: 25px;
  left: 0;
  margin: 0;

}
#contactWrapper.contactForm .w2 textarea {
  box-sizing: border-box;
  width: 100%;
}
#contactWrapper.contactForm .w1,  #contactWrapper.contactForm .w2{
  float:none;
  width: 90%;
}
section#contact .contactForm input.submitInput {
    width: 100%;
    box-sizing: border-box;
    margin: 3% 0 3% 0;
}

#contactWrapper p {
  margin:10px 0 10px 0;
}

section#contact .staff div p {
  width:100%;
  margin:0;
}

section#contact h2 {
  line-height:1.2em;
}


/* CASE-- */


section#work section div.leftA, section#work section div.rightA {
left:auto;
right:auto;
}

section#work section div.case {
  width:98%;
  position:relative;
  height: 194px;
}

section.caseW {
padding:0 0 20px 0;
overflow:visible;
}

.caseVideo {
  height: 194px;
}

.caseTexts {
  height: 320px;
}

.caseVideo {
  width:100%;
  top:0;
}

.case .caseTexts{
    position: absolute;
    top:0px;
    margin:0 0 0 0;
    height:auto;
    right:2px;
    left:0;
}

.case.opened  .caseTexts {
    right:2px;
    left:0;
}


section#work section div.case article .caseText {
    bottom: auto;
    position: relative;
    color:#ffffff;
    margin-top:8px;

}


section#work section div.case .caseImg img {
    height:100%;
    width:100%

}


section#work section div.case .caseVideoContainer,
section#work section div.case .caseImg {
    width:259px;
    height:145px;
  }

section#work section div.caseW {
  width:100%;
}


.leftA .closeBtn, .rightA .closeBtn {
  left:auto;
  top:auto;
  right:-17px;
  bottom:-7px;

}

section#work section div.row {
 height:auto;
 clear:both;
}


 section#work section div.case .caseContent {
  height:100%;
  position:relative;
  overflow:hidden;
}

section#work section div.case .caseVideoContainer {
    margin: 0;
    position: absolute;
    top: 39px;
    left:8px;

}



section#work section div.case article{
  width:auto;
  margin:12px 10px 8px 10px;
}



section#work section div.case {
  padding: 0 0 15px 0;
}

.video-img{
  background:url(../images/caseArrow_iPhone.png) no-repeat 50% 50%;
}




/* GRID-- */


 .w4 > div, .w4 > article, #news .w4  article, .w2 section, .w2 article section, .offices .w4 > div  {
 width:100%;
 margin:0 0 0 0;
 float:left;
}





.offices .w4 > div {
    margin: 2% 0 1% 0%;
}

.staff .w4 > div {
 width:48%;
 margin:0 0 0 1%;
 float:left;
}

/* BUTTONS- */

.pagination
{
font-size: 1.35em;
}



.showMoreBtn  {
    background-position: -40px -123px;
    right: 0px;
    bottom:10px;
}


.showLessBtn  {
    background-position:-40px -148px;
    bottom:0px;
}



#news .showMoreBtn {
      bottom:-38px;
      right:10px;

}

#work .showMoreBtn, #work .showLessBtn {
      bottom:0px;

}

#work .pagination  {
      bottom:2px;

}


.showMoreBtn, .showLessBtn  {
    height: 22px;
    padding:0px 0 0 26px;
    font-size: 1.35em;
  	letter-spacing: 0.04em;
}



section#contact .staff div p.n0, section#contact .staff div p.n1, section#contact .staff div p.n2 {
    border-bottom: none;
}

section#work section div.case article .caseText h2 {
    font-size: 1.5em;
    line-height:1.1em;
    margin:0.7em 0 0.2em 0;

}




/* HIDDEN ELEMENTS - */


.clients, .bDash, #about .w1, .boxWrap, .boxShadow, div#logo img, div#logo object  {
  display:none;
}




}


@media
only screen and (-webkit-min-device-pixel-ratio : 1.5) and (max-device-width : 620px),
only screen and (min-device-pixel-ratio : 1.5) and (max-device-width : 620px) {
/* Styles */


div#logo span img {
    display: block;
    width:100%;
}

div#logo {
   background:none;
}


}


/* iPads (landscape) ----------- */

@media only screen
and (min-width : 768px)
and (max-width : 1225px) {


.wrapper {
    width:960px;
    margin:0px 0px 20px 32px;
}

.subpage .wrapper {
    width:828px;
    margin:0px 0px 20px 32px;
}

#header, .subpage #header  {
  margin-top:28px;
}

div#logo span img {
  display:none;
}


#header header {
  margin:21px 0;
}


section#career {
  padding-bottom:30px;
}


#work section hgroup{
  margin-left:-1px;
}



section#about .clientsBrands, ul.logolist  {
   width:960px;
 }


 section#about .clientsBrands {
    height: 55px;
    margin: 12px 0;
  }

.bDash {
   margin: 10px 0 22px;
}



section#work section div.case article {
    margin: 15px 0 16px 17px;
    width: 92%;
}


nav ul li {
  letter-spacing:1px;
  font-size:45px;
}

section#news article .boxWrap {
  height:133px;
}

.newsImage {
  width:216px;
  height:124px;
}

/* CASE */
section#work section div.case .caseImg {
  width:436px;
  height:245px;
}

.video-wrapper {
  width: 436px;
}


section#work section div.row {
  height:313px;
}

section#work section div.case, section#work section div.case .caseContent  {
  height:304px;
}


.caseTexts, .caseVideo {
  width:100%;
  height:304px;
}

section#work section div.case .caseVideoContainer {
    margin: 3px 16px 0 17px;
    width: 436px;

}

section#work section div.case article h2 {
    display: inline;
    font-size: 1.6em;
    letter-spacing: 0.02em;
}

section#work section div.case article h3 {
    display: inline;
    font-size: 1.6em;
    letter-spacing: 0.02em;
}

section#work section div.case article .caseText {
    bottom: 15px;
}

section#work section div.case article .caseText p {
    font-size: 1em;
}

section#contact .contactForm  textarea,
section#contact .contactForm  input {
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0px 0px 0px ;
-moz-box-shadow: inset  0px 0px 0px;
box-shadow: inset  0px 0px 0px;
color:#767676;
}

section#contact .contactForm textarea {
    height: 148px;
}


section#contact .contactForm input.submitInput {
    background-color: #FFFFFF;
    border-radius: 0 0 0 0;
    box-shadow: 0 0 0;
    color: #000000;
    margin: 3% 0 3%;
    padding: 4% 3%;
    width: 28%;
}

section#contact .contactForm input#to {
    color: #929292;
}

.w2 section, .w2 article section  {

 margin:3% 0 0 2%;

}

.newstext{
  font-size:1.10em;
}


section#work section div.case article .caseInfo {
    overflow:hidden;
  }


section#work section div.case article .caseInfo span {
    display:block;
    clear:none;
    width:210px;

  }


section#work section div.case article .caseText h2 {
    font-size: 1.9em;
    line-height: 1.1em;
}

section#work section div.case article .caseInfo span.left {
    float: left;
    display:block;
}

section#work section div.case article .caseInfo span.right {
    float: left;
}


section#work section div.case article .caseInfo {
    padding: 1% 0;
}



/*Skuggor*/


section#news .boxShadow .shadow2 {
  background: url(../images/newsShadow2_960.png) no-repeat;
  height: 20px;
  position: absolute;
  bottom: 0px;
  width: 247px;
  opacity: 0;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
}

section#news .boxShadow .boxShadowBottom {
    height: 20px;
    width: 247px !important;
    padding:0;
    right:10px;
    left:auto;
    bottom:1px;

}

section#news .boxShadow .shadow1 {
  width:226px;
  right:10px;
}

.pagination {
font-size:17px;
	}

#news .showMoreBtn, #news .showLessBtn {
bottom:-38px;
}


.showMoreBtn, .showLessBtn {
    height: 22px;
    padding:0px 0 0 26px;

}


.showMoreBtn {
  background-position: -40px -123px ;
}

.showLessBtn {
  background-position: -40px -148px ;
}


}




/* iPads (portrait) ----------- */
@media only screen
and (min-width : 690px)
and (max-width : 768px) {

/* Styles */

.wrapper, .subpage .wrapper {
    margin:0px 0 10px 37px;
    width:690px;

}

div#logo span img {
  display:none;
}


.subpage .PDILogo {
  width: 280px;
  background-position:0px -201px;
}

.PDILogo {
  width: 254px;
  background-position:116px -201px;
  margin-bottom: 8px;
}

#header, .subpage #header {
  margin-top:34px;
}


#header header {
  margin:16px 0 14px 0;
}

.contactInformation{
  font-size:14px;
  line-height:1.4;
  margin-top:0px;
}

.contactInformation .contactAdress {
margin: 4px 0 0 0;
}


section#about .clientsBrands, ul.logolist  {
   width:690px;
 }




nav ul li {
    letter-spacing:1px;
    font-size:35px;
}

/* Grid elements -- */

#career .w2 section {
 width:98%;
 margin:0 0 0 1%;
 float:left;

}

#career .w2 p {
 width:95%;

}

 .w4 > div, .w4 > article, #news .w4 section article, .w2 section section, .w2 article section  {
 width:98%;
 margin:0 0 0 1%;
 float:left;
}

#news .w4 article, .offices .w4 > div {
 width:48%;
 margin:0 0 4% 4%;
 float:left;
}
 .offices .w4 > div {
 margin-top:1px;
}

.offices .w4 > div.first {
  margin:1px 0 0 0;
}

section#contact .staff div p {
    width: 49%;
}


 section#contact .staff div p.n2, section#contact .staff div p.n3 {
    border-top: 1px dotted #ffffff;
}

section#contact .staff div p.n2 .topLine, section#contact .staff div p.n3 .topLine {
  display:none;
}


/* Header */
section#header header #logo {
  float:left;
}
section#header header #logo, section#header header #flashContent  {
  height:130px;
  width:425px;
}

/* CASE */
section#work section div.case {
  position:relative;
  width:100%;
  height: 440px;

}


section#work section.caseW {
  padding:0 0 25px;
}

section#work section div.caseW {

  width:100%;
}

section#work section div.case .caseImg {
    height: 360px;
    width: 640px;
}

section#work section div.case.rightA .caseImg {
 margin-left:-1px;
}


.leftA .closeBtn, .rightA .closeBtn {
  left:auto;
  top:auto;
  right:-17px;
  bottom:12px;

}

section#work section div.row {
 height:auto;
 clear:both;

}


 section#work section div.case .caseContent {
  height:100%;
  position:relative;
  overflow:hidden;
}

.caseVideo {
  width:100%;
  height: 440px;
  top:0;
}

section#work section div.case .caseVideoContainer {
    margin: 0;
    position: absolute;
    top: 54px;
    width: 640px;
    height:360px;
    left:25px;

}

.video-wrapper {
    max-width: 100%;
    width: 640px;
}


section#work section div.case article h2 {
    font-size:1.8em;
}

section#work section div.case article .caseText h2 {
    font-size: 4em;
    font-weight: normal;
    line-height: 1em;
    margin: 0.4em 0 0.2em 0;

}

.caseTexts{
    position: absolute;
    padding:0 2%;
    width:96%;
    top:0px;
    margin:0 0 0 0;
    height:auto;

}

section#work section div.case article .caseText{
    bottom:auto;
    margin:0;
    position:relative;
    color:#ffffff;
    font-size:1.1em;
}

section#work section div.case article{
  width:auto;
  margin:20px 10px 20px 11px;
}


.newsImage {
    height: 183px;
    width: 320px;
}
section#news article .boxWrap {
    height: 193px;
}



section#contact .contactForm  textarea,
section#contact .contactForm  input {
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: inset 0px 0px 0px ;
-moz-box-shadow: inset  0px 0px 0px;
box-shadow: inset  0px 0px 0px;

}

section#contact .offices .w4 div.last {
padding:0 0 1em 0;
margin:0 0 2% 0%;
}

section#work section div.case article .caseText p {
    font-size: 1em;
}



.contactForm .w1 {
    width: 48%;
}

.contactForm .w2 {
    width: 48%;
}

section#contact .contactForm textarea {
  width:95%;
}

section#contact .contactForm input.submitInput {
    padding: 1% 2%;
}

.w2 section, .w2 article section  {

 margin:0;

}

header .contactInformation h1 {
  font-size:1.5em;
  margin:0 0 0.4em 0;
 }


/*News*/
section#news .news article.m2, section#news .news  article.m0,section#news .news  article.m4 ,#news .news article.m6  {
 margin-left:0;
}



/*News*/
section#career {
 padding:0 0 32px 0;
}



/*Skuggor*/

section#news .boxShadow .shadow2 {
  background: url(../images/newsShadow2_690.png) no-repeat;
  height: 20px;
  position: absolute;
  bottom: 0px;
  width: 369px;
  opacity: 0;
  right:-3px;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
}

section#news .boxShadow .boxShadowBottom {
    height: 20px;
    width: 369px !important;
    padding:0;
    right:27px;
    left:auto;
    bottom:1px;
}

section#news .boxShadow .shadow1 {
  width:331px;
  right:10px;
}





/*Buttons*/


section#about .clientsBrands {
    height: 50px;
    margin: 10px 0 6px;
}


.bDash{
  margin: 25px 0 22px;

}

section#news section.news {
    margin: 0 0 42px;
}

.pagination {
font-size:17px;

	}

#news .pagination {
font-size:17px;
bottom:-18px;
	}

#news .showMoreBtn, #news .showLessBtn {
bottom:-18px;
}

.showLessBtn, .showMoreBtn, .pagination {
    bottom: 19px;
}

.showMoreBtn, .showLessBtn {
    height: 22px;
    padding:0px 0 0 26px;

}

.showMoreBtn {
  background-position: -40px -123px ;
}

.showLessBtn {
  background-position: -40px -148px ;
}

section#contact .staff h2.staffHeading {

    margin-top: 60px;

}

}




/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1126px)
and (max-width : 1599px){



.wrapper {
    width:1200px;
    margin: 42px 0 45px 45px;
}

.pagination {
font-size:18px;
	}

#news .showMoreBtn, #news .showLessBtn {
bottom:-41px;
}

#case .pagination, #case .showMoreBtn, #case .showLessBtn {

}


section#about .clientsBrands, ul.logolist {
   width:1200px;
 }

section#about .clientsBrands {
    height: 65px;
    margin: 15px 0;
}

section#news article .boxWrap {
  height:165px;
}


.newsImage {
  width:272px;
  height:155px;
}

/* CASE */
section#work section div.case .caseImg {
  width:544px;
  height:306px;
}

.video-wrapper {
    width:544px;
}

section#work section div.row {
  height:389px;
}

section#work section div.case, section#work section div.case .caseContent {
  height:376px;
}

section#work section div.case article {
    margin:17px 15px 25px 23px;
}
.caseTexts, .caseVideo{
  height:376px;
}

section#work section div.case article .caseText {
    bottom: 18px;

}

section#work section div.case .caseVideoContainer {
    background-color: #FFFFFF;
    margin: 0px 21px 0 22px;
    width: 544px;

}

section#work section div.case article .caseText h2 {
    font-size: 2.2em;
    line-height: 1em;
    font-weight: normal;
    margin: 0.1em 0 0.3em 0;
}



/*Shadows*/

section#news .boxShadow .shadow2 {
  background: url(../images/newsShadow2_1200.png) no-repeat;
  height: 20px;
  position: absolute;
  bottom: 0px;
  width: 326px;
  opacity: 0;
  right:-10px;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
}

section#news .boxShadow .boxShadowBottom {
    height: 20px;
    width: 326px !important;
    padding:0;
    right:32px;
    left:auto;

}

section#news .boxShadow .shadow1 {
  width:282px;
  right:10px;
}





}

@media only screen
and (min-width : 1600px)  {
/* Large screens ----------- */



.wrapper {
    width:1400px; /*+1400 för border*/
  }

#header{
  margin-top:57px;
}
  /* HEADER */
#header header {
  margin:25px 0 25px 0;
}
  /* CASE */
time{
  font-size:1.9em;
  margin:;
}


h3 {
  font-size:21px;
  margin:0 0 0.5em 0;
  line-height:1.2em;
}


section#work section div.case article h2, .pagination {
font-size:19px;
display:inline;
letter-spacing:0.04em;
text-transform:uppercase;
}


section#work section div.case article h3 {
font-weight:normal;
font-size:1.8em;
display:inline;
letter-spacing:0.05em;
}


.caseVideo {
    top: 0px;
}
section#work section div.case article {
    margin: 16px 24px 23px 24px;
}

/*Skuggor*/

section#news .boxShadow .boxShadowBottom, section#news .boxShadow .boxShadowInner .shadow3  {
   width:330px;
}
/*Ljusgrå*/
 section#news .boxShadow .boxShadowBottom .shadow1  {
   right:22px;
}

/*grå*/
 section#news .boxShadow .boxShadowBottom .shadow2  {
  right:-6px;

}

section#news .boxShadow .shadow2 {
  background: url(../images/newsShadow2_1400.png) no-repeat;
  height: 20px;
  position: absolute;
  bottom: 0px;
  width: 379px;
  opacity: 0;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
}

section#news .boxShadow .boxShadowBottom {
    height: 20px;
    width: 379px !important;
    padding:0;
    right:26px;
    left:auto;

}

section#news .boxShadow .shadow1 {
  width:329px;
}

.newstext {
  padding:0 0 10px 2px;
}



/* =============================================================================
   Career section
   ========================================================================== */


section#career {
  padding-bottom:64px;
}


}



/* =============================================================================
   Non-Semantic Helper Classes
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; 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, header:before, header:after,  .mainSection:before, .mainSection:after { content: ""; display: table; }
.clearfix:after,  header:after  ,  .mainSection:after  { clear: both; }
.clearfix, header, .mainSection { *zoom: 1; }
.left {float:left;}


/* =============================================================================
   Print Styles
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { 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; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}