@charset "UTF-8";
/* CSS Document */

/**
 * Theme Name: Tino custom theme
 * Template: hybrid
 * 
 * Text color 1           #333
 * Links (normal, hover)  #d0222b, #000
 * Nav (normal, hover)    #000, #999
 */

/**
* Import pre-made styles from Hybrid
************************************************/

/* Eric Meyer's reset.css */
  /* @import url('/wp-content/themes/hybrid/library/css/reset.css'); */

/* 18px, 20px, 21px, 22px, 24px or 25px margins and line-height (don't use reset.css with these) */
  /* @import url('/wp-content/themes/hybrid/library/css/18px.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/20px.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/21px.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/22px.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/24px.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/25px.css'); */

/* Layout */
  /* @import url('/wp-content/themes/hybrid/library/css/2c-l-fixed.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/2c-r-fixed.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/3c-l-fixed.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/3c-r-fixed.css'); */
  /* @import url('/wp-content/themes/hybrid/library/css/3c-c-fixed.css'); */

/* Plugins CSS */
  /* @import url('/wp-content/themes/hybrid/library/css/plugins.css'); */

/* Drop-downs CSS */
  /* @import url('/wp-content/themes/hybrid/library/css/drop-downs.css'); */

/* Hybrid's default CSS */
  /* @import url('/wp-content/themes/hybrid/library/css/screen.css'); */

/**
* Body
************************************************/

/* Contains everything */
html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}
body {
  background: #FFF;
}

  /* Wrapper for everything inside of the body */
  #body-container {
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto;
  }
  .js #body-container {
    moz-opacity: .0;
    -ms-filter: alpha(opacity=0);
    filter: alpha(opacity=0);
    opacity: 0;
  }

/**
* Elements
************************************************/

/* All text */
div, span, p, ul, li, h1, h2, h3, h4, h5, h6 {
  font-family: Helvetica, Arial, sans-serif;
}
div, span, p {
  font-size: 10pt;
  color: #666;
  line-height: 1.2em;
}

/* Hyperlinks */
a, a:link, a:visited {
  color: #0066ff;
  text-decoration: underline;
  opacity: 0.8;
	filter: alpha(opacity=80);
 	-webkit-transition: opacity .08s linear;
		
}
a:hover, a:active {
  color: #0066ff;
  text-decoration: none;
opacity: 1.0;
	filter: alpha(opacity=100);
 	-webkit-transition: opacity .08s linear;
		
}

/* Headers */
h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}

/* Text elements */
strong {}
em {}
cite {}
abbr {}
acronym {}
sup {}
sub {}
address {}
ins {}
dfn {}
del {}

/* Paragraphs */
p {}

/* Unordered lists */
ul {
  padding: 0;
}
  ul li {}

/* Ordered lists */
ol {}
  ol li {}

/* Defition lists */
dl {}
  dt {}
  dd {}

/* Blockquotes */
blockquote {}
  blockquote blockquote {}
  blockquote em {}

/* Object */
object {}

/* Code */
code {}
pre {}
pre code {}

/* Tables */
table {}
  caption {}
  tr {}
  th {}
  td {}

/* Forms */
form {}
  textarea {}
  input {}
  label {}
  option {}

/* Notes */
.note {}

/* Warnings/Alerts */
.warning, .alert {}

/* Errors */
.error {}

/* Downloads */
.download {}

/* Alignment */
.left, .alignleft {}
.right, .alignright {}
.center, .aligncenter {}
.block, .alignnone {}
.clear {
  clear: both;
}

/**
* Images
************************************************/

/* Normal images */
img {
  border: 0; /* IE lives in 1995 */
}
a img {
  border: 0; /* IE lives in 1995 */
}

/* WP Smilies */
img.wp-smiley {}

/* Thumbnails */
.thumbnail {}

/* WP Captions [caption] */
.wp-caption {}
  .wp-caption img {}
  .wp-caption p {}

/* Gallery [gallery] */
.gallery {}
  .gallery img {}

/* Avatars */
.avatar {}

/**
* Header
************************************************/

