/**
 * @file
 * Positioning for responsive layout .
 *
 * Define CSS classes to create a table-free, 3-column, 2-column, or single
 * column layout depending on whether blocks are enabled in the left or right
 * columns.
 *
 * This layout uses the Zen Grids plugin for Compass: http://zengrids.com
 */
/**************** Nodes ****************/
/* 1 Column Nodes*/
/* 2 Columns Nodes*/
/* 2 Columns Nodes*/
/**************** Views ****************/
/* Views 2 columns */
/* Views 2 columns zebra*/
/* Views 3 columns */
/* Views 4 columns */
/*
 * Center the page.
 */
.max-width-container, .region-bottom {
 /* For screen sizes larger than 1200px, prevent excessively long lines of text
by setting a max-width. */
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto; }

/*
 * Apply the shared properties of grid items in a single, efficient ruleset.
 */
#header,
#above_content,
#content,
#navigation,
#sub-navigation,
.region-sidebar-first,
.region-sidebar-second,
#post_content,
#post_content_2,
#post_content_3,
#footer {
  padding-left: 10px;
  padding-right: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word; }

/*
 * Containers for grid items and flow items.
 */
#header:before, #header:after,
#navigation:before,
#navigation:after,
#sub-navigation:before,
#sub-navigation:after,
#above_content:before,
#above_content:after,
#main:before,
#main:after,
#post_content:before,
#post_content:after,
#post_content_2:before,
#post_content_2:after,
#post_content_3:before,
#post_content_3:after,
#footer:before,
#footer:after {
  content: "";
  display: table; }
#header:after,
#navigation:after,
#sub-navigation:after,
#above_content:after,
#main:after,
#post_content:after,
#post_content_2:after,
#post_content_3:after,
#footer:after {
  clear: both; }

@media all and (min-width: 726px) {
  /*
   * Use 16 grid columns for larger screens.
   */
  /*
   * The layout when there is only one sidebar, the left one.
   */
  #block-fp-stocksite-branding {
    float: left;
    width: 25%;
    margin-left: 0%;
    margin-right: -25%; }

  #block-menu-block-10 {
    float: left;
    width: 50%;
    margin-left: 50%;
    margin-right: -100%; }

  .sidebar-first #content {
    /* Span 4 columns, starting in 2nd column from left. */
    float: left;
    width: 68.75%;
    margin-left: 31.25%;
    margin-right: -100%; }
  .sidebar-first .region-sidebar-first {
    /* Span 1 column, starting in 1st column from left. */
    float: left;
    width: 31.25%;
    margin-left: 0%;
    margin-right: -31.25%; }

  #post_content_3 #block-views-view-events-block {
    float: left;
    width: 31.25%;
    margin-left: 0%;
    margin-right: -31.25%; }
  #post_content_3 #block-views-view-news-block {
    float: left;
    width: 31.25%;
    margin-left: 31.25%;
    margin-right: -62.5%; }
  #post_content_3 #block-views-view-list-block, #post_content_3 #block-views-featured-story-block {
    float: left;
    width: 37.5%;
    margin-left: 62.5%;
    margin-right: -100%; }

  /*
   * The layout when there is only one sidebar, the right one.
   */
  .sidebar-second #content {
    /* Span 4 columns, starting in 1st column from left. */
    float: left;
    width: 68.75%;
    margin-left: 0%;
    margin-right: -68.75%; }
  .sidebar-second .region-sidebar-second {
    /* Span 1 column, starting in 5th column from left. */
    float: left;
    width: 31.25%;
    margin-left: 68.75%;
    margin-right: -100%; }

  /*
   * The layout when there are two sidebars.
   */
  .two-sidebars #content {
    /* Span 3 columns, starting in 2nd column from left. */
    float: left;
    width: 50%;
    margin-left: 25%;
    margin-right: -75%; }
  .two-sidebars .region-sidebar-first {
    /* Span 1 column, starting in 1st column from left. */
    float: left;
    width: 25%;
    margin-left: 0%;
    margin-right: -25%; }
  .two-sidebars .region-sidebar-second {
    /* Span 1 column, starting in 5th column from left. */
    float: left;
    width: 25%;
    margin-left: 68.75%;
    margin-right: -93.75%; }

  /*
  *Post Content
  */
  #block-views-featured-content-block .views-row-odd {
    float: left;
    width: 50%;
    margin-left: 0%;
    margin-right: -50%; }
  #block-views-featured-content-block .views-row-even {
    float: left;
    width: 50%;
    margin-left: 50%;
    margin-right: -100%; }

  /*
  * Footer 
  */
  #block-block-2 {
    float: left;
    width: 50%;
    margin-left: 0%;
    margin-right: -50%; }

  #block-webform-client-block-87,
  #block-webform-client-block-1981 {
    float: left;
    width: 50%;
    margin-left: 50%;
    margin-right: -100%;
    padding-left: 20px;
    box-sizing: border-box; }

  #block-menu-block-5 {
    float: left;
    width: 25%;
    margin-left: 0%;
    margin-right: -25%; }

  #block-menu-block-4 {
    float: left;
    width: 25%;
    margin-left: 25%;
    margin-right: -50%; } }
