/*
 * CSS3 library is now included in wp-module-themeframework.
 * This file still exists for backward compatibility.
 */
/*******************************
 * Contrast color functions
 ******************************/
/**
 * Automatically decides wheter black or white color is needed
 * @obsolete
 */
/**
 * Automatically gets the contrast color
 *
 */
/*******************************
 * Prefixing mixins
 ******************************/
/*******************************
 * Clearfix
 ******************************/
/*
 * If there is no other clearfix
 * class from bootstrap or something
 * available, you can include this.
 */
/*******************************
 * BS Viewports
 ******************************/
/*******************************
 * Misc
 ******************************/
/*
 * Triangle factory
 */
html, body, .animsition, .no-animsition {
  height: 100%; }

body {
  overflow-y: scroll;
  -webkit-font-smoothing: antialiased;
  /*-webkit-overflow-scrolling: touch;*/
  /*-webkit-text-shadow: rgba(255,255,255,0.01) 0 0 1px;*/ }

/* firefox fix */
.img-responsive {
  width: 100%; }

/* vertical alignment styles */
.col-top {
  vertical-align: top; }

.col-middle {
  vertical-align: middle; }

.col-bottom {
  vertical-align: bottom; }

/* columns of same height styles */
.container-xs-height {
  display: table;
  padding-left: 0px;
  padding-right: 0px; }

.row-xs-height {
  display: table;
  width: 100%; }

.col-xs-height {
  display: table-cell;
  float: none !important; }

@media (min-width: 768px) {
  .row-sm-height {
    display: table;
    width: 100%; }

  .col-sm-height {
    display: table-cell;
    float: none !important; } }
@media (min-width: 992px) {
  .row-md-height {
    display: table;
    width: 100%; }

  .col-md-height {
    display: table-cell;
    float: none !important; } }
@media (min-width: 1200px) {
  .row-lg-height {
    display: table;
    width: 100%; }

  .col-lg-height {
    display: table-cell;
    float: none !important; } }
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
@font-face {
  font-family: Lora;
  src: url(../fonts/Lora-Regular.ttf);
  font-weight: 400; }
@font-face {
  font-family: Lora;
  src: url(../fonts/Lora-Bold.ttf);
  font-weight: 700; }
@font-face {
  font-family: Lora;
  src: url(../fonts/Lora-Italic.ttf);
  font-weight: 400;
  font-style: italic; }
@font-face {
  font-family: Roboto;
  src: url(../fonts/Roboto-Light.ttf);
  font-weight: 300; }
@font-face {
  font-family: Roboto;
  src: url(../fonts/Roboto-Regular.ttf);
  font-weight: 400; }