/* Contains entire header */
#header-container {
  z-index: 1;
  height: 140px;
  border-bottom: 1px solid #A7A7A7;
  margin: 0 40px 30px 40px;
  background: url('/wp-content/themes/tino/images/dodad_small.png') bottom right no-repeat;
}
.page-template-template-splash #header-container {
  height: 140px;
  border-bottom: 1px solid #999;
  background: url('/wp-content/themes/tino/images/dodad_small_splash.png') bottom right no-repeat;
}

  /* Contains site title and tagline */
  #header {}

    /* Site title */
    #site-title {
      display: none;
    }
      #site-title a {}
        #site-title a span {}

    /* Site description/tagline */
    #site-description {}

/**
* Primary Menu
************************************************/

/* Wrapper for entire menu area */
#primary-menu{
  z-index: 1;
  position: absolute;
  width: 215px;
  margin: 0 0 0 14px;
  padding: 0;
}

  #primary-menu div.menu {}

    /* Menu list. */
    #primary-menu ul {
      list-style: none;
      margin: 0;
      padding-top: 0;
      margin: 0 0 0 40px;
    }
    .singular-page #primary-menu ul {}
    
	#menu-topnav {margin-left:30px !important;}

    #secondary-menu ul {}
    .singular-page #secondary-menu ul {}
    
      .menu-container li {
        height: 35px;
      }
      .menu-container li#menu-item-1290 {
        height: 70px !important;
      }
        .menu-container .menu li a, .menu-container .menu li a:link, .menu-container .menu li a:visited {
          font-size: 10pt;
          color: #777;
          text-decoration: none;
          text-transform: uppercase;
        }
        .menu-container .menu li a:active {
          color: #333;
        }

        .menu-container .menu li.current_page_item a, .menu-container .menu li.current_page_item a:link, .menu-container .menu li.current_page_item a:visited, .menu-container .menu li.current_page_item a:hover, .menu-container .menu li.current_page_item a:active {
          color: #333;
        }

/**
* Containers below the header and navigation
************************************************/

