/* -----------   IMPORT DEFAULT   ---------------------------------------
   ---------------------------------------------------------------------- */
/* ----------------------------------------------------------------------
	LESS > MIXINS / SHORTCUTS / PRESETS
   ---------------------------------------------------------------------- */
/* Misc */
/*

    .opacity (@opacity: 0.5)
    .scroll-flow-touch
    .noisy-bg (@bg-color)
    .background-size (@size) */
/* Element Appearance */
/*

    .box-shadow (@x, @y, @blur, @color)
    .drop-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25)
    .inner-shadow (@x: 0, @y: 1px, @blur: 2px, @spread: 0, @alpha: 0.25)
    .border-radius (@top-left: 0, @top-right: 0, @bottom-right: 0, @bottom-left: 0)
    .gradient (@startColor: #eee, @endColor: white)
    .horizontal-gradient (@startColor: #eee, @endColor: white)
        .box-sizing (@type: border-box) */
/* Text / Font */
/*

    .font-size(@size)
    .text-shadow (@string: 0 1px 3px rgba(0, 0, 0, 0.25))
    .no-wrap
    .word-wrap */
/* Transition & Transform */
/* Quick-Presets */
/*
    .scale (@factor)
    .rotate (@deg)
    .skew (@deg, @deg2) */
/* Animation & Transition */
/*
    .animation (@name, @duration: 300ms, @delay: 0, @ease: ease)
    .transition (@transition)
         * transition-property
         * transition-duration
         * transition-timing-function --- linear | ease | ease-in | ease-out | ease-in-out
         * transition-delay */
/* Transform */
/*
    .transform-simple (@transform-function, @transform-origin: 50% 50% 0)
         * @transform-function ---
           scale(x,y) | scale3d(x,y,z) | scaleX(x) | scaleY(y) | scaleZ(z)
           rotate(angle) | rotate3d(x,y,z,angle) | rotateX(angle) | rotateY(angle) | rotateZ(angle)
           translate(x,y) | translate3d(x,y,z) | translateX(x) | translateY(y) | translateZ(z)
           skew(x-angle,y-angle) | skewX(angle) | skewY(angle)
           matrix(n,n,n,n,n,n) | matrix3d (n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)
           perspective(n)
    .transform (@transform-function, @transform-origin: 50% 50% 0, @transform-style: flat, @perspective: none, @perspective-origin: 50% 50%, @backface-visibility: visible)
         * --- http://www.w3schools.com/cssref/css3_pr_transform.asp ---
         *
         * @transform-function:  scale(x,y) | scale3d(x,y,z) | scaleX(x) | scaleY(y) | scaleZ(z)
         *                       rotate(angle) | rotate3d(x,y,z,angle) | rotateX(angle) | rotateY(angle) | rotateZ(angle)
         *                       translate(x,y) | translate3d(x,y,z) | translateX(x) | translateY(y) | translateZ(z)
         *                       skew(x-angle,y-angle) | skewX(angle) | skewY(angle)
         *                       matrix(n,n,n,n,n,n) | matrix3d (n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)
         *                       perspective(n)
         *
         * @transform-origin
         *           x-axis:     left | center | right | length | %
         *           y-axis:     top | center | bottom | length | %
         *           z-axis:     length
         *
         * @transform-style:     flat | preserve-3d
         *
         * @perspective:         length (recommended range: 0-2000)
         *
         * @perspective-origin
         *            x-axis:    left | center | right | length | %
         *            y-axis:    top | center | bottom | length | %
         *
         * @backface-visibility: visible | hidden
    .alt--- !

/* Translate */
/*
    .translate (@x, @y:0)
    .translate3d (@x, @y: 0, @z: 0) */
#less {
  /* Misc */
  /* Text / Font */
  /* Element Appearance */
  /* Shortcut needed? */
  /* Transition & Transform */
  /* Quick-Presets */
  /* scale  rotate  skew */
  /* Animation & Transition */
  /* NOT WORKING !!!
   .keyf (@name, @frames) {
      @-webkit-keyframes @name {
          @frames;
      }
      @keyframes @name {
          @frames;
      }
  } */
  /* Transform */
  /* transform  transform-origin  perspective */
  /* Alternativ (nicht immer vollständige Definition inkl. vordefinierter Regeln) */
  /* Translate */
  /* translate  translate3d */
}
#less .pointer {
  cursor: pointer;
}
#less .scroll-flow-touch {
  /** softer scrolling on iOS/Android for containers */
  -webkit-overflow-scrolling: touch;
}
#less .no-wrap {
  white-space: nowrap;
}
#less .word-wrap {
  word-wrap: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}
/* ----------------------------------------------------------------------
	FONTS
   ---------------------------------------------------------------------- */
/*
    * see assets/font/fonts.css
    * Cross-Browser Support :: WOFF or TTF/OTF
 */
/* ----------------------------------------------------------------------
	COLOR PALETTE
   ----------------------------------------------------------------------

	/* Corporate Design Colors */
