/* 
    Created on : Jan 15, 2015, 4:15:56 PM
    Author     : raru
*/
/*******************************************************************************
 * animation_nation.layout.scss
 *
 * Styling of the "Animation Nation" layout.
 ******************************************************************************/
html {
  font-family: Verdana, Tahoma , sans-serif; }
  html p {
    line-height: 1.5rem; }

html {
  box-sizing: border-box; }

*,
*::before,
*::after {
  box-sizing: inherit; }

img {
  max-width: 100%;
  width: 100%; }

.front .page__title,
.page-node-2 .page__title {
  max-width: 60rem;
  margin: 0px auto 0px -99999px;
  font-size: 0.01px;
  color: transparent; }

/*
// Define Susy grid variables mobile first.
$total-columns: 4;
$column-width: 10em;
$gutter-width: 0em;
//$gutter-width: $horz-spacing-unit;
$grid-padding: 5px;
*/
.l-header,
.l-navigation,
.l-main,
.l-main-bottom,
.l-footer {
  *zoom: 1;
  max-width: 60rem;
  width: 100%;
  margin-left: auto;
  margin-right: auto; }

.l-header:after,
.l-main:after,
.l-footer:after {
  content: "";
  display: table;
  clear: both; }

.l-region--highlighted,
.l-region--help,
.l-region--sidebar-first,
.l-region--sidebar-second {
  margin-bottom: 20px; }

.l-header-below {
  /* Safari, other WebKit */
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  max-width: 960px;
  margin: 0 auto; }

/******************************************************
 *** MOBILE - 320px ***********************************
 ******************************************************/
@media all and (min-width: 320px) {
  .l-header,
  .l-main,
  .l-footer {
    max-width: 60rem; }
  .l-navigation {
    max-width: 306px; }
  .front .l-main {
    max-width: 100%; }
  .page-front .l-section_1 {
    max-width: 400px;
    margin: 0 auto; }
  .page-front .l-section_2 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-front .l-section_3 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-node-2 .c-main .l-main {
    max-width: 100%; }
    .page-node-2 .c-main .l-main .page__title {
      margin: 0 auto;
      max-width: 60rem; }
    .page-node-2 .c-main .l-main .views-field {
      margin: 0 auto;
      max-width: 60rem; }
  .page-node-15 .c-main .l-main {
    max-width: 100%; }
    .page-node-15 .c-main .l-main .page__title {
      max-width: 514px;
      margin: 0 auto;
      padding: 0 10px; }
    .page-node-15 .c-main .l-main .contact-wrap {
      background-color: #97b0d1; }
    .page-node-15 .c-main .l-main .form-wrap {
      background-color: #9cc8e1; }
    .page-node-15 .c-main .l-main .contact__content {
      margin: 0 auto;
      max-width: 60rem;
      padding: 40px 0; }
    .page-node-15 .c-main .l-main #webform-client-form-15 {
      margin: 0 auto;
      max-width: 800px;
      padding: 40px 10px; }
  .l-branding {
    width: 100%;
    float: left;
    margin-right: 5.26316%; }
  .l-region--header {
    width: 100%;
    float: right;
    margin-right: 0; }
  .l-region--navigation {
    clear: both; }
  .has-sidebar-first .l-content,
  .has-sidebar-second .l-content,
  .has-two-sidebars .l-content {
    width: 59.18367%;
    margin-right: 2.04082%;
    float: right; }
  .has-sidebar-first .l-region--sidebar-first,
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-first,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 38.77551%;
    margin-right: 0;
    float: left; }
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-second {
    clear: right; } }