/* Wrapper for the content and primary/secondary widget sections */
#container {}

  /**
  * Content
  ************************************************/

  /* Contains site's main content */
  #content {
    padding: 0 20px 220px 20px;
    z-index: 1;
  }

    /* Breadcrumb trail */
    .breadcrumb {
      display: none;
    }
      .breadcrumb-trail {}

    /* Archive and search <div> before posts are listed */
    .archive-info
    .author-info {}
    .term-info
    .category-info {}
    .tag-info {}
    .date-info {}
    .search-info {}

      /* Archive and search page titles. */
      .archive-title
      .author-title {}
      .term-title {}
      .category-title {}
      .tag-title {}
      .date-title {}
      .search-title {}

    /* Entry wrapper <div> */
    .hentry {}
    .post {}
    .page {}

      /* Post, page, and 404 page titles */
      .entry-title {
        display: none;
      }
      .post-title {}
      .page-title {
        display: none;
      }
      .attachment-title {}
      .error-404-title {}

      /* Author and date byline */
      .byline {}

      /* Full entries */
      .entry-content {
        height: 100%;
        min-width: 1024px;
        /* max-width: 1450px; */
        position: relative;
      }
        /* Content Panels */
        #left_panel {
          /* background: url('/wp-content/themes/tino/images/panel_background.png') bottom right no-repeat; */
          background: transparent;
          width: 215px;
          float: left;
          height: 540px;
          margin-left: 20px;
          margin-right: 53px;
          position: relative;
        }
        /* 
        .page-template-template-commercials #left_panel {
          background: transparent;
        }
        */
        #left_panel_project {
          background: url('/wp-content/themes/tino/images/project_panel_background.png') bottom right no-repeat;
          width: 215px;
          float: left;
          height: 600px;
          margin-left: 20px;
          margin-right: 53px;
          position: relative;
        }
        #left_panel_project , #left_panel_project p{
          color: #c2c2c2;
          font-size: 9pt;
        }
        #left_panel_project h2 {
          font-size: 20pt;
          font-weight: normal;
          margin: 0 0 40px -20px;
        }
        #left_panel_project strong {
          color: #fff;
          font-weight: normal;
        }
        #right_panel, #right_panel_project {
          float: left;
          width: 70%;
          min-width: 730px;
          position: relative;
        }
        #right_panel_project {
          width: 1216px;
        }
          .right_panel_item {
            float: left;
            width: 33%;
          }
          .right_panel_item h3 {
            color: #777777;
            font-size: 9pt;
            font-weight: normal;
            margin-top: 3px;
            margin-bottom: 0;
          }
          .right_panel_item_inner {
            width: 330px;
            height: 225px;
          }
          .right_panel_item_inner.last {
            margin-right: 0px;
          }

      /* Excerpts (introduced) */
      .entry-summary {}

        /* Using <!--nextpage--> */
        p.page-links a {}

        /* More link <!--more--> */
        a.more-link {}

      /* Entry metadata */
      .entry-meta {}

    /* Post series */
    .series {} 
      .series-title {}

    /* Navigation links */
    .navigation-links {}
      .navigation-links .previous {}
      .navigation-links .next {}

    /* WP PageNavi (plugin) */
    .wp-pagenavi {}
      .wp-pagenavi .pages {}
      .wp-pagenavi .current {}
      .wp-pagenavi .extend {}
      .wp-pagenavi a {}

    /* Attachment image navigation */
    .navigation-attachment {}

    /**
    * Comments template
    ************************************************/

    /* Wrapper for entire comments area */
    #comments-template {
      display: none;
    }

      /* Comments section headers/titles */
      .comments-header {}
      #comments-number {}

      /* Comments closed paragraph */
      p.comments-closed {}

        /* Main comments section */
        #comments {}
          #comments ol {}

            /* Individual comments (note that WordPress has even/odd backwards) */
            #comments li {}
              #comments li li {}
                #comments li li li {}
                  #comments li li li li {}
            #comments li.even {}
            #comments li.odd {}
            #comments li.thread-even {}
            #comments li.thread-odd {}
            #comments li.author {}
            #comments li.trackback {}
            #comments li.pingback {}

              /* Comment avatars */
              #comments .avatar {}

              /* Comment metadata */
              #comments .comment-meta {}
                #comments .comment-meta cite {}

              /* Comment text */
              #comments .comment-text {}

          /* Paged comments navigation */
          #comments-template .paged-navigation {}
            #comments-template .paged-navigation .page-numbers {}
            #comments-template .paged-navigation .next {}
            #comments-template .paged-navigation .prev {}

        /* Main comment form div */
        #respond {}

          /* Comment form title */
          #reply {}

          /* Comment form elements */
          p#cancel-comment-reply {}
          #respond form {}
            #respond .form-author {}
              #respond input {}
            #respond .form-email {}
            #respond .form-url {}
            #respond .form-textarea {}
              #respond textarea {}
            #respond #submit {}
              #respond #submit:hover {}

    /**
    * Utility widget sections (see other widget code below)
    ************************************************/

    /* All utility widget sections (except widgets template) */
    .utility {}

    /* Before content */
    #utility-before-content {}

    /* After content */
    #utility-after-content {}

    /* After post but before comments */
    #utility-after-single {}

    /* After page but before comments */
    #utility-after-page {}

    /* Widgets page template widgets */
    .page-template-widgets #content .widget {}

  /**
  * Widget sections (Primary and Secondary)
  ************************************************/

  /* Widgets in general */
  .widget {}
    .widget-inside {}
      .widget-title {}

  /* Primary widget section */
  #primary {}
    #primary .widget {}
      #primary .widget-inside {}
        #primary .widget-title {}
        #primary .widget ul {}
          #primary .widget ul li {}

  /* Secondary widget section */
  #secondary {}
    #secondary .widget {}
      #secondary .widget-inside {}
        #secondary .widget-title {}
        #secondary .widget ul {}
          #secondary .widget ul li {}

/**
* Footer
************************************************/

