/* -----------   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   ------------------------------------------
   ---------------------------------------------------------------------- */
body {
  text-align: center;
}
img#logo {
  height: 100px;
  width: 100px;
}
img#graphic {
  width: 90%;
  max-width: 750px;
  margin: 40px;
}
div.cite {
  width: 90%;
  background: #f2f2f2;
  margin: 16px auto;
  padding: 4px;
}
div.cite > div {
  display: inline-block;
}
h1 {
  color: #b52822;
}
div.cite > div > p {
  margin: 8px;
}
div.cite > div > p:nth-child(1):before,
div.cite > div > p:nth-child(1):after {
  content: "\"";
}
div.cite > div > p {
  margin: 8px;
}
div.cite > div > p:nth-child(1) {
  font-weight: bolder;
  margin-bottom: 4px;
}
div.cite > div > p:nth-child(2) {
  text-align: center;
  margin-top: 4px;
  font-size: smaller;
  font-weight: lighter;
}
div.module {
  max-width: 750px;
  margin: 20px auto;
  padding: 8px;
  text-align: left;
}
ul.features {
  display: inline-block;
}
ul.features li {
  text-align: left;
}
ul.stars > li {
  background: url(../img/star.png) no-repeat left top;
  padding: 5px 0 5px 35px;
  min-height: 32px;
  list-style-type: none;
  margin: 0;
}
/* MODULES */
div.floating.colored-box {
  display: inline-block;
  width: 48.5%;
  margin: 1.5%;
  position: relative;
  float: left;
  font-size: 12.75px;
  font-size: 85%;
  font-size: 0.85rem;
  /*font-size: ~"@{vwSize}vw"; */
  background: #046cb4;
  border: 6px solid #046cb4;
}
div.floating.colored-box:nth-of-type(odd) {
  margin-left: 0;
}
div.floating.colored-box:nth-of-type(even) {
  margin-right: 0;
}
div.floating.colored-box > :nth-child(1) {
  display: block;
  font-size: 21px;
  font-size: 140%;
  font-size: 1.4rem;
  /*font-size: ~"@{vwSize}vw"; */
  color: #fff;
  text-align: left !important;
  width: 100%;
}
div.floating.colored-box > :nth-child(2) {
  display: block;
  min-height: 150px;
  padding: 25px 15px 25px 25px;
  background: #fff;
  border-top: 6px solid #b52822;
  line-height: 1.5;
}
div.floating.colored-box > :nth-child(2) > ul.features-info {
  display: block;
  width: 100%;
}
div.floating.colored-box > :nth-child(2) > ul.features-info > li {
  display: inline-block;
  width: 49%;
}
div.floating.colored-box > :nth-child(2) > ul.features-info > li:nth-of-type(1) {
  text-align: left;
}
div.floating.colored-box > :nth-child(2) > ul.features-info > li:nth-of-type(2) {
  text-align: right;
}
#modules .colored-box.floating .material-icons {
  font-size: 17pt;
}
#modules .colored-box.floating > :nth-child(1) {
  padding: 10px;
}
#modules .colored-box.floating .features-info {
  padding-top: 10px;
}
#team .colored-box.floating > :nth-child(1) {
  padding: 8px;
  background: #fff;
}
#team .colored-box.floating > :nth-child(1) img {
  height: 60px;
  margin: 0 auto;
  display: block;
}
#team .colored-box.floating > :nth-child(1):hover img {
  /**
				 * --- 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;
}
#team .colored-box.floating > :nth-child(2) {
  background: none;
  color: #fff;
  text-align: left;
}
@media (max-width: 768px) {
  div.floating.colored-box {
    display: block;
    width: 100%;
    margin: 30px 0;
    float: none;
  }
}
