/*******************************************************************************
 * _layout.scss
 *
 * Styling of the "simple" layout demonstrating the Compass grid extension Susy
 * and building mobile first layouts.
 ******************************************************************************/
.container {
  *zoom: 1;
  max-width: 1208px;
  max-width: 92.92308rem;
  _width: 1208px;
  padding-left: 56px;
  padding-left: 4.30769rem;
  padding-right: 56px;
  padding-right: 4.30769rem;
  margin-left: auto;
  margin-right: auto;
}
.container:after {
  content: "";
  display: table;
  clear: both;
}

/*%header-box{
	line-height: 92px;
	height: 92px;
}*/
/* Header */
/* Content Area */
.l-region--help {
  margin-bottom: 20px;
}

/* Footer */
/** mobile portrait view **/
@media (min-width: 300px) {
  .container {
    max-width: 1208px;
    max-width: 92.92308rem;
  }

  /* COLUMNS - Making all columns Fullwidth */
  .col,
  .l-content,
  .l-region--sidebar-first,
  .l-region--sidebar-second {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    clear: none;
  }
}
/** mobile landscape view **/
/** tablet view **/
@media (min-width: 768px) {
  .l-region--sidebar-first:after,
  .l-region--sidebar-second:before,
  .l-content:before,
  .l-content:after {
    display: none;
    position: absolute;
    top: 30px;
    width: 1px;
    bottom: 30px;
    content: "";
    border-right-width: 1px;
    border-right-style: solid;
    height: auto;
  }

  /* Sidebars */
  .has-sidebar-first .l-content {
    width: 74.65347%;
    float: right;
    margin-right: 0;
    padding-left: 60px;
    width: 75%;
    margin: 0;
  }
  .has-sidebar-first .l-content:before {
    display: block;
    left: 19px;
  }
  .has-sidebar-first .l-region--sidebar-first {
    width: 23.9604%;
    float: left;
    margin-right: 1.38614%;
    width: 25%;
    margin: 0;
    padding-right: 20px;
  }
  .has-sidebar-first .l-region--sidebar-first:after {
    display: block;
    right: -21px;
  }

  .has-sidebar-second .l-content {
    width: 74.65347%;
    float: left;
    margin-right: 1.38614%;
    padding-right: 60px;
    width: 75%;
    margin: 0;
  }
  .has-sidebar-second .l-content:after {
    display: block;
    right: 20px;
  }
  .has-sidebar-second .l-region--sidebar-second {
    width: 23.9604%;
    float: right;
    margin-right: 0;
    width: 25%;
    margin: 0;
    clear: none;
    padding-left: 20px;
  }
  .has-sidebar-second .l-region--sidebar-second:before {
    display: block;
    left: -22px !important;
  }

  .has-two-sidebars .l-content {
    width: 50%;
    margin: 0;
    width: 49.30693%;
    float: left;
    margin-right: 1.38614%;
    margin-left: 25.34653%;
    margin-left: 25%;
  }
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 23.9604%;
    float: left;
    margin-right: 1.38614%;
    width: 25%;
    margin: 0;
  }
  .has-two-sidebars .l-region--sidebar-first {
    margin-left: -76.0396%;
    margin-left: -75%;
  }
  .has-two-sidebars .l-region--sidebar-second {
    float: right;
    margin-right: 0;
    clear: none;
  }
}
/** tablet view **/
/** desk view **/