/* Wrapper for the entire footer */
#footer-container {
  position: absolute;
  top: 680px;
  width: 100%;
  height: 90px;
  z-index: 1;
}
.page-template-template-splash #footer-container {
  bottom: 30px;
}
  #footer {
    position: absolute;
    width: 100%;
    height: 90px;
    margin: 0;
    border-top: 1px solid #A7A7A7;
    border-bottom: 1px solid #A7A7A7;
    background: url('/wp-content/themes/tino/images/dodad_large.png') bottom right no-repeat;
  }
  .page-template-template-splash #footer {
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    background: url('/wp-content/themes/tino/images/dodad_large_splash.png') bottom right no-repeat;
  }

  /* Subsidiary widget section */
  #subsidiary {}
    #subsidiary .widget {}
      #subsidiary .widget-inside {}
        #subsidiary .widget-title {}

  /* Footer section */
  #footer {}

    /* Footer extra */
    #footer .copyright {}
    #footer .credit {}
    
/**
* Special
************************************************/

.hidden {
  display: none;
}

/* Edit link */
.edit {
  display: none;
}
#background_container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
 moz-opacity: .09!important;
-ms-filter: alpha(opacity=09)!important;
filter: alpha(opacity=09)!important;
opacity: 0.09 !important;
}

img.bg {
  /* min-height: 100%; */
  /* min-width: 1024px; */
  /* width: 100%; */
  height: 100%;
  min-width: 1024px;
  width: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
}
#logo_link, #logo_link_splash {
  position: absolute;
  display: block;
  width: 730px;
  height: 150px;
  top: -10px;
  left: 28px;
  z-index: 2;
}
#logo_link {
  width: 730px;
  height: 140px;
}
.splash_panel {
  width: 200px; /* 215 w/padding */
  padding: 10px;
  background: url('/wp-content/themes/tino/images/splash_panel_background.png') bottom right no-repeat;
  position: absolute;
  color: #fff;
  font-size: 8pt;
  line-height: 1.4em;
  z-index: 3;
}
.splash_panel h2 {
  font-weight: normal;
  font-size: 8pt;
  text-transform: uppercase;
  margin: 0 0 15px 0;
  padding: 0;
}
.splash_panel a, .splash_panel a:link, .splash_panel a:visited {
  color: #fff;
  text-decoration: none;
}
.splash_panel a:hover, .splash_panel a:active {
  text-decoration: underline;
}
#splash_panel_three a {
  display: block;
  height: 25px;
  line-height: 25px;
  padding-left: 30px;
  width: 100%;
  background: url('/wp-content/themes/tino/images/splash_three_link.png') no-repeat;
}
.ui-draggable-dragging { background: #cdcdcd; }
.draggable:hover { cursor: move; }

/* Splash Page */
body.page-template-template-splash {
 background: #fff;
 min-height: 0;
 overflow: hidden;
}
.page-template-template-splash .menu li {
  display: none;
}
#splash_panel_one {
  top: 395px;
  left: 650px;
  height: 206px;
  background: url('/wp-content/themes/tino/images/splash_panel_background.png') bottom right no-repeat;
}
#splash_panel_one .more_link {
  position: absolute;
  left: 8px;
  bottom: 8px;
}
#splash_panel_two {
  top: 545px;
  left: 920px;
  height: 298px;
  background: url('/wp-content/themes/tino/images/splash_panel_background.png') bottom right no-repeat;
}
#splash_panel_three {
  top: 450px;
  left: 1120px;
  height: 180px;
  width: 265px;
  background: url('/wp-content/themes/tino/images/splash_panel_background.png') bottom right no-repeat;
}
#splash_panel_three a.biglink {
 display: block;
 width: 130px;
 height: 35px;
 padding-left: 70px;
 font-size: 9pt;
 font-weight: bold;
 line-height: 35px;
}
#prevslide {
  left: 40px !important;
}
#nextslide {
  right: 55px !important;
}