.field-view-reference .row {
  padding: 20px 0;
  border-top: 1px solid #EAEAEA; }
  .field-view-reference .row:before, .field-view-reference .row:after {
    content: "";
    display: table; }
  .field-view-reference .row:after {
    clear: both; }
  .field-view-reference .row .row {
    border-top: none;
    padding: 0 0 20px; }
.field-view-reference .column-half {
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: -50%; }
  .field-view-reference .column-half .views-field-field-image {
    float: left;
    width: 25%;
    margin-left: 0%;
    margin-right: -25%; }
  .field-view-reference .column-half .column-content {
    float: left;
    width: 75%;
    margin-left: 25%;
    margin-right: -100%;
    padding: 0 20px;
    box-sizing: border-box; }
.field-view-reference .no-image .column-half .column-content {
  float: left;
  width: 100%;
  margin-left: 0%;
  margin-right: -100%; }
.field-view-reference .views-field-view {
  float: left;
  width: 50%;
  margin-left: 50%;
  margin-right: -100%; }

.views-3-column .row, .views-4-column .row {
  box-sizing: border-box;
  border-top: none;
  float: left;
  height: auto;
  padding: 10px;
  position: relative;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box; }
  .views-3-column .row:hover img, .views-4-column .row:hover img {
    border: none;
    filter: gray;
    -webkit-filter: grayscale(100%);
    transition: filter 0.5s ease-in-out,-webkit-filter 0.5s ease-in-out; }
.views-3-column h3, .views-4-column h3 {
  border-bottom: 1px solid #EAEAEA;
  clear: left;
  font-size: 1.5em;
  margin-bottom: 5px;
  padding: 10px 0 5px; }
.views-3-column .field-image, .views-4-column .field-image {
  line-height: 0;
  filter: grayscale(0); }
.views-3-column .group-info, .views-4-column .group-info {
  font-size: 0.9em; }
.views-3-column div.read-more-link, .views-4-column div.read-more-link {
  position: absolute;
  top: 40%;
  text-align: center;
  width: 100%;
  opacity: 0; }
  .views-3-column div.read-more-link a, .views-4-column div.read-more-link a {
    background: #5770ee;
    color: #FFF;
    display: inline-block;
    padding: 2px 5px; }
    .views-3-column div.read-more-link a:hover, .views-4-column div.read-more-link a:hover {
      background: #34343D; }
.views-3-column .row:hover div.read-more-link, .views-4-column .row:hover div.read-more-link {
  top: 50%;
  opacity: 100;
  transition: opacity 0.5s ease-in-out,top 0.5s ease-in-out; }

.view-single-column .row {
  overflow: hidden;
  *zoom: 1;
  margin-bottom: 15px;
  background: white;
  border: 1px solid #dedede;
  padding: 10px;
  border-radius: 4px; }
.view-single-column .views-row-odd .field-image {
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: -50%;
  line-height: 0; }
.view-single-column .views-row-odd .content-fields {
  box-sizing: border-box;
  padding: 10px;
  float: left;
  width: 50%;
  margin-left: 50%;
  margin-right: -100%; }
.view-single-column .views-row-even .field-image {
  float: left;
  width: 50%;
  margin-left: 50%;
  margin-right: -100%;
  line-height: 0; }
.view-single-column .views-row-even .content-fields {
  box-sizing: border-box;
  padding: 10px;
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: -50%; }

.views-4-column .row {
  width: 25%; }

.views-3-column .row {
  width: 33.3333%; }

.view-slideshow-overlay-tabs .skin-default .flex-caption {
  top: 30px;
  left: 0;
  margin-left: auto;
  margin-right: auto;
  max-width: 1140px;
  right: 0;
  position: absolute;
  height: 0;
  overflow: visible; }

.grid-wrapper {
  max-width: 1140px;
  margin-left: auto;
  margin-right: auto;
  position: relative; }

.grid-within-grid {
  float: left;
  width: 31.25%;
  margin-left: 68.75%;
  margin-right: -100%; }

.view-slideshow-overlay-tabs .edit-link {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 9999; }

.views-two-columns-zebra {
  clear: left; }
  @media all and (min-width: 726px) {
    .views-two-columns-zebra .views-column {
      margin-bottom: 15px; }
    .views-two-columns-zebra .views-row-odd {
      clear: left; }
      .views-two-columns-zebra .views-row-odd .column-1 {
        float: left;
        width: 43.75%;
        margin-left: 0%;
        margin-right: -43.75%; }
        .views-two-columns-zebra .views-row-odd .column-1 .field-image {
          margin: 0 20px 0 0; }
      .views-two-columns-zebra .views-row-odd .column-2 {
        float: left;
        width: 56.25%;
        margin-left: 43.75%;
        margin-right: -100%; }
    .views-two-columns-zebra .views-row-even {
      clear: left; }
      .views-two-columns-zebra .views-row-even .column-2 {
        float: left;
        width: 56.25%;
        margin-left: 0%;
        margin-right: -56.25%; }
      .views-two-columns-zebra .views-row-even .column-1 {
        float: left;
        width: 43.75%;
        margin-left: 56.25%;
        margin-right: -100%; }
        .views-two-columns-zebra .views-row-even .column-1 .field-image {
          margin: 0 0 0 20px; } }
  @media all and (max-width: 810px) {
    .views-two-columns-zebra .views-row-odd {
      clear: left; }
      .views-two-columns-zebra .views-row-odd .column-1 {
        float: left;
        width: 50%;
        margin-left: 0%;
        margin-right: -50%; }
        .views-two-columns-zebra .views-row-odd .column-1 .field-image {
          margin: 0 20px 0 0; }
      .views-two-columns-zebra .views-row-odd .column-2 {
        float: left;
        width: 50%;
        margin-left: 50%;
        margin-right: -100%; }
    .views-two-columns-zebra .views-row-even {
      clear: left; }
      .views-two-columns-zebra .views-row-even .column-2 {
        float: left;
        width: 50%;
        margin-left: 0%;
        margin-right: -50%; }
      .views-two-columns-zebra .views-row-even .column-1 {
        float: left;
        width: 50%;
        margin-left: 50%;
        margin-right: -100%; }
        .views-two-columns-zebra .views-row-even .column-1 .field-image {
          margin: 0 0 0 20px; } }
  @media all and (max-width: 725px) {
    .views-two-columns-zebra .field-image .teaser-image {
      margin-bottom: 20px; }
    .views-two-columns-zebra .views-row-even .column-2, .views-two-columns-zebra .views-row-even .column-1, .views-two-columns-zebra .views-row-odd .column-2, .views-two-columns-zebra .views-row-odd .column-1 {
      float: left;
      width: 100%;
      margin-left: 0%;
      margin-right: -100%;
      clear: left; }
      .views-two-columns-zebra .views-row-even .column-2 .field-image, .views-two-columns-zebra .views-row-even .column-1 .field-image, .views-two-columns-zebra .views-row-odd .column-2 .field-image, .views-two-columns-zebra .views-row-odd .column-1 .field-image {
        margin: 0 0 15px 0; } }

.two-columns-5-11 .field-image {
  margin: 0 20px 0 0; }
.two-columns-5-11 .field-image .teaser-image {
  width: 100%; }
.two-columns-5-11 .column-5 {
  float: left;
  width: 31.25%;
  margin-left: 0%;
  margin-right: -31.25%;
  clear: left; }
  @media all and (max-width: 480px) {
    .two-columns-5-11 .column-5 {
      float: left;
      width: 100%;
      margin-left: 0%;
      margin-right: -100%; }
      .two-columns-5-11 .column-5 .field-image .teaser-image {
        margin: 0 0 20px 0; } }
.two-columns-5-11 .column-11 {
  float: left;
  width: 68.75%;
  margin-left: 31.25%;
  margin-right: -100%; }
  @media all and (max-width: 480px) {
    .two-columns-5-11 .column-11 {
      float: left;
      width: 100%;
      margin-left: 0%;
      margin-right: -100%;
      clear: left; } }

.two-columns-5-11 .no-page-image .column-11 {
  float: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0; }

.field-view-reference .two-columns-5-11 .no-page-image .column-11 {
  float: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0; }

.two-columns-8-8 .views-column {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Firefox */
  border-top: none; }
.two-columns-8-8 .column-1 {
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: -50%;
  clear: left;
  padding: 15px 15px 15px 0; }
.two-columns-8-8 .column-2 {
  float: left;
  width: 50%;
  margin-left: 50%;
  margin-right: -100%;
  padding: 15px 0 15px 15px; }
@media all and (max-width: 810px) {
  .two-columns-8-8 .column-1 {
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-right: -100%;
    clear: left;
    padding: 15px 0; }
  .two-columns-8-8 .column-2 {
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-right: -100%;
    clear: left;
    padding: 15px 0; } }
@media all and (max-width: 480px) {
  .two-columns-8-8 .views-column {
    border-top: 1px dotted #ddd; }
  .two-columns-8-8 .page-image {
    display: none; } }

@media all and (min-width: 726px) {
  .views-column-2 {
    clear: left; }
    .views-column-2 .views-column {
      margin-bottom: 15px; }
    .views-column-2 .column-1 {
      float: left;
      width: 50%;
      margin-left: 0%;
      margin-right: -50%;
      clear: left; }
      .views-column-2 .column-1 .node-teaser {
        margin-right: 10px; }
    .views-column-2 .column-2 {
      float: left;
      width: 50%;
      margin-left: 50%;
      margin-right: -100%; }
      .views-column-2 .column-2 .node-teaser {
        margin-left: 10px; } }
@media all and (max-width: 725px) {
  .views-column-2 .views-column {
    border-top: 1px solid #EAEAEA;
    padding: 25px 0; } }
.views-column-3 {
  clear: left; }
  .views-column-3 .views-column {
    margin-bottom: 15px; }
  .views-column-3 .field-image img {
    width: 100%; }
  @media all and (min-width: 726px) {
    .views-column-3 .column-1 {
      float: left;
      width: 25%;
      margin-left: 0%;
      margin-right: -25%;
      clear: left; }
    .views-column-3 .column-2 {
      float: left;
      width: 25%;
      margin-left: 25%;
      margin-right: -50%; }
    .views-column-3 .column-3 {
      float: left;
      width: 25%;
      margin-left: 50%;
      margin-right: -75%; } }
  @media all and (max-width: 810px) {
    .views-column-3 .column-1 {
      float: left;
      width: 37.5%;
      margin-left: 0%;
      margin-right: -37.5%;
      clear: left; }
    .views-column-3 .column-2 {
      float: left;
      width: 37.5%;
      margin-left: 37.5%;
      margin-right: -75%; }
    .views-column-3 .column-3 {
      float: left;
      width: 75%;
      margin-left: 0%;
      margin-right: -75%;
      clear: left; } }
  @media all and (max-width: 725px) {
    .views-column-3 .column-1 {
      float: left;
      width: 75%;
      margin-left: 0%;
      margin-right: -75%;
      clear: left; }
    .views-column-3 .column-2 {
      float: left;
      width: 75%;
      margin-left: 0%;
      margin-right: -75%;
      clear: left; }
    .views-column-3 .column-3 {
      float: left;
      width: 75%;
      margin-left: 0%;
      margin-right: -75%;
      clear: left; } }

.views-column-4 {
  clear: left; }
  .views-column-4 .views-column {
    margin-bottom: 15px; }
  .views-column-4 .field-image .teaser-image {
    width: 100%; }
  .views-column-4 .column-1 {
    float: left;
    width: 25%;
    margin-left: 0%;
    margin-right: -25%;
    clear: left; }
  .views-column-4 .column-2 {
    float: left;
    width: 25%;
    margin-left: 25%;
    margin-right: -50%; }
  .views-column-4 .column-3 {
    float: left;
    width: 25%;
    margin-left: 50%;
    margin-right: -75%; }
  .views-column-4 .column-4 {
    float: left;
    width: 25%;
    margin-left: 75%;
    margin-right: -100%; }
  @media all and (max-width: 810px) {
    .views-column-4 .column-1 {
      float: left;
      width: 50%;
      margin-left: 0%;
      margin-right: -50%;
      clear: left; }
    .views-column-4 .column-2 {
      float: left;
      width: 50%;
      margin-left: 50%;
      margin-right: -100%; }
    .views-column-4 .column-3 {
      float: left;
      width: 50%;
      margin-left: 0%;
      margin-right: -50%;
      clear: left; }
    .views-column-4 .column-4 {
      float: left;
      width: 50%;
      margin-left: 50%;
      margin-right: -100%; } }