@media all and (min-width: 320px) {
  .l-branding {
    padding: 0 10px 0 0; }
  .c-main .l-main .l-content {
    padding: 0 10px; }
    .c-main .l-main .l-content .node__title a {
      text-decoration: none;
      text-transform: uppercase; }
      .c-main .l-main .l-content .node__title a:hover {
        color: #444444; }
    .c-main .l-main .l-content .node__content a:hover {
      color: #444444; }
  #block-block-1 {
    max-width: 58px;
    margin: 20px auto 0; } }

/******************************************************
 *** NEXUS - 600px ************************************
 ******************************************************/
@media all and (min-width: 600px) {
  .l-header,
  .l-navigation,
  .l-main,
  .l-main-bottom,
  .l-footer {
    max-width: 60rem; }
  /* Front */
  .page-front .l-section_1 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-front .l-section_2 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-front .l-section_3 {
    max-width: 60rem;
    margin: 0 auto; }
  /* Contact */
  .page-node-15 .c-main .l-main {
    max-width: 100%; }
    .page-node-15 .c-main .l-main .page__title {
      padding: 0; }
    .page-node-15 .c-main .l-main .contact-wrap {
      background-color: #97b0d1; }
    .page-node-15 .c-main .l-main .form-wrap {
      background-color: #9cc8e1; }
  .l-branding {
    width: 59%;
    float: left;
    margin-right: 2.04082%; }
  .l-region--header {
    width: 34%;
    float: right;
    margin-right: 0; }
  .l-region--navigation {
    clear: both; }
  .has-sidebar-first .l-content,
  .has-sidebar-second .l-content,
  .has-two-sidebars .l-content {
    width: 66.10169%;
    margin-right: 1.69492%;
    float: right; }
  .has-sidebar-first .l-region--sidebar-first,
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-first,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 32.20339%;
    margin-right: 0;
    float: left; }
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-second {
    clear: right; } }

@media all and (min-width: 600px) {
  .l-branding {
    padding: 0; } }

/******************************************************
 *** TABLET - 768px ***********************************
 ******************************************************/
@media all and (min-width: 768px) {
  .l-header,
  .l-navigation,
  .l-main,
  .l-main-bottom,
  .l-footer {
    max-width: 60rem; }
  .l-branding {
    width: 50%;
    float: left;
    margin-right: 1.69492%; }
  .l-region--header {
    width: 40%;
    float: right;
    margin-right: 0; }
  .l-region--navigation {
    clear: both; }
  .has-sidebar-first .l-content,
  .has-sidebar-second .l-content,
  .has-two-sidebars .l-content {
    width: 74.57627%;
    margin-right: 1.69492%;
    float: right; }
  .has-sidebar-first .l-region--sidebar-first,
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-first,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 23.72881%;
    margin-right: 0;
    float: left; }
  .has-sidebar-first .l-region--sidebar-second,
  .has-sidebar-second .l-region--sidebar-second,
  .has-two-sidebars .l-region--sidebar-second {
    clear: right; } }

/******************************************************
 *** DESKTOP - 960px **********************************
 ******************************************************/
@media all and (min-width: 960px) {
  .l-header,
  .l-navigation,
  .l-main,
  .l-main-bottom,
  .l-footer {
    max-width: 60rem; }
  /* Front */
  .front .l-main {
    max-width: 60rem; }
  .page-front .l-section_1 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-front .l-section_2 {
    max-width: 60rem;
    margin: 0 auto; }
  .page-front .l-section_3 {
    max-width: 60rem;
    margin: 0 auto; }
  /* Services */
  .page-node-2 .c-main .l-main {
    max-width: 100%; }
    .page-node-2 .c-main .l-main .page__title {
      margin: 0 auto;
      max-width: 60rem; }
    .page-node-2 .c-main .l-main .views-field {
      margin: 0 auto;
      max-width: 60rem; }
  /* Contact Us */
  .page-node-15 .c-main .l-main {
    max-width: 100%; }
    .page-node-15 .c-main .l-main .page__title {
      margin: 0 auto;
      max-width: 60rem; }
    .page-node-15 .c-main .l-main .contact-wrap {
      background-color: #97b0d1; }
    .page-node-15 .c-main .l-main .form-wrap {
      background-color: #9cc8e1; }
    .page-node-15 .c-main .l-main .contact__content {
      margin: 0 auto;
      max-width: 60rem;
      padding: 40px 0; }
    .page-node-15 .c-main .l-main #webform-client-form-15 {
      margin: 0 auto;
      max-width: 800px;
      padding: 40px 0; }
  .l-branding {
    width: 40.70886%;
    float: left;
    margin-right: 1.26582%; }
  .l-region--header {
    width: 57.02532%;
    float: right;
    margin-right: 0; }
  .has-sidebar-first .l-content {
    width: 74.68354%;
    float: right;
    margin-right: 0; }
  .has-sidebar-first .l-region--sidebar-first {
    width: 24.05063%;
    float: left;
    margin-right: 1.26582%; }
  .has-sidebar-second .l-content {
    width: 74.68354%;
    float: left;
    margin-right: 1.26582%; }
  .has-sidebar-second .l-region--sidebar-second {
    width: 24.05063%;
    float: right;
    margin-right: 0;
    clear: none; }
  .has-two-sidebars .l-content {
    width: 49.36709%;
    float: left;
    margin-right: 1.26582%;
    margin-left: 25.31646%; }
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 24.05063%;
    float: left;
    margin-right: 1.26582%; }
  .has-two-sidebars .l-region--sidebar-first {
    margin-left: -75.94937%; }
  .has-two-sidebars .l-region--sidebar-second {
    float: right;
    margin-right: 0;
    clear: none; } }

/******************************************************
 *** DESKTOP - 1120px **********************************
 ******************************************************/
@media all and (min-width: 1120px) {
  .l-header,
  .l-main,
  .l-main-bottom,
  .l-footer {
    max-width: 60rem; }
  .l-branding {
    width: 40.70886%;
    float: left;
    margin-right: 1.26582%; }
  .l-region--header {
    width: 57.02532%;
    float: right;
    margin-right: 0; }
  .has-sidebar-first .l-content {
    width: 74.68354%;
    float: right;
    margin-right: 0; }
  .has-sidebar-first .l-region--sidebar-first {
    width: 24.05063%;
    float: left;
    margin-right: 1.26582%; }
  .has-sidebar-second .l-content {
    width: 74.68354%;
    float: left;
    margin-right: 1.26582%; }
  .has-sidebar-second .l-region--sidebar-second {
    width: 24.05063%;
    float: right;
    margin-right: 0;
    clear: none; }
  .has-two-sidebars .l-content {
    width: 49.36709%;
    float: left;
    margin-right: 1.26582%;
    margin-left: 25.31646%; }
  .has-two-sidebars .l-region--sidebar-first,
  .has-two-sidebars .l-region--sidebar-second {
    width: 24.05063%;
    float: left;
    margin-right: 1.26582%; }
  .has-two-sidebars .l-region--sidebar-first {
    margin-left: -75.94937%; }
  .has-two-sidebars .l-region--sidebar-second {
    float: right;
    margin-right: 0;
    clear: none; } }

/*# sourceMappingURL=animation-nation.layout.css.map */