/* Project Detail Page */
#project_thumbnails {
  position: absolute;
  bottom: 0;
  margin-left: 5px;
  margin-bottom: 40px;
  width: 205px;
  color: #c2c2c2;
}
.project_thumb {
  width: 64px; /* 53 */
  height: 36px; /* 35 */
  margin-right: 6px;
  margin-bottom: 6px;
  float: left;
  cursor: pointer;
}
.project_thumb.last {
  margin-right: 0;
}
#video_container {
  width: 736px; /* 16:9 ratio */
  height: 564px; /* +150px for info text */
  margin: 0 auto;
  padding-left: 10px;
  overflow: hidden;
  position: relative;
}
.video {
  width: auto; 
  height: auto;
  margin: 0 auto;
  position: absolute;
  z-index: 1;
}
.video_info {
  position: relative;
  padding-top: 3px;
}
.video_info {
  color: #000;
  font-size: 10pt;
}
.video_info p {
  color: #666;
  font-size: 10pt;
}
.video.active {
  display: block;
}
a.video_arrow {
  display: block;
  width: 50px;
  height: 65px;
  cursor: pointer;
  position: absolute;
  top: 35%;
}
a.full_screen_link {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 110px;
  height: 30px;
  background: url('/wp-content/themes/tino/images/fullscreen.png') no-repeat;
  cursor: pointer;
}
#video_arrow_left {
  background: url('/wp-content/themes/tino/images/arrow_left.png') no-repeat;
  left: -50px;
  opacity:0.8;
}
#video_arrow_right {
  background: url('/wp-content/themes/tino/images/arrow_right.png') no-repeat;
  right: -70px;
  opacity:0.8;
}
#video_arrow_left:hover {
  background: url('/wp-content/themes/tino/images/arrow_left.png') no-repeat;
  left: -50px;
  opacity:1.0;
}
#video_arrow_right:hover {
  background: url('/wp-content/themes/tino/images/arrow_right.png') no-repeat;
  right: -70px;
  opacity:1.0;
}

/* Contact Page */
.content_box {
  max-width: 320px;
  height: 125px;
  margin: 165px 20px 0 0;
  background: url('/wp-content/themes/tino/images/content_box.png') bottom right no-repeat;
  float: left;
}
#content_box_contact {
  width: 23%;
}
#content_box_one {
  width: 23%;
}
#content_box_two {
  width: 23%;
}
#content_box_three {
  width: 23%;
}
.content_box h3 {
  margin: 0 0 20px 0;
}
.content_box, .content_box h3, .content_box a {
  color: #999999;
  font-size: 10pt;
  letter-spacing: 0;
  text-decoration: none;
  font-weight: normal;
}

/* Archive Page */
#archive_links {
  position: absolute;
  /*
  top: 500px;
  width: 736px;
  */
  top: 510px;
  left: 0;
  width: auto;
  z-index: 3;
}
#archive_links a {
  display: block;
  width: 280px;
  height: 40px;
  line-height: 37px;
  background: url('/wp-content/themes/tino/images/panel_background.png') no-repeat scroll right bottom transparent;
  margin: 15px auto 0 auto;
  color: #999999;
  font-size: 10pt;
  letter-spacing:0;
  text-decoration: none;
  font-weight: normal;
}
#archive_links a.smallicon {
  background: url('/wp-content/themes/tino/images/panel_background_small.png') no-repeat scroll right bottom transparent;
}
#archive_links a:hover, #archive_links a.current {
  color: #666;
}

/* About Page */
.about_box {
  margin-top: 31px;
  width: 600px;
}
#about_bio {
  width: 600px;
}
#about_bio p {
  font-size: 10pt !important;
  margin-top: 0 !important;
}
#about_bio h3 {
  font-size: 12pt;
  font-weight: normal;
  margin: 40px 0 6px 0;
}
#about_links {
  position: absolute;
  top: 500px;
  width: 736px;
  z-index: 3;
}
#about_links a {
  display: block;
  width: 26%;
  height: 40px;
  line-height: 37px;
  background: url('/wp-content/themes/tino/images/content_box.png') bottom right no-repeat;
  float: left;
  color: #999999;
  font-size: 10pt;
  letter-spacing:0;
  text-decoration: none;
  font-weight: normal;
}
#about_links a:hover, #about_links a.current {
  color: #666;
}
#about_links a#project_list_link, #about_links a#project_list_link {
  text-align: right;
  padding-right: 12%;
  width: 21%;
}

/* QueryLoader */
#qLoverlay {
  background-color: #000000;
  z-index: 999999;
}
#qLbar {
  top: 140px !important;
  background-color: #CCCCCC !important;
  height: 1px !important;
  margin-left: 40px !important;
}
#qLpercentage {
  font-size: 10pt !important;
  top: 100px !important;
  margin-top: 0px !important;
}