/*
Theme Name: Felix von Pless Design 2011
Theme URI: http://wordpress.org/
Description: Felix von Pless Design 2011 theme for Wordpress
Version: 1.0
Author: Patrick Beser
Author URI: http://patrickbeser.com/
Tags: 

*/





  @import url(http://fonts.googleapis.com/css?family=Lato);


  html, body, div, span, object, iframe, 
  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
  small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
  fieldset, form, label, legend,
  table, caption, tbody, tfoot, thead, tr, th, td,
  article, aside, canvas, details, figcaption, figure,
  footer, header, hgroup, menu, nav, section, summary,
  time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
  }

  article, aside, details, figcaption, figure,
  footer, header, hgroup, menu, nav, section {
    display: block;
  }

  blockquote, q { quotes: none; }
  blockquote:before, blockquote:after,
  q:before, q:after { content: ''; content: none; }
  ins { background-color: #ff9; color: #000; text-decoration: none; }
  mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
  del { text-decoration: line-through; }
  abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
  table { border-collapse: collapse; border-spacing: 0; }
  hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
  input, select { vertical-align: middle; }

  body { font:13px/1.231 sans-serif; *font-size:small; } 
  select, input, textarea, button { font:99% sans-serif; }
  pre, code, kbd, samp { font-family: monospace, sans-serif; }

  html { overflow-y: scroll; }
  a:hover, a:active { outline: none; }
  ul, ol { margin-left: 1em; }
  ol { list-style-type: decimal; }
  nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
  small { font-size: 85%; }
  strong, th { font-weight: bold; }
  td { vertical-align: top; }

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

  pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
  textarea { overflow: auto; }
  .ie6 legend, .ie7 legend { margin-left: -7px; } 
  input[type="radio"] { vertical-align: text-bottom; }
  input[type="checkbox"] { vertical-align: bottom; }
  .ie7 input[type="checkbox"] { vertical-align: baseline; }
  .ie6 input { vertical-align: text-bottom; }
  label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
  button, input, select, textarea { margin: 0; }
  input:valid, textarea:valid   {  }
  input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
  .no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }

  ::-moz-selection{ background: #000; color:#fff; text-shadow: none; }
  ::selection { background:#000; color:#fff; text-shadow: none; }
  a:link { -webkit-tap-highlight-color: none; }
  * { -webkit-text-size-adjust: none; }

  button {  width: auto; overflow: visible; }
  .ie7 img { -ms-interpolation-mode: bicubic; }
  a { text-decoration: none; }

/*  @font-face { 
    font-family: 'LucidaSan-Rom';
    src: url('fonts/LucidaSans/eot/style_4878.eot?#iefix') format('embedded-opentype'), url('fonts/LucidaSans/woff/style_4878.woff') format('woff'), url('fonts/LucidaSans/ttf/style_4878.ttf') format('truetype'), url('fonts/LucidaSans/svg/style_4878.svg#LucidaSan-Rom') format('svg');
  }*/








  /**  BASE FRAME  **/
  
  body {
    color: #707070;
    font-size: 14px;
    /*font-family: Georgia, Times New Roman, serif;*/
    font-family: "Fern RE";
    font-style: normal;
    font-weight: normal;
  }
  
  p em {
    font-style: italic;
  }
  
  a {
    color: inherit;
  }

  #container {
    width: 1238px;
    position: relative;
    overflow: hidden;
    margin-bottom: 90px;
  }

  #header {
    height: 101px;
    width: 1159px;
    position: relative;
    background: url(images/bg_head.gif) no-repeat 0 0;
  }
  
  #body {
    width: 1080px;
    position: relative;
    margin-left: 79px;
    float: left;
    clear: both;
    line-height: 140%;
  }
  
  #content {
    width: 100%;
    float: left;
    clear: both;
  }
  
  #footer {
    width: 1080px;
    position: relative;
    margin-left: 79px;
    padding-top: 25px;
    float: left;
    clear: both;
    border-top: 1px solid #ededee;
  }
  
  
  
  
  
  
  
  /**  HEADER  **/
  
  #header .logo {
    position: absolute;
    top: 16px;
    left: 27px;
  }
  
  #header .logo img {
    width: 294px;
  }
  
  #header .title {
    position: absolute;
    left: 79px;
    bottom: 13px;
    color: #87888a;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
  }
  
  #header .title strong {
    color: #3e3d40;
    display: block;
    font-weight: normal;
  }
  
  #header .menu-main-menu-container {
    position: absolute;
    right: 0;
    bottom: 9px;
    color: #87888a;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
  }
  
  #header #menu-main-menu {
    list-style: none;
    margin: 0;
  }
  
  #header #menu-main-menu li {
    display: block; 
    float: left;
    margin-left: 59px;
  }
  
  #header #menu-main-menu a:hover,
  #header #menu-main-menu li.current-menu-item a,
  .home #header #menu-main-menu li.menu-item-23 a,
  .category-work #header #menu-main-menu li.menu-item-23 a {
    color: #3e3d40;
  }
  
  
  
  
  
  
  
  
  
  
  /**  COLUMN SET  **/
  
  .col-set {
    width: 100%;
    float: left;
    clear: both;
    border-bottom: 1px solid #ededee;
    background: url(images/bg_col-set.gif) repeat-y 0 0;
  }
  
  .col-set a {
    text-decoration: underline;
  }
  
  .col-left {
    width: 800px;
    float: left;
    padding: 25px 20px 35px 0;
  }
  
  .col-right {
    width: 240px;
    float: left;
    padding: 25px 0 15px 20px;
  }
  
  .col-set h2 {
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    color: #3e3d40;
    margin-bottom: 10px;
    letter-spacing: 1px;
  }
  
  
  
  
  
  
  
  
  /**  CONTENT  **/
  
  .stage-image {
    padding: 20px 0;
    border-bottom: 1px solid #ededee;
  }
  
  .stage-image img {
    width: 1080px;
  }
  
  .stage {
    padding: 0;
    border-bottom: 1px solid #ededee;
    position: relative;
    width: 1080px;
    height: 573px;
    overflow: hidden;
  }
  
  .stage ul {
    position: absolute;
    top: 20px;
    left: 0;
    width: 1080px;
    height: 533px;
    overflow: hidden;
    margin: 0;
    list-style: none;
    z-index: 1;
  }
  
  .stage ul li {
    position: relative;
    float: left;
    width: 1080px;
    height: 533px;
    overflow: hidden;
  }
  
  .stage ul li img {
    width: 1080px;
  }
  
  .stage ul li.video iframe {
    width: 1080px !important;
    height: 533px !important;
  }
  
  .stage .nav {
    position: absolute;
    z-index: 11;
    left: 840px;
    bottom: 35px;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    color: #a1a1a1;
    letter-spacing: 1px;
  }
  
  .stage .nav a {
    display: block;
    float: left;
    margin-right: 10px;
  }
  
  .stage .nav a:hover,
  .stage .nav a.active {
    color: #000;
  }
  
  .stage .next {
    display: block;
    width: 360px;
    height: 533px;
    overflow: hidden;
    text-indent: -100000em;
    background: url(images/btn_next.png) no-repeat 289px 248px;
    position: absolute;
    top: 20px;
    right: 0;
    z-index: 10;
  }
  
  .stage .prev {
    display: block;
    width: 360px;
    height: 533px;
    overflow: hidden;
    text-indent: -100000em;
    background: url(images/btn_prev.png) no-repeat 34px 248px;
    position: absolute;
    top: 20px;
    left: 0;
    z-index: 10;
  }
  
  .stage .next.hidden,
  .stage .prev.hidden {
    display: none !important;
  }
  
  
  
  
  
  
  
  
  
  
  
  /**  WORK  **/
  
  .project-list {
    list-style: none;
    width: 100%;
    float: left;
    clear: both;
    margin: 0;
  }
  
  .project-list li {
    width: 240px;
    position: relative;
    float: left;
    padding: 20px 20px 0 19px;
    height: 238px;
    border: 1px solid #ededee;
    border-width: 0 1px 1px 0;
    line-height: 100%;
  }
  
  .project-list li img {
    width: 240px;
  }
  
  .project-list li.first-in-row {
    padding-left: 0;
  }
  
  .project-list li.last-in-row {
    padding-right: 0;
    border-right: 0;
  }
  
  .project-list li.last-row {
    border-bottom: 0;
  }
  
  .project-list h3 {
    padding: 10px 2px 0 2px;
  }
  
  .project-list h3 a {
    color: #87888a;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
  }
  
  .project-list h3 a span {
    color: #3e3d40;
  }
  
  .project-nav {
    float: left;
    width: 100%;
    clear: both;
    padding: 20px 0;
    text-align: center;
    color: #87888a;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    border-bottom: 1px solid #ededee;
    letter-spacing: 1px;
  }
  
  .project-nav span {
    color: #3e3d40;
  }
  
  .project-nav .prev {
    display: block;
    float: left;
    position: relative;
    text-align: left;
  }
  
  .project-nav .next {
    display: block;
    float: right;
    position: relative;
    text-align: right;
  }
  
  
  
  
  
  
  
  
  
  
  
  /**  CONTACT  **/
  
  .category-contact address {
    padding: 20px 0;
    text-align: center;
    color: #3e3d40;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    border-bottom: 1px solid #ededee;
    letter-spacing: 1px;
  }
  
  
  
  
  
  
  
  
  
  
  
  /**  FOOTER  **/
  
  #footer {
    display: none;
  }
  
  .home #footer,
  .category-work #footer {
    display: block;
  }
  
  .no-footer #footer {
    display: none;
  }
  
  #footer p {
    text-align: center;
    color: #3e3d40;
    font-size: 11px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    letter-spacing: 1px;
  }






  @media only screen and (max-device-width: 480px) {
    
    html, body, #container, #header, #body, #footer {
      width: 480px;
      margin: 0;
      overflow: hidden;
    }
    
    #header {
      height: auto;
      overflow: hidden;
    }
    
    #header .menu-main-menu-container {
      left: auto;
      right: auto;
      bottom: auto;
      position: relative;
      border: 1px solid #ededee;
      border-width: 0 0 1px 0;
      margin-bottom: 20px;      
      padding-bottom: 20px;
      font-size: 24px;
    }
    
    #header .menu-main-menu-container ul {
      overflow: hidden;
    }
    
    #header #menu-main-menu {
      text-align: center;
    }
    
    #header #menu-main-menu li {
      margin: 0;
      display: inline-block;
      padding: 0 15px;
      float: none;
    }
    
    #header .logo img {
      width: 436px;
      padding: 16px 27px;
    }
    
    #header .logo {
      position: static;
      top: auto;
      left: auto;
    }
    
    #header h1 {
      padding-bottom: 20px;
      border: 1px solid #ededee;
      border-width: 0 0 1px 0;
      position: static;
      top: auto;
      left: auto;
      margin-bottom: 20px;
    }
    
    .project-list li {
      width: 100%;
      box-sizing: border-box;
      padding: 27px !important;
      height: auto !important;
      border-width: 0 0 1px 0 !important;
    }
    
    .project-list li.last-row {
      border-bottom: 1px solid #ededee !important;
    }
    
    .project-list h3 a {
      font-size: 16px;
      line-height: 1.4;
    }
    
    .project-list li img {
      width: 100%;
    }
    
    .project-list li:last-child {
      border-bottom: 0 !important;
    }
    
    #footer {
      padding-bottom: 25px;
    }
    
    .stage {
      width: 480px;
      height: 254px;
      margin-bottom: 20px;
    }
    
    .stage ul li {
      width: 480px !important;
      height: 254px !important;
    }
    
    .stage ul li img {
      width: 480px;
    }
    
    .stage ul li.video iframe {
      width: 480px !important;
      height: 254px !important;
    }
    
    .stage .next {
      width: 240px;
      height: 234px;
      background-position: 188px 94px;
      display: block !important;
    }
    
    .stage .prev {
      width: 240px;
      height: 234px;
      background-position: 9px 94px;
      display: block !important;
    }
    
    .col-set,
    .project-nav {
      padding: 0 27px;
      box-sizing: border-box;
      float: none;
    }
    
    .col-set > div {
      margin: 0;
      float: none;
      width: 100%;
      padding: 0;
      margin-bottom: 20px;
    }
    
    .col-set {
      font-size: 16px;
      line-height: 1.4;
    }
    
    .col-set h2 {
      font-size: 16px;
    }
    
    .project-nav {
      padding: 20px 0;
      border: 0;
      font-size: 16px;
      line-height: 1.4;
    }
    
    .project-nav .next,
    .project-nav .prev {
      float: none !important;
      text-align: left;
      padding: 0 27px;
    }
    
    .project-nav .prev {
      padding-bottom: 20px;
      margin-bottom: 20px;
      border-bottom: 1px solid #ededee;
    }
    
    .project-nav .prev:last-child {
      margin-bottom: 0;
      border: 0;
      padding-bottom: 0;
    }
    
    .stage-image img {
      width: 480px;
    }
    
    .stage-image {
      margin-bottom: 20px;
    }
    
  }