/* =Kunde: 	murisolutions
-----------------------------------------------------------------------------*/

/* =Imports
-----------------------------------------------------------------------------*/

@import "css/cookie-modal.css";

@font-face {
  font-family: 'Uni Neue Book';
  src: url('fonts/UniNeueBook.eot'); /* IE9 Compat Modes */
  src: url('fonts/UniNeueBook.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/UniNeueBook.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/UniNeueBook.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('fonts/UniNeueBook.svg#svgFontName') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Uni Neue Heavy';
  src: url('fonts/UniNeueHeavy.eot'); /* IE9 Compat Modes */
  src: url('fonts/UniNeueHeavy.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/UniNeueHeavy.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/UniNeueHeavy.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('fonts/UniNeueHeavy.svg#svgFontName') format('svg'); /* Legacy iOS */
} 


/* =General
-----------------------------------------------------------------------------*/

html  {
	/* 2 */
	-webkit-text-size-adjust: 100%;
	/* 3 */
	background: rgba(255,255,255,1);
	color: rgba(84,84,88,1);
	font: 18px "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
}
body  {
	text-decoration: none;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
header, section, footer {
	display: block;
	clear: both;
	float: none;
}


/* =Helper
-----------------------------------------------------------------------------*/


/* =Links
-----------------------------------------------------------------------------*/

a, .uk-link {
  color: rgba(55,95,120,1);
  text-decoration: none;
  cursor: pointer;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
a:hover, a:focus, a:hover, .uk-link:hover {
  color: rgba(0,0,0,1);
  text-decoration: none;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
::-moz-selection { 
	background: rgba(165,185,0,1); color: #fff; text-shadow:none; 
}
::selection { 
	background: rgba(165,185,0,1); color: #fff; text-shadow:none; 
}

/* =Typography
-----------------------------------------------------------------------------*/

* + h1, * + .uk-h1, * + h2, * + .uk-h2, * + h3, * + .uk-h3, * + h4, * + .uk-h4, * + h5, * + .uk-h5, * + h6, * + .uk-h6 {
    margin-top: 0px;
}
h1 {
	font: normal normal 2.8rem/1.3em "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
	padding-top: 20px;
	padding-bottom: 0;
	color: rgba(55,95,120,1);
}
h2, .uk-h2 {
	font: 1.8em/1.4em "Uni Neue Heavy", Arial, Helvetica, Geneva, sans-serif;
	margin-bottom: 10px;
	margin-top: 30px;
	color: rgba(55,95,120,1);
	text-transform: lowercase;
}
.uk-accordion-title {
	font: 1.8em/1.4em "Uni Neue Heavy", Arial, Helvetica, Geneva, sans-serif;
	color: rgba(55,95,120,1);
	text-transform: lowercase;
}
h3, .uk-h3 {
	font: normal normal 1.1em/1.4em "Uni Neue Heavy", Arial, Helvetica, Geneva, sans-serif;
	margin-bottom: 10px;
	margin-top: 30px;
	color: rgba(165,185,0,1);
}
h4, .uk-h4 {
	font: 1em/1.4em "Uni Neue Heavy", Arial, Helvetica, Geneva, sans-serif;
	margin-bottom: 20px;
	margin-top: 6px;
	color: rgba(55,95,120,1);
}
strong, .uk-strong {
	font: 1em/1.45em "Uni Neue Heavy", Arial, Helvetica, Geneva, sans-serif;
}
p {
	font: 1em/1.45em "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
	
}
ul {
	 margin: 0 0 0 15px;
	 padding: 0;
}

ul li {
	 list-style-image: url(img/plus.svg);
}


/* =Color
-----------------------------------------------------------------------------*/
.blau, .uk-primary {
	background-color: rgba(55,95,120,1);
	color: rgba(255,255,255,1);
}
.gruen, .uk-secondary {
	background-color: rgba(165,185,0,1);
	color: rgba(255,255,255,1);
}
.hellgrau {
	background-color: rgba(230,240,242,1);
}


/* =Grid
-----------------------------------------------------------------------------*/
.grid > *:not(:last-child) {
	margin-right: 20px;
	margin-bottom: 60px;
}
.grid > .column-12 {
	width: calc(100% - 20px);
}
.grid > .column-6 {
	width: calc(50% - 20px);
}
.grid > .column-4 {
	width: calc(33% - 20px);
}
.grid > .column-3 {
	width: calc(25% - 20px);
}
.grid figure {
	overflow: hidden;
}
.video iframe {
    height: 430px;
    width: 100%;
}
.fullBG  {
	height: 100vh;
    background-color: rgba(246, 246, 248, 1);
	position: fixed;
}
.max-width {
	margin-left: 50vw;
	margin-top: 100px;
	margin-bottom: 100px;
}
.max-width > div {
	max-width: 800px;
}

/* = Header
-----------------------------------------------------------------------------*/
header > .uk-navbar-transparent {
	position: fixed;
	z-index: 1000;
	top: 0px;
	right: 0;
	left: 0;
	background-color: rgba(255,255,255,0);
	height: 0px;
}
header > .uk-navbar-sticky {
	height: 50px;
	background-color: rgba(255,255,255,1);
	-webkit-transition: all .35s ease-in-out;
	   -moz-transition: all .35s ease-in-out;
	     -o-transition: all .35s ease-in-out;
	        transition: all .35s ease-in-out;
}

/* =Logo
-----------------------------------------------------------------------------*/
header > .uk-navbar-transparent a.logo img:first-of-type {
	display: block;
	height: 100px;
	position: absolute;
	top: 30px;
	right: 40px;
	opacity: .8;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
header > .uk-navbar-sticky a.logo img:first-of-type {
	display: block;
	height: 40px;
	position: absolute;
	top: 10px;
	right: 20px;
	opacity: 1;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}

/* =Navigation
-----------------------------------------------------------------------------*/
header > .uk-navbar-transparent .nav {
	position: absolute;
	top: 80px;
	left: 40px;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
header > .uk-navbar-sticky .nav {
	position: absolute;
	top: 15px;
	left: 40px;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}

.uk-navbar-nav > li a {
	font-family: "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
	font-size: 1.2rem;
	text-transform: lowercase;
    column-gap: 0.25em;
    min-height: 20px;
}

header > .uk-navbar-transparent .uk-navbar-nav > li a,
header > .uk-navbar-sticky .uk-navbar-nav > li a {
	color: rgba(55,95,120,1);
	padding-top: 0px;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}

header > .uk-navbar-transparent .uk-navbar-nav > li a:hover,
header > .uk-navbar-sticky .uk-navbar-nav > li a:hover,
header .uk-navbar-nav > li.uk-active a {
	color: rgba(165,185,0,1);
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}



/* = Plus
-----------------------------------------------------------------------------*/
.plus {
	margin-right: auto;
	margin-left: auto;
	margin-top: 200px;
}
.plus svg {
	width: 700px;
	height: 700px;
	margin-right: auto;
	margin-left: auto;
	display: block;
}
.plus svg a {
	opacity: .5;
}
.plus svg a:hover {
	opacity: 1;
}

#Mitte {
	fill: rgba(165,185,0,1);
    animation: fadeInOut0 15s ease forwards infinite
}
#Oben {
	fill: rgba(55,95,120,1);
    animation: fadeInOut1 15s ease forwards infinite
}
#Rechts {
	fill: rgba(55,95,120,1);
    animation: fadeInOut2 15s ease forwards infinite
}
#Unten {
	fill: rgba(165,185,0,1);
    animation: fadeInOut3 15s ease forwards infinite
}
#Links {
	fill: rgba(165,185,0,1);
    animation: fadeInOut4 15s ease forwards infinite
}

/* = Animation
-----------------------------------------------------------------------------*/
@keyframes fadeInOut1 {
    0% { opacity: 0.2 }
    10% { opacity: 0.2 }
    15% { opacity: 1 }
    90% {opacity: 1 }
    95% { opacity: 0.2 }
    100% { opacity: 0.2 }
}
@keyframes fadeInOut2 {
    0% { opacity: 0.2 }
    15% {opacity: 0.2 }
    20% { opacity: 1 }
    90% { opacity: 1 }
    95% { opacity: 0.2 }
    100% { opacity: 0.2 }
}
@keyframes fadeInOut3 {
    0% { opacity: 0.2 }
    20% {opacity: 0.2 }
    25% {opacity: 1 }
    90% { opacity: 1 }
    95% { opacity: 0.2 }
    100% { opacity: 0.2 }
}
@keyframes fadeInOut4 {
    0% { opacity: 0.2 }
    25% { opacity: 0.2 }
    30% { opacity: 1 }
    90% { opacity: 1 }
    95% { opacity: 0.2 }
    100% { opacity: .20 }
}
@keyframes fadeInOut0 {
    0% { opacity: 0.2 }
    5% { opacity: 1 }
    90% { opacity: 1 }
    95% { opacity: 0.2 }
    100% { opacity: 0.2 }
}

/* = Textvorschau
-----------------------------------------------------------------------------*/
.posTopLeft {
	position: absolute;
	text-align: right;
	top: -10px;
	left: 0px;
	width: 460px;
	opacity: .5;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
.posTopRight {
	position: absolute;
	top: -10px;
	right: 0px;
	width: 460px;
	opacity: .5;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
.posBotLeft  {
	position: absolute;
	text-align: right;
	top: 430px;
	left: 0px;
	width: 460px;
	opacity: .5;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}
.posBotRight {
	position: absolute;
	top: 430px;
	right: 0px;
	width: 460px;
	opacity: .5;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}

.posTopLeft:hover, .posTopRight:hover, .posBotLeft:hover, .posBotRight:hover {
	opacity: 1;
	-webkit-transition: all .15s ease-in-out;
	   -moz-transition: all .15s ease-in-out;
	     -o-transition: all .15s ease-in-out;
	        transition: all .15s ease-in-out;
}

.frontBtn {
	display: inline-block;
	background: rgba(165,185,0,1); 
	color: #fff;
	padding: 2px 12px;
	border-radius: 12px;
}
.frontBtn:hover {
	background: rgba(55,95,120,1); 
}



/* =Misc
-----------------------------------------------------------------------------*/


.colophon{
	display:block;
	position:fixed;
	bottom:25px;
	left:25px;
	width:25px;
	height:25px;
	background:url(img/Designheit-Bildmarke.svg) no-repeat right bottom;
	opacity: 0.05;
	filter: alpha(opacity=5);
	-webkit-transition: all .15s ease-in-out;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;
	transition: all .15s ease-in-out;
}

.colophon:hover{
	opacity:1;
	filter: alpha(opacity=100);
}

footer {
	position: relative;
	background-color: rgba(255,255,255,1);
	padding-top: 40px;
	padding-bottom: 60px;
}
footer > div {
	width: 890px;
	max-width: calc(100% - 40px);
	margin-right: auto;
	margin-left: auto;
}
footer p {
	padding-top: 0px;
	color: rgba(55,95,120,1);
	padding-left: 0px;
}
footer img {
	width: 30px;
}
footer img:first-of-type {
	float: right;
	margin-top: -30px;
}
footer img:nth-of-type(2) {
}
footer ul {
	margin-left: 40px;
	margin-top: 30px;
}
footer ul:nth-of-type(2) {
	margin-top: 0px;
	margin-bottom: 10px;
}
footer ul li, footer ul li p {
	list-style-image: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: inline-block;
}
footer ul li:after {
	content: ".";
	padding-right: 5px;
	padding-left: 5px;
}

/* @l – Laptop / Tablet Landscape */

@media (max-width: 1200px) {
.colophon{
	display:none;
}
header > .uk-navbar-transparent a.logo img:first-of-type {
	height: 80px;
	top: 30px;
	right: 30px;
}
header > .uk-navbar-transparent .nav {
	top: 65px;
	left: 40px;
}
.max-width {
	margin-left: 33vw;
	margin-top: 120px;
	margin-bottom: 100px;
}
.max-width > div {
	max-width: 100%;
}
.posTopLeft,
.posTopRight, 
.posBotLeft,
.posBotRight {
	width: 340px;
}

}
/* @m – Tablet Portrait */

@media (max-width: 960px) {
.colophon{
	display:none;
}
.grid {
	display: block;
}
.grid > .column-6 {
	width: 100%;
	margin-right: 0px;
}
.grid > .column-4 {
	width: 100%;
	margin-right: 0px;
}
.posTopLeft,
.posTopRight, 
.posBotLeft,
.posBotRight {
	width: 240px;
}
.plus svg {
    width: 250px;
    height: 700px;
}
.max-width {
    margin-left: 20px;
    margin-top: 400px;
    margin-bottom: 100px;
}
.fullBG {
    height: 60vh;
    background-color: rgba(246, 246, 248, 1);
    position: relative;
}

header > .uk-navbar-transparent, header > .uk-navbar-sticky {
	height: 60px;
	background-color: rgba(255,255,255,1);
}

header > .uk-navbar-transparent a.logo img:first-of-type,
header > .uk-navbar-sticky a.logo img:first-of-type {
	height: 40px;
	top: 10px;
	right: 20px;
}
header > .uk-navbar-transparent .nav {
	position: absolute;
	top: 80px;
	left: 40px;
}
header > .uk-navbar-sticky .nav {
	position: absolute;
	top: 15px;
	left: 40px;
}
.menuMobile {
	position: fixed;
	top: 20px;
	left: 20px;
}

.uk-navbar-nav > li a {
	font-family: "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
	font-size: 1.2rem;
	text-transform: lowercase;
    column-gap: 0.25em;
    min-height: 20px;
}

header > .uk-navbar-transparent .uk-navbar-nav > li a,
header > .uk-navbar-sticky .uk-navbar-nav > li a {
	color: rgba(55,95,120,1);
	padding-top: 0px;
}

header > .uk-navbar-transparent .uk-navbar-nav > li a:hover,
header > .uk-navbar-sticky .uk-navbar-nav > li a:hover,
header .uk-navbar-nav > li.uk-active a {
	color: rgba(165,185,0,1);
}

footer ul:first-of-type li:first-of-type {
	display: block;
}

}

/* @s – Phone Portrait */
@media (max-width: 640px) {
.colophon{
	display:none;
}
h1 {
	font: normal normal 2.2rem/1.1em "Uni Neue Book", Arial, Helvetica, Geneva, sans-serif;
	padding-top: 20px;
}
.plus svg {
    width: 250px;
    height: 300px;
}
.posTopLeft,
.posTopRight, 
.posBotLeft,
.posBotRight {
	position: relative;
	text-align: left;
	top: 0px;
	left: auto;
	right: auto;
	opacity: 1;
}
.max-width {
    margin-left: 20px;
    margin-top: 400px;
    margin-bottom: 100px;
}
.uk-drop {
    width: 100%;
}
.fullBG {
    height: 40vh;
    background-color: rgba(246, 246, 248, 1);
    position: relative;
}
  
  }