@font-face {
  font-family: 'Mistral';
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/MISTRAL.woff") format("woff"); }
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
body {
  background-color: #fff;
  color: #666;
  font-family: 'Roboto', sans-serif;
  font-weight: normal; }

img {
  max-width: 100%; }

/*******************************
 * Header Grid System
 *
 * A few classes to make it
 * easier to create a header
 * layout.
 *
 * Currently only supporting
 * XS and SM vierports
 *
 ******************************/
/*******************************
 * hgCreateAligns
 ******************************/
/*
 * Create alignment classes
 * for the enclosing viewport
 */
/*******************************
 * hgCreateCols
 ******************************/
/*
 * Create a simple grid with 12 cols
 * for the given viewport
 */
/*******************************
 * header-row
 ******************************/
.header-row {
  position: relative;
  /*
   * Include clearfix so you
   * dont have to add the clearfix
   * class additionally.
   */
  /*
  * You dont add the .partial class
  * to every partial.
  */
  /*
   * Vertical center wrapper
   */
  /*
   * Create alignment classes
   * for this viewport
   */
  /*
   * Create a simple grid with 12 cols
   * like in bootstrap. It should be
   * really simple and known to use.
   */
  /*
   * SM Viewport
   */
  /*
   * MD Viewport
   */
  /*
   * LG Viewport
   */ }
  .header-row:after {
    content: "";
    display: table;
    clear: both;
    *zoom: 1; }
  .header-row .partial, .header-row [class*='partial'] {
    width: 100%;
    position: relative;
    display: table; }
  .header-row .v-center {
    vertical-align: middle;
    height: inherit;
    display: table-cell; }
  .header-row .partial-xs-left {
    text-align: left; }
  .header-row .partial-xs-center {
    text-align: center; }
  .header-row .partial-xs-right {
    text-align: right; }
  .header-row .partial-xs-1 {
    width: 8.3333333333%;
    float: left; }
  .header-row .partial-xs-2 {
    width: 16.6666666667%;
    float: left; }
  .header-row .partial-xs-3 {
    width: 25%;
    float: left; }
  .header-row .partial-xs-4 {
    width: 33.3333333333%;
    float: left; }
  .header-row .partial-xs-5 {
    width: 41.6666666667%;
    float: left; }
  .header-row .partial-xs-6 {
    width: 50%;
    float: left; }
  .header-row .partial-xs-7 {
    width: 58.3333333333%;
    float: left; }
  .header-row .partial-xs-8 {
    width: 66.6666666667%;
    float: left; }
  .header-row .partial-xs-9 {
    width: 75%;
    float: left; }
  .header-row .partial-xs-10 {
    width: 83.3333333333%;
    float: left; }
  .header-row .partial-xs-11 {
    width: 91.6666666667%;
    float: left; }
  .header-row .partial-xs-12 {
    width: 100%;
    float: left; }
  @media (min-width: 768px) {
    .header-row .partial-sm-1 {
      width: 8.3333333333%;
      float: left; }
    .header-row .partial-sm-2 {
      width: 16.6666666667%;
      float: left; }
    .header-row .partial-sm-3 {
      width: 25%;
      float: left; }
    .header-row .partial-sm-4 {
      width: 33.3333333333%;
      float: left; }
    .header-row .partial-sm-5 {
      width: 41.6666666667%;
      float: left; }
    .header-row .partial-sm-6 {
      width: 50%;
      float: left; }
    .header-row .partial-sm-7 {
      width: 58.3333333333%;
      float: left; }
    .header-row .partial-sm-8 {
      width: 66.6666666667%;
      float: left; }
    .header-row .partial-sm-9 {
      width: 75%;
      float: left; }
    .header-row .partial-sm-10 {
      width: 83.3333333333%;
      float: left; }
    .header-row .partial-sm-11 {
      width: 91.6666666667%;
      float: left; }
    .header-row .partial-sm-12 {
      width: 100%;
      float: left; }
    .header-row .partial-sm-left {
      text-align: left; }
    .header-row .partial-sm-center {
      text-align: center; }
    .header-row .partial-sm-right {
      text-align: right; } }
  @media (min-width: 992px) {
    .header-row {
      /*
       * Create a simple grid with 12 cols
       * like in bootstrap. It should be
       * really simple and known to use.
       */
      /*
       * Create alignment classes
       * for this viewport
       */ }
      .header-row .partial-md-1 {
        width: 8.3333333333%;
        float: left; }
      .header-row .partial-md-2 {
        width: 16.6666666667%;
        float: left; }
      .header-row .partial-md-3 {
        width: 25%;
        float: left; }
      .header-row .partial-md-4 {
        width: 33.3333333333%;
        float: left; }
      .header-row .partial-md-5 {
        width: 41.6666666667%;
        float: left; }
      .header-row .partial-md-6 {
        width: 50%;
        float: left; }
      .header-row .partial-md-7 {
        width: 58.3333333333%;
        float: left; }
      .header-row .partial-md-8 {
        width: 66.6666666667%;
        float: left; }
      .header-row .partial-md-9 {
        width: 75%;
        float: left; }
      .header-row .partial-md-10 {
        width: 83.3333333333%;
        float: left; }
      .header-row .partial-md-11 {
        width: 91.6666666667%;
        float: left; }
      .header-row .partial-md-12 {
        width: 100%;
        float: left; }
      .header-row .partial-md-left {
        text-align: left; }
      .header-row .partial-md-center {
        text-align: center; }
      .header-row .partial-md-right {
        text-align: right; } }
  @media (min-width: 1170px) {
    .header-row .partial-lg-1 {
      width: 8.3333333333%;
      float: left; }
    .header-row .partial-lg-2 {
      width: 16.6666666667%;
      float: left; }
    .header-row .partial-lg-3 {
      width: 25%;
      float: left; }
    .header-row .partial-lg-4 {
      width: 33.3333333333%;
      float: left; }
    .header-row .partial-lg-5 {
      width: 41.6666666667%;
      float: left; }
    .header-row .partial-lg-6 {
      width: 50%;
      float: left; }
    .header-row .partial-lg-7 {
      width: 58.3333333333%;
      float: left; }
    .header-row .partial-lg-8 {
      width: 66.6666666667%;
      float: left; }
    .header-row .partial-lg-9 {
      width: 75%;
      float: left; }
    .header-row .partial-lg-10 {
      width: 83.3333333333%;
      float: left; }
    .header-row .partial-lg-11 {
      width: 91.6666666667%;
      float: left; }
    .header-row .partial-lg-12 {
      width: 100%;
      float: left; }
    .header-row .partial-lg-left {
      text-align: left; }
    .header-row .partial-lg-center {
      text-align: center; }
    .header-row .partial-lg-right {
      text-align: right; } }

/*******************************
 * Basic dropdown
 ******************************/
/**
 * This function is intented
 * to be placed inside the selector
 * which represents the top level ul.
 *
 * It will add the default css
 * dropdown functionlalities to this class.
 */
/*******************************
 * Default responsive mobile styles
 ******************************/
/*******************************
 * Default vertical dropdown
 ******************************/
/**
 * Creates a default vertical
 * dropdown out of the corresponding ul.
 */
/*******************************
 * jQueryResponsiveNavigation styles
 ******************************/
/*******************************
 * DEV
 ******************************/
/*
 * Creates a new menu. Use this
 * mixin as your base for the menu
 * and define the single menu levels.
 */
/*
 * false:	Alle child ul
 * 0:		Root level
 * >0:		Specific level
 */
/*******************************
 * 1stparty styles
 ******************************/
header.main {
  background-color: #fff;
  position: relative; }
  header.main .logo {
    max-width: 270px; }
    @media (min-width: 768px) {
      header.main .logo {
        max-width: 396px; } }
    header.main .logo img {
      max-width: inherit;
      margin: 0; }
      @media (min-width: 768px) {
        header.main .logo img {
          margin: 25px; } }
  header.main .r0 {
    background-color: #efefef;
    color: #898989; }
    header.main .r0 form {
      display: inline-block;
      vertical-align: top; }
      header.main .r0 form input {
        background-color: transparent;
        border: none; }
    header.main .r0 .pre-panel {
      border-left: 1px solid #e2e2e2;
      padding: 5px 8px;
      display: inline-block;
      vertical-align: top; }
      header.main .r0 .pre-panel ul {
        text-align: left;
        background-color: #efefef;
        padding: 0;
        margin: 0;
        /*
         * Call basic mixin to enable
         * simple dropdown functionalities
         */
        /*
         * Add default mobile styles
         */
        /*
         * Add more styles to make it work as
         * as default vertical dropdown.
         */ }
        header.main .r0 .pre-panel ul {
          position: relative; }
          header.main .r0 .pre-panel ul li {
            position: relative;
            /*
             * Only open the child ul
             * when hovering the li if
             * it is on a bigger screen
             */
            /*
             * Hide all child uls
             */ }
            @media (min-width: 992px) {
              header.main .r0 .pre-panel ul li:hover > ul {
                display: block; } }
            header.main .r0 .pre-panel ul li > ul {
              display: none; }
        header.main .r0 .pre-panel ul li {
          float: none; }
        header.main .r0 .pre-panel ul li {
          /* Nobody wants list styles in navigations */
          list-style: none;
          /*
           * Display the child uls as dropdown
           * of the specific li if its shown
           * on a bigger screen
           */ }
          @media (min-width: 992px) {
            header.main .r0 .pre-panel ul li {
              float: left; } }
          header.main .r0 .pre-panel ul li ul {
            margin: 0;
            padding: 0; }
            @media (min-width: 992px) {
              header.main .r0 .pre-panel ul li ul {
                position: absolute;
                top: 100%;
                left: 0;
                z-index: 20; } }
            header.main .r0 .pre-panel ul li ul > li {
              width: 100%; }
              header.main .r0 .pre-panel ul li ul > li > ul {
                /*
                 * Make the 3rd level menus
                 * display at the right side
                 * if its on a big screen
                 */ }
                @media (min-width: 992px) {
                  header.main .r0 .pre-panel ul li ul > li > ul {
                    left: 100%;
                    top: 0; } }
      header.main .r0 .pre-panel a {
        color: #898989; }
      header.main .r0 .pre-panel:last-child {
        border-right: 1px solid #e2e2e2; }
  header.main .r1 .partial-logo {
    height: 75px; }
    header.main .r1 .partial-logo .nav-control {
      -webkit-transition: background-color ease 100ms;
      -moz-transition: background-color ease 100ms;
      -o-transition: background-color ease 100ms;
      -ms-transition: background-color ease 100ms;
      -khtml-transition: background-color ease 100ms;
      transition: background-color ease 100ms;
      margin: 0; }
      @media (min-width: 768px) {
        header.main .r1 .partial-logo .nav-control {
          margin: 35px 0px; } }
      @media (min-width: 992px) {
        header.main .r1 .partial-logo .nav-control {
          margin: 0; } }
      header.main .r1 .partial-logo .nav-control:active {
        background-color: rgba(0, 0, 0, 0.1); }
      header.main .r1 .partial-logo .nav-control .fa {
       /*
      * The height of the biggest
      * inline element in the block
      */
        height: 50px;
        width: 50px; }
        @media (min-width: 992px) {
          header.main .r1 .partial-logo .nav-control .fa {
            height: 75px; } }
      @media print {
        header.main .r1 .partial-logo .nav-control {
          display: none; } }
  @media (min-width: 992px) {
    header.main .r1 .partial-menu {
      height: 75px; } }
  header.main .overlay {
    background-color: rgba(186, 168, 102, 0.8); }

/*
 * TODO: implement header style mixin
 */
header.frontpage .nav-control {
  color: #fff; }
header.frontpage a {
  color: #fff; }
header.frontpage .responsive-menu.menu-main > ul > li > a {
  color: #fff; }
@media (min-width: 992px) {
  header.frontpage .responsive-menu.menu-main ul > li > a {
    color: #555; }
  header.frontpage .responsive-menu.menu-main > ul > li > a {
    color: #fff; } }

/*
 * CSS3 library is now included in wp-module-themeframework.
 * This file still exists for backward compatibility.
 */
/*******************************
 * Contrast color functions
 ******************************/
/**
 * Automatically decides wheter black or white color is needed
 * @obsolete
 */
/**
 * Automatically gets the contrast color
 *
 */
/*******************************
 * Prefixing mixins
 ******************************/
/*******************************
 * Clearfix
 ******************************/
/*
 * If there is no other clearfix
 * class from bootstrap or something
 * available, you can include this.
 */
/*******************************
 * BS Viewports
 ******************************/
/*******************************
 * Misc
 ******************************/
/*
 * Triangle factory
 */
/*
 * Mixin used to create
 * footer styles.
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
footer {
  background-color: #000;
  color: #fff;
  font-size: 16px;
  font-weight: 300; }
  footer .OBContactWidget-row {
    margin-top: 10px; }
  footer a {
    color: #fff; }
  footer hr {
    border-color: black; }
  footer .search-widget input {
    background-color: transparent;
    border: 1px solid black;
    padding: 10px;
    max-width: 100%; }
  footer ul.menu {
    padding: 0;
    list-style: none; }
    footer ul.menu li {
      margin-top: 10px; }

footer.style-classic {
  padding: 15px 0; }

footer.style-modern {
  border-top: solid 5px #BAA866; }
  footer.style-modern h3 {
    text-transform: uppercase;
    font-size: 15px;
    letter-spacing: 3px;
    position: relative;
    padding: 15px 0;
    margin: 15px 0;
    color: white; }
    @media (min-width: 992px) {
      footer.style-modern h3 {
        font-size: 18px; } }
    footer.style-modern h3:after {
      content: "";
      background: #BAA866;
      position: absolute;
      bottom: 0;
      left: 0;
      height: 3px;
      width: 65px; }
  footer.style-modern .r1 {
    padding-top: 15px;
    padding-bottom: 15px; }
  footer.style-modern .r2 {
    background-color: #121212;
    padding-top: 15px;
    padding-bottom: 15px; }

@keyframes widget-toggle {
  0% {
    display: block;
    opacity: 0; }
  100% {
    opacity: 1.0; } }
footer .widget .toggle-indicator {
  margin-right: 10px;
  display: inline-block; }
  @media (min-width: 992px) {
    footer .widget .toggle-indicator {
      display: none; } }
footer .widget .toggle-container {
  display: none; }
  @media (min-width: 992px) {
    footer .widget .toggle-container {
      display: block; } }
footer .widget.active-widget .toggle-container {
  display: block;
  animation: widget-toggle 300ms; }
footer .widget.active-widget .toggle-indicator {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -khtml-transform: rotate(180deg);
  transform: rotate(180deg); }
footer .widget ul.zoom-instagram-widget__items {
  padding: 0;
  margin: 0; }

/*******************************
 * Forgery functions
 ******************************/
/*******************************
 * Misc
 ******************************/
.button-spacer {
  overflow: hidden;
  margin: 20px 0;
  position: relative; }
  .button-spacer:after {
    border-top: 1px solid #dadada;
    content: "";
    position: absolute;
    top: 50%;
    width: 100%;
    margin-left: 10px; }

/*******************************
 * Version 2
 ******************************/
/*
 * Creates a button with the necessary
 * selector. Pass the custom styles
 * directly as content block.
 *
 * @include button('my-button') { ... }
 *
 * You can use predefined button styles:
 * @include button('other-button') {
 *  @include buttonStyleSolid(...);
 * }
 *
 */
/*
 * Helper function to throw an error
 * when trying to include a buttonStyle
 * mixin on root level.
 */
/*******************************
 * Predefined Hover Styles
 ******************************/
/*******************************
 * Predefined Style Mixins
 ******************************/
/*
 * Creates a simple solid flat button with
 * customizable $backgroundColor and $color.
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/*******************************
 * Creating Button Styles
 * (using V2 factory)
 ******************************/
/*
 * Theme scope styles that you
 * want to add to all your buttons
 */
button, .button.style-default, .contact-form input[type="submit"], .wpcf7 input[type="submit"], .promo button {
  font-family: 'Lora', sans-serif;
  padding: 13px 30px;
  font-size: 18px;
  font-weight: 300;
  background-color: #BAA866;
  color: #fff;
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  -o-transition: background-color 0.2s;
  -ms-transition: background-color 0.2s;
  -khtml-transition: background-color 0.2s;
  transition: background-color 0.2s; }
  button:hover, .button.style-default:hover, .contact-form input[type="submit"]:hover, .wpcf7 input[type="submit"]:hover, .promo button:hover {
    background-color: #897745;
    text-decoration: none; }

button, .button.style-primary, .contact-form input.style-primary[type="submit"], .wpcf7 input.style-primary[type="submit"], .promo button.style-primary, .scale button {
  text-decoration: none;
  padding: 10px 15px;
  display: inline-block;
  /*
   * Create a small space between to
   * buttons
   */
  text-decoration: none;
  background-color: #BAA866;
  color: 2px;
  transition: background 0.15s;
  font-family: 'Lora', sans-serif; }
  button + .button, .contact-form button + input[type="submit"], .wpcf7 button + input[type="submit"], .promo button + button, .button.style-primary + .button, .contact-form input.style-primary[type="submit"] + .button, .wpcf7 input.style-primary[type="submit"] + .button, .promo button.style-primary + .button, .scale button + .button, .contact-form .button.style-primary + input[type="submit"], .contact-form input.style-primary[type="submit"] + input[type="submit"], .promo .contact-form button.style-primary + input[type="submit"], .contact-form .promo button.style-primary + input[type="submit"], .scale .contact-form button + input[type="submit"], .contact-form .scale button + input[type="submit"], .wpcf7 .button.style-primary + input[type="submit"], .wpcf7 input.style-primary[type="submit"] + input[type="submit"], .promo .wpcf7 button.style-primary + input[type="submit"], .wpcf7 .promo button.style-primary + input[type="submit"], .scale .wpcf7 button + input[type="submit"], .wpcf7 .scale button + input[type="submit"], .promo .button.style-primary + button, .contact-form .promo input.style-primary[type="submit"] + button, .promo .contact-form input.style-primary[type="submit"] + button, .wpcf7 .promo input.style-primary[type="submit"] + button, .promo .wpcf7 input.style-primary[type="submit"] + button, .promo button.style-primary + button, .scale .promo button + button, .promo .scale button + button {
    margin-left: 5px; }
  button:hover, .button.style-primary:hover, .contact-form input.style-primary[type="submit"]:hover, .wpcf7 input.style-primary[type="submit"]:hover, .promo button.style-primary:hover, .scale button:hover {
    background-color: #c2b278; }
  button:active, .button.style-primary:active, .contact-form input.style-primary[type="submit"]:active, .wpcf7 input.style-primary[type="submit"]:active, .promo button.style-primary:active, .scale button:active {
    transition-duration: 0s;
    background-color: #a3904a;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 #fff;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4); }
  button[disabled], .button.style-primary[disabled], .contact-form input.style-primary[disabled][type="submit"], .wpcf7 input.style-primary[disabled][type="submit"], .promo button.style-primary[disabled], .scale button[disabled] {
    background-color: #a3904a; }
    button[disabled]:hover, button[disabled]:active, button[disabled]:focus, .button.style-primary[disabled]:hover, .contact-form input.style-primary[disabled][type="submit"]:hover, .wpcf7 input.style-primary[disabled][type="submit"]:hover, .promo button.style-primary[disabled]:hover, .scale button[disabled]:hover, .button.style-primary[disabled]:active, .contact-form input.style-primary[disabled][type="submit"]:active, .wpcf7 input.style-primary[disabled][type="submit"]:active, .promo button.style-primary[disabled]:active, .scale button[disabled]:active, .button.style-primary[disabled]:focus, .contact-form input.style-primary[disabled][type="submit"]:focus, .wpcf7 input.style-primary[disabled][type="submit"]:focus, .promo button.style-primary[disabled]:focus, .scale button[disabled]:focus {
      background-color: #a3904a; }

button, .button.style-white, .contact-form input.style-white[type="submit"], .wpcf7 input.style-white[type="submit"], .promo button.style-white {
  text-decoration: none;
  padding: 10px 15px;
  display: inline-block;
  /*
   * Create a small space between to
   * buttons
   */
  transition-duration: .3s;
  background-color: transparent;
  border: 2px solid #fff;
  text-decoration: none;
  color: #f2f2f2;
  transition: background 0.15s;
  font-family: 'Lora', sans-serif; }
  button + .button, .contact-form button + input[type="submit"], .wpcf7 button + input[type="submit"], .promo button + button, .button.style-white + .button, .contact-form input.style-white[type="submit"] + .button, .wpcf7 input.style-white[type="submit"] + .button, .promo button.style-white + .button, .contact-form .button.style-white + input[type="submit"], .contact-form input.style-white[type="submit"] + input[type="submit"], .promo .contact-form button.style-white + input[type="submit"], .contact-form .promo button.style-white + input[type="submit"], .wpcf7 .button.style-white + input[type="submit"], .wpcf7 input.style-white[type="submit"] + input[type="submit"], .promo .wpcf7 button.style-white + input[type="submit"], .wpcf7 .promo button.style-white + input[type="submit"], .promo .button.style-white + button, .contact-form .promo input.style-white[type="submit"] + button, .promo .contact-form input.style-white[type="submit"] + button, .wpcf7 .promo input.style-white[type="submit"] + button, .promo .wpcf7 input.style-white[type="submit"] + button, .promo button.style-white + button {
    margin-left: 5px; }
  button:hover, .button.style-white:hover, .contact-form input.style-white[type="submit"]:hover, .wpcf7 input.style-white[type="submit"]:hover, .promo button.style-white:hover {
    border-color: white;
    color: white; }
  button:active, .button.style-white:active, .contact-form input.style-white[type="submit"]:active, .wpcf7 input.style-white[type="submit"]:active, .promo button.style-white:active {
    border-color: #e6e6e6;
    color: #e6e6e6;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 #fff;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4); }

button, .button.style-primarydark, .contact-form input.style-primarydark[type="submit"], .wpcf7 input.style-primarydark[type="submit"], .promo button.style-primarydark {
  text-decoration: none;
  padding: 10px 15px;
  display: inline-block;
  /*
   * Create a small space between to
   * buttons
   */
  transition-duration: .3s;
  background-color: transparent;
  border: 2px solid #212121;
  text-decoration: none;
  color: #141414;
  transition: background 0.15s;
  font-family: 'Lora', sans-serif; }
  button + .button, .contact-form button + input[type="submit"], .wpcf7 button + input[type="submit"], .promo button + button, .button.style-primarydark + .button, .contact-form input.style-primarydark[type="submit"] + .button, .wpcf7 input.style-primarydark[type="submit"] + .button, .promo button.style-primarydark + .button, .contact-form .button.style-primarydark + input[type="submit"], .contact-form input.style-primarydark[type="submit"] + input[type="submit"], .promo .contact-form button.style-primarydark + input[type="submit"], .contact-form .promo button.style-primarydark + input[type="submit"], .wpcf7 .button.style-primarydark + input[type="submit"], .wpcf7 input.style-primarydark[type="submit"] + input[type="submit"], .promo .wpcf7 button.style-primarydark + input[type="submit"], .wpcf7 .promo button.style-primarydark + input[type="submit"], .promo .button.style-primarydark + button, .contact-form .promo input.style-primarydark[type="submit"] + button, .promo .contact-form input.style-primarydark[type="submit"] + button, .wpcf7 .promo input.style-primarydark[type="submit"] + button, .promo .wpcf7 input.style-primarydark[type="submit"] + button, .promo button.style-primarydark + button {
    margin-left: 5px; }
  button:hover, .button.style-primarydark:hover, .contact-form input.style-primarydark[type="submit"]:hover, .wpcf7 input.style-primarydark[type="submit"]:hover, .promo button.style-primarydark:hover {
    border-color: #3b3b3b;
    color: #3b3b3b; }
  button:active, .button.style-primarydark:active, .contact-form input.style-primarydark[type="submit"]:active, .wpcf7 input.style-primarydark[type="submit"]:active, .promo button.style-primarydark:active {
    border-color: #080808;
    color: #080808;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 0 #fff;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4); }

/*******************************
 * Version 1 Generator Mixins
 ******************************/
/*******************************
 * Version 2 Generator Mixins
 ******************************/
/*
 * Main difference to V1 is, that
 * you only use the one statement to
 * define the style and at the same
 * time your custom styles.
 */
/**
 * description
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/*******************************
 * PageSections
 ******************************/
.page-section.style-default {
  background-color: #fff;
  color: #4B4B4B; }

.page-section.style-light {
  background-color: #F9F9F9;
  color: #4B4B4B; }

.page-section.style-semilight {
  background-color: #efefef;
  color: #4B4B4B; }

.page-section.style-grey {
  background-color: #F7F7F7;
  color: #000; }

.page-section.style-pageheading {
  background-color: #BAA866;
  color: #000;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  border-top: solid 5px #BAA866; }

@keyframes frontpageanim {
  0% {
    opacity: 0.0;
    transform: translateY(100px); }
  100% {
    opacity: 1.0;
    transform: translateY(0); } }
.page-section.style-pageheading-frontpage {
  color: #fff;
  height: 500px;
  font-family: 'Lato', sans-serif;
  background-size: cover;
  background-position: center;
  min-height: 250px;
  padding-top: 35px !important;
  padding-bottom: 75px !important;
  position: relative; }
  @media (min-width: 992px) {
    .page-section.style-pageheading-frontpage {
      padding-bottom: 0 !important;
      padding-top: 0 !important; } }
  .page-section.style-pageheading-frontpage .v-wrap {
    display: table;
    height: inherit;
    width: 100%; }
    .page-section.style-pageheading-frontpage .v-wrap .v-center {
      vertical-align: middle;
      display: table-cell;
      height: inherit; }
      .page-section.style-pageheading-frontpage .v-wrap .v-center .content {
        display: inline-block;
        width: 100%;
        position: relative; }
        .page-section.style-pageheading-frontpage .v-wrap .v-center .content:before {
          position: absolute;
          content: "";
          border-left: 1px solid #fff;
          height: 25px;
          display: none;
          left: 50%;
          top: -25px; }
          @media (min-width: 992px) {
            .page-section.style-pageheading-frontpage .v-wrap .v-center .content:before {
              height: 65px;
              top: -65px;
              display: block; } }
        .page-section.style-pageheading-frontpage .v-wrap .v-center .content .container {
          text-align: center; }
  .page-section.style-pageheading-frontpage .anim {
    animation: frontpageanim 4s; }
  .page-section.style-pageheading-frontpage:after {
    content: "\2193";
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -khtml-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 25px;
    color: #fff;
    display: block;
    position: absolute;
    bottom: 20px;
    left: 50%; }
  .page-section.style-pageheading-frontpage h1, .page-section.style-pageheading-frontpage h2, .page-section.style-pageheading-frontpage h3 {
    font-weight: lighter;
    text-align: center;
    color: #fff; }
    .page-section.style-pageheading-frontpage h1 strong, .page-section.style-pageheading-frontpage h2 strong, .page-section.style-pageheading-frontpage h3 strong {
      color: #000; }
  .page-section.style-pageheading-frontpage h2 {
    font-size: 25px;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto; }
    @media (min-width: 768px) {
      .page-section.style-pageheading-frontpage h2 {
        max-width: initial; } }
    @media (min-width: 992px) {
      .page-section.style-pageheading-frontpage h2 {
        font-size: 35px; } }
  @media (min-width: 992px) {
    .page-section.style-pageheading-frontpage {
      min-height: 700px;
      height: 700px; } }
  @media print {
    .page-section.style-pageheading-frontpage {
      display: none; } }

.page-section.style-semilight {
  background-color: #efefef;
  color: #4B4B4B; }

/*******************************
 * Layouts
 ******************************/
.page-section.layout-default {
  margin: 0;
  padding: 20px 0; }

.page-section.layout-big {
  margin: 0;
  padding: 60px 0; }

.page-section.layout-huge {
  margin: 0;
  padding: 30px 0; }
  @media (min-width: 768px) {
    .page-section.layout-huge {
      padding: 80px 0; } }

.page-section.layout-giant {
  margin: 0;
  padding: 100px 0; }

.page-section.layout-pageheading {
  margin: 0;
  padding: 0px 0px; }
  .page-section.layout-pageheading .overlay {
    padding: 30px 0px;
    background: rgba(186, 168, 102, 0.5); }
    @media (min-width: 768px) {
      .page-section.layout-pageheading .overlay {
        padding: 50px 0px; } }
  @media (min-width: 992px) {
    .page-section.layout-pageheading {
      padding: 90px 0px; }
      .page-section.layout-pageheading .overlay {
        padding: 0;
        background: none; } }
  @media (min-width: 1170px) {
    .page-section.layout-pageheading {
      padding: 120px 0px; } }

.page-section.layout-breadcrumb {
  padding: 20px 0; }

/*
 * CSS3 library is now included in wp-module-themeframework.
 * This file still exists for backward compatibility.
 */
/*******************************
 * Contrast color functions
 ******************************/
/**
 * Automatically decides wheter black or white color is needed
 * @obsolete
 */
/**
 * Automatically gets the contrast color
 *
 */
/*******************************
 * Prefixing mixins
 ******************************/
/*******************************
 * Clearfix
 ******************************/
/*
 * If there is no other clearfix
 * class from bootstrap or something
 * available, you can include this.
 */
/*******************************
 * BS Viewports
 ******************************/
/*******************************
 * Misc
 ******************************/
/*
 * Triangle factory
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/* TESTIMONIAL*/
.ob-testimonial {
  font-family: 'Lora', serif; }
  .ob-testimonial .content-wrapper {
    margin: 0 auto;
    max-width: 700px; }
  .ob-testimonial .quotatio {
    font-size: 29px;
    font-style: italic;
    letter-spacing: 2px;
    line-height: 1.3;
    padding: 20px 0; }
  .ob-testimonial .client-name {
    font-size: 18px;
    letter-spacing: 3px; }
  .ob-testimonial .col-sm-height {
    display: block; }
  .ob-testimonial blockquote .quot {
    font-size: 100%; }

/*
 * CSS3 library is now included in wp-module-themeframework.
 * This file still exists for backward compatibility.
 */
/*******************************
 * Contrast color functions
 ******************************/
/**
 * Automatically decides wheter black or white color is needed
 * @obsolete
 */
/**
 * Automatically gets the contrast color
 *
 */
/*******************************
 * Prefixing mixins
 ******************************/
/*******************************
 * Clearfix
 ******************************/
/*
 * If there is no other clearfix
 * class from bootstrap or something
 * available, you can include this.
 */
/*******************************
 * BS Viewports
 ******************************/
/*******************************
 * Misc
 ******************************/
/*
 * Triangle factory
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/*******************************
 * Contact Styles
 ******************************/
section.main .contacts h4 {
  margin: 40px 0px 10px 0; }
section.main .contacts p {
  letter-spacing: 2px; }

/*******************************
 * Contact Form Styles
 ******************************/
.wpcf7 {
  display: inline-block;
  width: 100%; }

.contact-form, .wpcf7 {
  margin: 30px 0; }
  @media (min-width: 768px) {
    .contact-form, .wpcf7 {
      text-align: left; } }
  .contact-form h4, .wpcf7 h4 {
    margin: 40px 0 10px 0; }
    .contact-form h4:first-child, .wpcf7 h4:first-child {
      margin: 10px 0; }
  .contact-form label, .wpcf7 label {
    padding: 5px 0px;
    display: inline-block; }
  .contact-form input[type="text"],
  .contact-form input[type="email"],
  .contact-form input[type="tel"],
  .contact-form input[type="date"],
  .contact-form input[type="url"],
  .contact-form textarea, .wpcf7 input[type="text"],
  .wpcf7 input[type="email"],
  .wpcf7 input[type="tel"],
  .wpcf7 input[type="date"],
  .wpcf7 input[type="url"],
  .wpcf7 textarea {
    background-color: #F1F1F1;
    border: none;
    border-bottom: 2px solid #dddddd;
    outline: none;
    -webkit-transition: all ease-in-out 0.3s;
    -moz-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    -ms-transition: all ease-in-out 0.3s;
    -khtml-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
    padding: 10px 15px;
    max-width: 100%;
    width: 100%; }
    .contact-form input[type="text"]:focus,
    .contact-form input[type="email"]:focus,
    .contact-form input[type="tel"]:focus,
    .contact-form input[type="date"]:focus,
    .contact-form input[type="url"]:focus,
    .contact-form textarea:focus, .wpcf7 input[type="text"]:focus,
    .wpcf7 input[type="email"]:focus,
    .wpcf7 input[type="tel"]:focus,
    .wpcf7 input[type="date"]:focus,
    .wpcf7 input[type="url"]:focus,
    .wpcf7 textarea:focus {
      border-bottom: 2px solid #BAA866; }
  .contact-form input[type="checkbox"], .contact-form input[type="radio"], .wpcf7 input[type="checkbox"], .wpcf7 input[type="radio"] {
    width: auto; }
  .contact-form input[type="submit"], .wpcf7 input[type="submit"] {
    outline: none;
    border: none; }

@keyframes wpcf7-invalid-bubble {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
.wpcf7 span.wpcf7-not-valid-tip {
  margin: 4px 0px;
  background-color: #e1324f;
  color: #fff;
  border-radius: 4px;
  display: inline-block;
  position: relative;
  padding: 5px 10px;
  animation: wpcf7-invalid-bubble 300ms; }
  .wpcf7 span.wpcf7-not-valid-tip:before {
    content: '';
    border-style: solid;
    position: absolute;
    height: 0;
    width: 0;
    clear: both;
    border-width: 0 10px 12px 10px;
    border-color: transparent transparent #e1324f transparent;
    top: 0;
    left: 15px;
    transform: translateY(-100%); }
.wpcf7 .wpcf7-response-output {
  color: #ffffff;
  padding: 15px !important;
  border: none !important;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  margin: 0;
  animation: wpcf7-invalid-bubble 300ms;
  z-index: 200; }
  .wpcf7 .wpcf7-response-output.wpcf7-validation-errors {
    background-color: #e1324f; }
  .wpcf7 .wpcf7-response-output.wpcf7-mail-sent-ok {
    background-color: #66BE40; }

/*
 * CSS3 library is now included in wp-module-themeframework.
 * This file still exists for backward compatibility.
 */
/*******************************
 * Contrast color functions
 ******************************/
/**
 * Automatically decides wheter black or white color is needed
 * @obsolete
 */
/**
 * Automatically gets the contrast color
 *
 */
/*******************************
 * Prefixing mixins
 ******************************/
/*******************************
 * Clearfix
 ******************************/
/*
 * If there is no other clearfix
 * class from bootstrap or something
 * available, you can include this.
 */
/*******************************
 * BS Viewports
 ******************************/
/*******************************
 * Misc
 ******************************/
/*
 * Triangle factory
 */
/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/*
 * Pagination navigation panel
 * used e.g. for post archive
 * pagination
 */
.page-nav .page-nav-item {
  -webkit-transition: all ease-in 0.2s;
  -moz-transition: all ease-in 0.2s;
  -o-transition: all ease-in 0.2s;
  -ms-transition: all ease-in 0.2s;
  -khtml-transition: all ease-in 0.2s;
  transition: all ease-in 0.2s;
  background-color: #efefef;
  text-decoration: none;
  float: left;
  padding: 8px 14px; }
  .page-nav .page-nav-item:hover {
    background-color: #fcfcfc; }
  .page-nav .page-nav-item .fa {
    font-size: 130%; }
  .page-nav .page-nav-item.current-page-nav-item {
    background-color: #BAA866;
    color: #fff; }

/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
.info-stripe .title {
  color: #666; }

/*
 * Creates a new menu. Use this
 * mixin as your base for the menu
 * and define the single menu levels.
 */
/*
 * false:	Alle child ul
 * 0:		Root level
 * >0:		Specific level
 */
/*******************************
 * Basic dropdown
 ******************************/
/**
 * This function is intented
 * to be placed inside the selector
 * which represents the top level ul.
 *
 * It will add the default css
 * dropdown functionlalities to this class.
 */
/*******************************
 * Default responsive mobile styles
 ******************************/
/*******************************
 * Default vertical dropdown
 ******************************/
/**
 * Creates a default vertical
 * dropdown out of the corresponding ul.
 */
/*******************************
 * jQueryResponsiveNavigation styles
 ******************************/
/*******************************
 * DEV
 ******************************/
/*
 * Default styles for item folder indicators.
 */
@keyframes fadeDown {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -10px);
    -moz-transform: translate(-50%, -10px);
    -o-transform: translate(-50%, -10px);
    -ms-transform: translate(-50%, -10px);
    -khtml-transform: translate(-50%, -10px);
    transform: translate(-50%, -10px); }
  100% {
    opacity: 1.0;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -khtml-transform: translate(-50%, 0);
    transform: translate(-50%, 0); } }
/*--------------------------------------------------------------------------------------------------*/
/*
 * Menu fadein effect
 */
@keyframes menuFade {
  0% {
    opacity: 0.0;
    transform: translateY(-40px); }
  100% {
    opacity: 1.0;
    transform: translateY(0); } }
@keyframes responsiveNavAnim {
  0% {
    display: block;
    opacity: 0.0; }
  100% {
    opacity: 1.0; } }
.responsive-menu.menu-main {
  overflow: hidden; }
  @media (min-width: 992px) {
    .responsive-menu.menu-main {
      /*
       * Necessary to make the
       * dropdown on desktop visible
       */
      overflow: visible; } }
  .responsive-menu.menu-main ul {
    border-top: 1px solid #efefef;
    background-color: #fff; }
    .responsive-menu.menu-main ul .current-menu-item > a {
      color: #BAA866; }
    .responsive-menu.menu-main ul.active {
      display: block;
      animation: menuFade 300ms; }
    @media (min-width: 992px) {
      .responsive-menu.menu-main ul {
        float: right;
        border-top: none;
        -webkit-box-shadow: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
        -moz-box-shadows: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
        -o-box-shadows: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
        -ms-box-shadows: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
        -khtml-box-shadows: 0 0px 3px 0px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0px 3px 0px rgba(0, 0, 0, 0.1); } }
    .responsive-menu.menu-main ul a {
      text-decoration: none; }
  .responsive-menu.menu-main > ul {
    /*
     * Call basic mixin to enable
     * simple dropdown functionalities
     */
    /*
     * Add default mobile styles
     */
    /*
     * Add more styles to make it work as
     * as default vertical dropdown.
     */
    background-color: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadows: none;
    -o-box-shadows: none;
    -ms-box-shadows: none;
    -khtml-box-shadows: none;
    box-shadow: none; }
    .responsive-menu.menu-main > ul {
      position: relative; }
      .responsive-menu.menu-main > ul li {
        position: relative;
        /*
         * Only open the child ul
         * when hovering the li if
         * it is on a bigger screen
         */
        /*
         * Hide all child uls
         */ }
        @media (min-width: 992px) {
          .responsive-menu.menu-main > ul li:hover > ul {
            display: block; } }
        .responsive-menu.menu-main > ul li > ul {
          display: none; }
    .responsive-menu.menu-main > ul li {
      float: none; }
    .responsive-menu.menu-main > ul li {
      /* Nobody wants list styles in navigations */
      list-style: none;
      /*
       * Display the child uls as dropdown
       * of the specific li if its shown
       * on a bigger screen
       */ }
      @media (min-width: 992px) {
        .responsive-menu.menu-main > ul li {
          float: left; } }
      .responsive-menu.menu-main > ul li ul {
        margin: 0;
        padding: 0; }
        @media (min-width: 992px) {
          .responsive-menu.menu-main > ul li ul {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 20; } }
        .responsive-menu.menu-main > ul li ul > li {
          width: 100%; }
          .responsive-menu.menu-main > ul li ul > li > ul {
            /*
             * Make the 3rd level menus
             * display at the right side
             * if its on a big screen
             */ }
            @media (min-width: 992px) {
              .responsive-menu.menu-main > ul li ul > li > ul {
                left: 100%;
                top: 0; } }
    .responsive-menu.menu-main > ul {
      /*
       * Hide the main ul at
       * the beginning. The user
       * must first press the nav
       * toggle button to make the nav
       * ul appear.
       */
      display: none;
      padding: 0;
      margin: 0; }
      .responsive-menu.menu-main > ul ul.active {
        display: block; }
      @media (min-width: 992px) {
        .responsive-menu.menu-main > ul {
          display: block; }
          .responsive-menu.menu-main > ul li .item-folder-indicator {
            display: none; } }
    .responsive-menu.menu-main > ul .item-folder-indicator {
      border-left: 1px solid rgba(0, 0, 0, 0.1);
      -webkit-transition: background-color ease-in 70ms;
      -moz-transition: background-color ease-in 70ms;
      -o-transition: background-color ease-in 70ms;
      -ms-transition: background-color ease-in 70ms;
      -khtml-transition: background-color ease-in 70ms;
      transition: background-color ease-in 70ms;
      /*
       * The background image properties
       * are currently not in use.
       * But they remain here if
       * it would be needed to use
       * images instead of font-awesome
       */
      background-repeat: no-repeat;
      background-size: 24px auto;
      background-position: center;
      display: inline-block;
      position: absolute;
      top: 0;
      right: 0;
      padding: 0 15px;
      width: 48px;
      height: 50px; }
      .responsive-menu.menu-main > ul .item-folder-indicator:active {
        background-color: rgba(0, 0, 0, 0.2); }
      .responsive-menu.menu-main > ul .item-folder-indicator.active {
        background-color: rgba(0, 0, 0, 0.1); }
        .responsive-menu.menu-main > ul .item-folder-indicator.active .fa {
          -webkit-transform: rotate(180deg);
          -moz-transform: rotate(180deg);
          -o-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
          -khtml-transform: rotate(180deg);
          transform: rotate(180deg); }
      .responsive-menu.menu-main > ul .item-folder-indicator .fa {
        text-align: center;
        vertical-align: middle;
        font-size: 36px;
        -webkit-transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        -moz-transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        -o-transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        -ms-transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        -khtml-transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        transition: transform cubic-bezier(0.18, 0.7, 0.58, 1) 400ms;
        display: table-cell;
        height: inherit;
        width: inherit; }
    .responsive-menu.menu-main > ul > li a {
      font-family: 'Lora', sans-serif;
      font-weight: 400;
      font-size: 18px;
      white-space: nowrap;
      margin: 45px 30px;
      display: block;
      color: #000;
      -webkit-transition: color 0.2s;
      -moz-transition: color 0.2s;
      -o-transition: color 0.2s;
      -ms-transition: color 0.2s;
      -khtml-transition: color 0.2s;
      transition: color 0.2s; }
      .responsive-menu.menu-main > ul > li a:hover {
        color: #BAA866; }
    @media (min-width: 992px) {
      .responsive-menu.menu-main > ul > li:hover > ul {
        animation: fadeDown 250ms; } }
  @media (min-width: 992px) {
    .responsive-menu.menu-main > ul > li > ul {
      left: 50%;
      transform: translateX(-50%);
      -webkit-transform: translateX(-50%) translateY(0);
      -moz-transform: translateX(-50%) translateY(0);
      -o-transform: translateX(-50%) translateY(0);
      -ms-transform: translateX(-50%) translateY(0);
      -khtml-transform: translateX(-50%) translateY(0);
      transform: translateX(-50%) translateY(0); }
      .responsive-menu.menu-main > ul > li > ul:after {
        content: '';
        border-style: solid;
        position: absolute;
        height: 0;
        width: 0;
        clear: both;
        border-width: 0 10px 12px 10px;
        border-color: transparent transparent #fff transparent;
        left: 50%;
        top: -10px;
        transform: translateX(-50%); } }

@media (min-width: 992px) {
  .nav-wrapper .nav-control {
    display: none; } }
.nav-wrapper .nav-control .fa {
  text-align: center;
  vertical-align: middle;
  font-size: 24px;
  display: table-cell;
  height: inherit;
  width: inherit; }
.nav-wrapper .btn-nav-toggle {
  float: right; }
.nav-wrapper .btn-search-toggle {
  float: left; }
.nav-wrapper.style-center {
  display: inline-block; }

@media (min-width: 992px) {
  header.main.style-center .nav-toggle-container {
    display: inline-block;
    vertical-align: top;
    float: none; } }

/*******************************
 * OBSlider styles
 ******************************/
.OBSlider {
  -webkit-transition: all ease-in 0.1s;
  -moz-transition: all ease-in 0.1s;
  -ms-transition: all ease-in 0.1s;
  -o-transition: all ease-in 0.1s;
  -khtml-transition: all ease-in 0.1s;
  transition: all ease-in 0.1s;
  overflow: hidden;
  position: relative;
  width: 100%; }
  .OBSlider .control {
    position: absolute;
    z-index: 15;
    /*
     * Hide controls for printing
     */ }
    @media print {
      .OBSlider .control {
        display: none; } }
    .OBSlider .control.control-next {
      background-color: #efefef;
      padding: 20px;
      right: 0px;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      -khtml-transform: translateY(-50%);
      transform: translateY(-50%);
      /* Disabled control on mobile devices */ }
      @media (max-width: 992px) {
        .OBSlider .control.control-next {
          display: none; } }
    .OBSlider .control.control-prev {
      background-color: #efefef;
      padding: 20px;
      left: 0px;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      -khtml-transform: translateY(-50%);
      transform: translateY(-50%);
      /* Disabled control on mobile devices */ }
      @media (max-width: 992px) {
        .OBSlider .control.control-prev {
          display: none; } }
    .OBSlider .control.control-indicator {
      text-align: center;
      color: #efefef;
      bottom: 0;
      width: 100%;
      padding: 5px 0; }
      .OBSlider .control.control-indicator .indicator {
        margin: 0 4px; }
    .OBSlider .control .fa {
      font-size: 20px; }
  .OBSlider .inner {
    position: relative;
    -webkit-transition: all ease-in 0.1s;
    -moz-transition: all ease-in 0.1s;
    -ms-transition: all ease-in 0.1s;
    -o-transition: all ease-in 0.1s;
    -khtml-transition: all ease-in 0.1s;
    transition: all ease-in 0.1s; }
    .OBSlider .inner .slide {
      width: 100%;
      /*
       * Take care that you dont set transition
       * for "all" properties. Otherwise IE
       * will probably calculate a too small
       * slide with (problem cropped slider).
       */
      -webkit-transition: opacity ease-in 0.3s;
      -moz-transition: opacity ease-in 0.3s;
      -ms-transition: opacity ease-in 0.3s;
      -o-transition: opacity ease-in 0.3s;
      -khtml-transition: opacity ease-in 0.3s;
      transition: opacity ease-in 0.3s;
      z-index: 0;
      position: absolute;
      opacity: 0.0;
      /* TMP */ }
      @media print {
        .OBSlider .inner .slide {
          position: static;
          display: block;
          opacity: 1.0;
          visibility: visible; } }
      .OBSlider .inner .slide h1 {
        opacity: 0.0;
        color: #fff;
        -webkit-transition: all ease-in 0.3s; }
      .OBSlider .inner .slide h2 {
        opacity: 0.0;
        color: #fff;
        -webkit-transition: all ease-in 0.3s; }
      .OBSlider .inner .slide.current-slide {
        z-index: 2;
        opacity: 1.0;
        /* TMP */ }
        .OBSlider .inner .slide.current-slide h1 {
          opacity: 1.0;
          -webkit-transform: translateX(0px);
          -webkit-transition: none; }
        .OBSlider .inner .slide.current-slide h2 {
          opacity: 1.0;
          -webkit-transform: translateX(0px);
          -webkit-transition: none; }

.control-indicator {
  text-align: right; }
  .control-indicator .indicator {
    cursor: pointer;
    color: #BAA866; }
    .control-indicator .indicator.current-indicator {
      color: #BAA866; }

.OBWPSlider {
  border-top: solid 5px #BAA866;
  background-color: #000;
  min-height: 350px; }
  @media print {
    .OBWPSlider {
      display: none; } }
  @media (min-width: 992px) {
    .OBWPSlider {
      min-height: 450px; } }
  .OBWPSlider .control {
    cursor: pointer; }
    .OBWPSlider .control.control-next, .OBWPSlider .control.control-prev {
      background-color: transparent; }
      .OBWPSlider .control.control-next .fa, .OBWPSlider .control.control-prev .fa {
        font-size: 50px;
        color: #fff; }
  @media print {
    .OBWPSlider .inner {
      height: auto !important;
      display: none; } }
  .OBWPSlider .slide {
    background-position: center;
    background-size: cover;
    display: table; }
    .OBWPSlider .slide:nth-child(6) {
      background-color: #cdc090; }
    .OBWPSlider .slide:nth-child(4) {
      background-color: #c7b882; }
    .OBWPSlider .slide:nth-child(2) {
      background-color: #c0b074; }
    @media (min-width: 992px) {
      .OBWPSlider .slide {
        min-height: 450px;
        	  /*
           * Min-height on tables
           * does not work in Firefox
           * so add height as well
           */
        height: 450px; } }
    @media (max-width: 991px) {
      .OBWPSlider .slide {
        min-height: 350px;
        /*
         * Min-height on tables
         * does not work in Firefox
         * so add height as well
         */
        height: 350px; } }
    @media print {
      .OBWPSlider .slide {
        min-height: initial;
        height: auto;
        display: block !important;
        opacity: 1.0 !important; } }
    .OBWPSlider .slide .content-wrapper {
      vertical-align: middle;
      min-height: inherit;
      height: inherit;
      position: relative;
      display: table-cell; }
    .OBWPSlider .slide .fade-down {
      -webkit-transition: all ease 400ms;
      -moz-transition: all ease 400ms;
      -o-transition: all ease 400ms;
      -ms-transition: all ease 400ms;
      -khtml-transition: all ease 400ms;
      transition: all ease 400ms;
      opacity: 0.0;
      -webkit-transform: translateY(-10px);
      -moz-transform: translateY(-10px);
      -o-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
      -khtml-transform: translateY(-10px);
      transform: translateY(-10px);
      -webkit-transition-delay: 300ms;
      -moz-transition-delay: 300ms;
      -o-transition-delay: 300ms;
      -ms-transition-delay: 300ms;
      -khtml-transition-delay: 300ms;
      transition-delay: 300ms; }
      @media print {
        .OBWPSlider .slide .fade-down {
          opacity: 1.0 !important; } }
    .OBWPSlider .slide.current-slide .fade-down {
      -webkit-transform: translateY(0px);
      -moz-transform: translateY(0px);
      -o-transform: translateY(0px);
      -ms-transform: translateY(0px);
      -khtml-transform: translateY(0px);
      transform: translateY(0px);
      opacity: 1.0; }
  .OBWPSlider .box {
    text-align: left; }
    @media (min-width: 992px) {
      .OBWPSlider .box {
       /*
      * Place box in MD viewport
      * a bit more from the left border
      * to prevent overlapping prev button
      */ } }
    .OBWPSlider .box a {
      color: #fff;
      text-decoration: underline; }
      .OBWPSlider .box a.button {
        text-decoration: none; }
    .OBWPSlider .box h2 {
      color: #fff;
      font-size: 45px;
      margin: 0; }
    .OBWPSlider .box hr {
      border-color: rgba(255, 255, 255, 0.37); }
    .OBWPSlider .box .content {
      font-size: 18px;
      font-weight: 300; }
      .OBWPSlider .box .content .p1:first-child {
        margin: 0;
        text-align: left; }
    .OBWPSlider .box p {
      color: #fff;
      max-width: 500px;
      margin: 25px 0;
      font-size: 18px; }

/*******************************
 * WP WYSWIG image options
 ******************************/
img.alignleft {
  float: left;
  margin: 15px 15px 15px 0; }

img.alignright {
  float: right;
  margin: 15px 0 15px 15px; }

img.alignnone {
  display: block;
  margin: 15px 0; }

img.aligncenter {
  display: block;
  margin: 15px auto; }

/*******************************
 * General Styles
 ******************************/
a {
  color: #BAA866; }
  a:hover {
    color: #cabc89; }

h1, h2, h3, h4, h5 {
  font-family: 'Lora', serif;
  margin: 10px 0; }

h2 {
  font-size: 35px;
  font-weight: 700; }
  @media (min-width: 768px) {
    h2 {
      font-size: 40px; } }

h3 {
  font-size: 25px;
  font-weight: 400;
  letter-spacing: 2px;
  color: #000; }
  @media (min-width: 768px) {
    h3 {
      font-size: 29px; } }

h4 {
  color: #000;
  font-size: 18px;
  font-weight: 400;
  margin: 10px 0;
  letter-spacing: 3px; }

p {
  font-size: 16px;
  font-weight: 300;
  margin: 25px 0; }

::selection {
  background: rgba(186, 168, 102, 0.5); }

::-moz-selection {
  background: rgba(186, 168, 102, 0.5); }

*,
*:before,
*:after {
  box-sizing: border-box;
  -webkit-transition: color 0.3s ease-in-out background 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out background 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out background 0.3s ease-in-out;
  -ms-transition: color 0.3s ease-in-out background 0.3s ease-in-out;
  -khtml-transition: color 0.3s ease-in-out background 0.3s ease-in-out;
  transition: color 0.3s ease-in-out background 0.3s ease-in-out; }

.promos {
  max-width: 1140px;
  margin: 0 auto; }

.promo {
  margin: 1em .5em 1.625em;
  background-color: #fff;
  padding: .25em 0 2em;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  line-height: 1.625;
  color: #444;
  text-align: center; }
  @media (min-width: 40em) {
    .promo {
      display: inline;
      float: left;
      width: 33.333%;
      margin: 1em 0 0; }
      .promo.first {
        border-right: none; }
      .promo.second {
        float: right;
        border-left: none; } }
  .promo h4 {
    margin: .25em 0 0;
    font-size: 170%;
    font-weight: normal; }
  .promo .features {
    margin: 0;
    padding: 0;
    list-style-type: none;
    color: #666; }
  .promo li {
    padding: .25em 0; }
  .promo .brief {
    color: #444; }
  .promo .price {
    margin: .5em 0;
    padding: .25em 0;
    background: #efefef;
    font-size: 250%;
    color: #444; }
  .promo .buy {
    margin: 1em 0 0; }
  .promo button {
    min-width: 50%; }

@media (min-width: 40em) {
  .scale {
    transform: scale(1.2);
    -webkit-box-shadow: 0 1px 1px 1px rgba(20, 20, 20, 0.15);
    -moz-box-shadows: 0 1px 1px 1px rgba(20, 20, 20, 0.15);
    -o-box-shadows: 0 1px 1px 1px rgba(20, 20, 20, 0.15);
    -ms-box-shadows: 0 1px 1px 1px rgba(20, 20, 20, 0.15);
    -khtml-box-shadows: 0 1px 1px 1px rgba(20, 20, 20, 0.15);
    box-shadow: 0 1px 1px 1px rgba(20, 20, 20, 0.15); }
    .scale .price {
      color: #BAA866; } }

[data-toggle="tooltip"] {
  position: relative;
  display: inline-block; }

.tooltip {
  transition: opacity ease .3s;
  background: #444;
  color: #fff;
  max-width: 200px;
  padding: 10px 15px;
  position: absolute; }
  .tooltip:after, .tooltip:before {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none; }
  .tooltip:after {
    border-color: rgba(42, 57, 66, 0);
    border-top-color: #444;
    border-width: 14px;
    margin-left: -14px; }
  .tooltip:before {
    border-color: rgba(0, 0, 0, 0);
    border-top-color: transparent;
    border-width: 16px;
    margin-left: -16px; }

/*******************************
 * Semantic colors
 ******************************/
/*--------------------------------------------------------------------------------------------------------------------*/
/*******************************
 * Generic Colors
 ******************************/
/*
 * The primary color is normally
 * used for important elements
 * the user interacts with.
 */
/*******************************
 * Semantic Colors
 ******************************/
/*
 * Here's the right place
 * to define your css colors
 * to keep your styles flexible.
 */
/*
 * Body
 */
/* TODO: Implement */
/*
 * Footer's background-color and color
 */
/*
 * Header's background-color and color
 */
/* TODO: impelemnt */
/* TODO: impelemnt */
/*
 * Alert colors:
 * Success, Warning and Danger colors
 */
/* e.g. used in contact form error message */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/* TODO: Implement */
/*
 * Text
 */
/*******************************
 * WP WYSWIG image options
 ******************************/
img.alignleft {
  float: left;
  margin: 15px 15px 15px 0; }

img.alignright {
  float: right;
  margin: 15px 0 15px 15px; }

img.alignnone {
  display: block;
  margin: 15px 0; }

img.aligncenter {
  display: block;
  margin: 15px auto; }

/*******************************
 * General Styles
 ******************************/
a {
  color: #BAA866; }
  a:hover {
    color: #cabc89; }

h1, h2, h3, h4, h5 {
  font-family: 'Lora', serif;
  margin: 10px 0; }

h2 {
  font-size: 35px;
  font-weight: 700; }
  @media (min-width: 768px) {
    h2 {
      font-size: 40px; } }

h3 {
  font-size: 25px;
  font-weight: 400;
  letter-spacing: 2px;
  color: #000; }
  @media (min-width: 768px) {
    h3 {
      font-size: 29px; } }

h4 {
  color: #000;
  font-size: 18px;
  font-weight: 400;
  margin: 10px 0;
  letter-spacing: 3px; }

p {
  font-size: 16px;
  font-weight: 300;
  margin: 25px 0; }

::selection {
  background: rgba(186, 168, 102, 0.5); }

::-moz-selection {
  background: rgba(186, 168, 102, 0.5); }

/*
 * Import your styles, which you
 * wish to display in the WYSIQYG
 * editor while editing.
 */
.test-box {
  background-color: #BAA866;
  padding: 30px;
  color: #fff; }

.nice-box {
  background-color: #333A42;
  color: #D4D6D7;
  display: table;
  position: relative; }
  .nice-box:before {
    content: '';
    border-style: solid;
    position: absolute;
    height: 0;
    width: 0;
    clear: both;
    border-width: 0 10px 12px 10px;
    border-color: transparent transparent #333A42 transparent;
    top: -12px;
    left: 40px; }
  .nice-box .box-wrap {
    overflow: hidden; }
  .nice-box .col {
    display: table-cell;
    padding: 20px 30px 40px 30px;
    float: left; }
    @media (min-width: 768px) {
      .nice-box .col {
        float: none; } }
  .nice-box.skew .col {
    padding-right: 100px; }
  .nice-box .last-col {
    background-color: inherit; }
    .nice-box .last-col .fa {
      font-size: 40px; }
    @media (min-width: 992px) {
      .nice-box .last-col {
        -webkit-transition: background-color ease-in-out 100ms;
        -moz-transition: background-color ease-in-out 100ms;
        -o-transition: background-color ease-in-out 100ms;
        -ms-transition: background-color ease-in-out 100ms;
        -khtml-transition: background-color ease-in-out 100ms;
        transition: background-color ease-in-out 100ms;
        vertical-align: top;
        /*
         * TODO: Make independent of height
         */
        text-align: center;
        background: #2C343D; }
        .nice-box .last-col.skew {
          padding: 0; }
          .nice-box .last-col.skew:hover {
            background-color: #4194B5;
            color: #fff; }
        .nice-box .last-col .skew-wrap {
          transform: skew(-12deg);
          padding: 0;
          margin-left: -40px;
          background-color: inherit;
          height: 265px; }
          .nice-box .last-col .skew-wrap .wrap {
            height: inherit;
            transform: skew(12deg);
            padding: 20px 60px; } }

/*
 * Creates a new menu. Use this
 * mixin as your base for the menu
 * and define the single menu levels.
 */
/*
 * false:	Alle child ul
 * 0:		Root level
 * >0:		Specific level
 */
/*******************************
 * Basic dropdown
 ******************************/
/**
 * This function is intented
 * to be placed inside the selector
 * which represents the top level ul.
 *
 * It will add the default css
 * dropdown functionlalities to this class.
 */
/*******************************
 * Default responsive mobile styles
 ******************************/
/*******************************
 * Default vertical dropdown
 ******************************/
/**
 * Creates a default vertical
 * dropdown out of the corresponding ul.
 */
/*******************************
 * jQueryResponsiveNavigation styles
 ******************************/
/*******************************
 * DEV
 ******************************/
/*
 * Mega Menu:
 *	0: Normal
 *	1: Dropdown
 *	2: Column in dropdown from level 1
 * Activatoin:
 * T
 */
@media (min-width: 992px) {
  /*
   * Mega Menu layout is only available
   * in non-mobile viewports.
   * Mobile vierports use the default
   * mobile-optimized layout.
   */
  .responsive-menu.menu-main .mega-menu ul {
    background-color: transparent;
    width: auto; }
  .responsive-menu.menu-main .mega-menu > ul {
    background-color: #333A42;
    width: 500px; }
    .responsive-menu.menu-main .mega-menu > ul:after {
      content: '';
      border-style: solid;
      position: absolute;
      height: 0;
      width: 0;
      clear: both;
      border-width: 0 10px 12px 10px;
      border-color: transparent transparent #333A42 transparent; }
    .responsive-menu.menu-main .mega-menu > ul > li {
      float: left;
      width: auto; }
      .responsive-menu.menu-main .mega-menu > ul > li > a {
        border-bottom: 1px solid #4E4E4E;
        color: #D4D6D7; }
  .responsive-menu.menu-main .mega-menu > ul > li > ul {
    -webkit-box-shadow: none;
    -moz-box-shadows: none;
    -o-box-shadows: none;
    -ms-box-shadows: none;
    -khtml-box-shadows: none;
    box-shadow: none;
    display: block;
    float: left;
    position: static; }
    .responsive-menu.menu-main .mega-menu > ul > li > ul > li > a {
      color: #D4D6D7; } }
/*******************************
 * frontpage styles
 ******************************/
section.main .tiles p {
  margin: 20px 0 30px 0; }
section.main .tiles h3 {
  color: #000;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 3px;
  position: relative;
  padding: 15px 0;
  margin: 15px 0; }
  section.main .tiles h3:after {
    content: "";
    background: #BAA866;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    width: 65px; }
section.main .tiles .image img {
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  /* Firefox 3.5+, IE10 */
  filter: gray;
  /* IE6-9 */
  -webkit-filter: grayscale(100%);
  /* Chrome 19+ & Safari 6+ */
  -webkit-transition: all .6s ease;
  /* Fade to color for Chrome and Safari */
  -webkit-backface-visibility: hidden;
  /* Fix for transition flickering */ }
section.main .tiles .col-sm-6:hover .image img {
  filter: none;
  -webkit-filter: grayscale(0%); }
section.main .tiles .row_1 {
  margin-bottom: 50px; }
section.main .tiles .row_2:first-child {
  margin-bottom: 50px; }
  @media (min-width: 768px) {
    section.main .tiles .row_2:first-child {
      margin-bottom: 0; } }
section.main .contact-details p {
  letter-spacing: 0.5px;
  margin: 10px 0; }
section.main .contact-details .col-md-3 {
  margin-top: 30px; }
  section.main .contact-details .col-md-3:first-child {
    margin-top: 0; }
  @media (min-width: 992px) {
    section.main .contact-details .col-md-3 {
      margin-top: 0; } }

/*******************************
 * Inhaltsseiten styles
 ******************************/
section.main .content h3 {
  margin: 30px 0; }
section.main .content p.signature {
  font-family: Mistral;
  font-size: 45px;
  color: #BAA866; }
  @media (min-width: 768px) {
    section.main .content p.signature {
      font-size: 55px; } }
section.main .content .references img {
  margin: 15px 0; }
section.main .content .OBSlider .control {
  position: relative; }

.info-bar {
  background-color: #BAA866;
  color: #fff; }
  .info-bar a {
    color: white; }
  .info-bar p {
    margin: 1em 0;
    font-weight: 400;
    font-size: 14px; }
    @media (min-width: 992px) {
      .info-bar p {
        font-size: 16px; } }

/*# sourceMappingURL=main.css.map */