/*neutral*/
/*main 1*/
/*main 2*/
/*accents*/
/* Accent Shades */
/* Default Colors */
/* Text | Light Theme */
/* Text | Dark Theme */
/* Backgrounds | Light / Dark Theme (e.g. Apps) */
/* grey 50 */
/* dialog/cars */
/* app bar, grey 100 */
/* os status bar, grey 300 */
/* default */
/* dialog/cars, grey 800 */
/* app bar, grey 900 */
/* os status bar, black */
/* -----------   PAGE STATIC   ------------------------------------------
   ---------------------------------------------------------------------- */
#header__main,
#header__main > .section__inner > .header__inner > .header__bar {
  background-image: url("/jakarta.faces.resource/smarthome/andynformatics_header-smarthome.jpg.html?ln=img");
}
/*.section__inner {
      .center-block {
          display: inline-block;
          width: auto;
          margin: 0 auto;
          text-align: left;
      }
  }*/
/* TOP */
.section--1 > .section__inner h3 {
  margin-bottom: 0px !important;
}
.section--1 > .section__inner h4 {
  margin-top: 0px !important;
  line-height: 1 !important;
}
/* UNSERE SYSTEME */
/* UNSERE PARTNER */
#systems > .section__inner > .grid,
#partners > .section__inner > .grid {
  margin-top: 50px;
}
#systems > .section__inner > .grid > div,
#partners > .section__inner > .grid > div {
  height: 150px;
  float: left;
  text-align: center;
  vertical-align: middle;
}
#systems > .section__inner > .grid > div > a,
#partners > .section__inner > .grid > div > a {
  display: block;
  width: 100%;
  height: 100%;
  border-bottom: none !important;
}
#systems > .section__inner > .grid > div > a > .helper,
#partners > .section__inner > .grid > div > a > .helper {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
#systems > .section__inner > .grid > div > a > img,
#partners > .section__inner > .grid > div > a > img {
  max-height: 80%;
  max-width: 80%;
  vertical-align: middle;
  /**
     * NON-SHORTCUT:
     * transition-property: @transition-property;
     * transition-duration: @transition-duration;
     * transition-timing-function: @transition-timing-function;
     * transition-delay: @transition-delay;
     *
     * @transition-timing-function: linear | ease | ease-in | ease-out | ease-in-out
     *
     */
  -webkit-transition: all 180ms ease-out 0ms;
  -moz-transition: all 180ms ease-out 0ms;
  -ms-transition: all 180ms ease-out 0ms;
  -o-transition: all 180ms ease-out 0ms;
  transition: all 180ms ease-out 0ms;
}
#systems > .section__inner > .grid > div > a > img.logo-ftl,
#partners > .section__inner > .grid > div > a > img.logo-ftl {
  max-width: 140px;
}
#systems > .section__inner > .grid > div > a:hover > img,
#partners > .section__inner > .grid > div > a:hover > img {
  cursor: pointer;
  /**
     * --- http://www.w3schools.com/cssref/css3_pr_transform.asp ---
     *
     * @transform-function:  scale(x,y) | scale3d(x,y,z) | scaleX(x) | scaleY(y) | scaleZ(z)
     *                       rotate(angle) | rotate3d(x,y,z,angle) | rotateX(angle) | rotateY(angle) | rotateZ(angle)
     *                       translate(x,y) | translate3d(x,y,z) | translateX(x) | translateY(y) | translateZ(z)
     *                       skew(x-angle,y-angle) | skewX(angle) | skewY(angle)
     *                       matrix(n,n,n,n,n,n) | matrix3d (n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)
     *                       perspective(n)
     *
     * @transform-origin
     *           x-axis:     left | center | right | length | %
     *           y-axis:     top | center | bottom | length | %
     *           z-axis:     length
     *
     */
  -webkit-transform: scale(1.07);
  -moz-transform: scale(1.07);
  -o-transform: scale(1.07);
  -ms-transform: scale(1.07);
  transform: scale(1.07);
  -webkit-transform-origin: 50% 50% 0;
  -moz-transform-origin: 50% 50% 0;
  -o-transform-origin: 50% 50% 0;
  -ms-transform-origin: 50% 50% 0;
  transform-origin: 50% 50% 0;
}
/* ---------------------------------------------------------------------- */
/* ---------------------------------------------------------------------- */
/* ---------------------------------------------------------------------- */
/* -----------   IMPORT DEFAULT   ---------------------------------------
   ---------------------------------------------------------------------- */
/* -----------   RESPONSIVE   -------------------------------------------
   ---------------------------------------------------------------------- */
@media (max-width: 1024px) {
  #systems > .section__inner > .grid > h5,
  #partners > .section__inner > .grid > h5 {
    font-size: 18px;
    font-size: 120%;
    font-size: 1.2rem;
    /*font-size: ~"@{vwSize}vw"; */
  }
  #systems > .section__inner > .grid > div,
  #partners > .section__inner > .grid > div {
    width: 50%;
  }
}
@media (max-width: 480px) {
  #systems > .section__inner > .grid > div,
  #partners > .section__inner > .grid > div {
    display: block;
    width: 100%;
    margin: 30px 0;
    float: none;
  }
}