.uk-section-pale {
	background-color: #FFF2DC;
}

.uk-section-pale-green {
	background-color: #D8E8C5;
}

.uk-section-brown1 {
	background-color: #F4E2CC;
}

.uk-section-grey {
	background-color: #F8F8F8;
}

.ruv-blue {
	background-color: #001957;
}

.uk-section-ruv-blue {
	background-color: #001957;
}

.ruv-logo-margin {
	margin-left: 21px;
	margin-top: 36px;
}

.ruv-logo-size-mobile {
	width: 151px;
	height: 56px;	
}

.hero-text-box {
	max-width: 617px;
	padding-left: 77px;
	padding-top: 48px;
	padding-bottom: 48px;
}

.hero-text-box-mobile {
	padding-left: 24px;
	padding-top: 31px;
	padding-bottom: 31px;
	height:50%;
}

.picture-size {
	width: 160px;
	height: 160px;
}

.uk-card-small { 
	padding-left: 35px !important;
	padding-right: 25px !important;
	padding-top: 30px !important;
	padding-bottom: 30px !important;
	border-radius: 5px;
}

.uk-label {
	padding-right: 0px !important;
	background-color: #ffffff !important;
}

.uk-label-green {
	background-color: #A7D54C !important;
}

.uk-card-badge {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 1;
}

.ruv-dot {
	width: 20px;
	height: 20px;
	background-color: #ffffff;
	border: solid 3px #ADADAD;
}

.ruv-dot-active {
	width: 20px;
	height: 20px;
	background-color: #ADADAD;
	border: solid 3px #ADADAD;
}

/*
 * Colors
 */



/*
 * Fonts
 */
 
@font-face { font-family: 'Marselis Fett';
             src: url('../fonts/FFMarselisforRuV-Bd.ttf') format('truetype');
             font-weight: bold;
             }
             
@font-face { font-family: 'Marselis Regular';
             src: url('../fonts/FFMarselisforRuV.ttf') format('truetype');
             }
             
@font-face { font-family: 'Marselis Slab Fett';
             src: url('../fonts/FFMarselisforRuVSlab-Bold.ttf') format('truetype');
             font-weight: bold;
             }
             
@font-face { font-family: 'Marselis Slab Regular';
             src: url('../fonts/FFMarselisforRuVSlab.ttf') format('truetype');
             }

.ruv-orange-font {
	color: #FFA100;
}

.ruv-dark-orange-font {
	color: #FF8213;
}

.ruv-white-font {
	color: #ffffff !important;
}

.ruv-blue-font {
	color: #001957;
}

.sub-headline {	
	font-size: 28px;
	line-height: 40px;
}

.headline-hero {
	font-size: 72px;
	font-weight: 700;
}

/*
 * Display Fonts
 */

.ruv-display-1 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 80px;
	line-height: 100px;
}

.ruv-display-2 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 72px;
	line-height: 80px;
}

.ruv-display-3 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 60px;
	line-height: 72px;
}

.ruv-display-4 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 52px;
	line-height: 60px;
}

/* 
 * Headline Fonts
 */

.ruv-heading {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 60px;
	line-height: 72px;
}

.ruv-heading-2 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 52px;
	line-height: 60px;
}

.ruv-heading-3 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 44px;
	line-height: 52px;
}

.ruv-heading-4 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 36px;
	line-height: 44px;
}

.ruv-heading-5 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 28px;
	line-height: 36px;
}

.ruv-heading-6 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 24px;
	line-height: 32px;
}

.ruv-heading-7 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 20px;
	line-height: 28px;
}

.ruv-heading-8 {
	font-family: "Marselis Fett", arial, sans-serif;
	font-size: 18px;
	line-height: 26px;
	font-weight: bold;
}

/* 
 * Topline Fonts
 */

.ruv-topline-large {
	font-family: "Marselis Slab Fett", arial;
	font-size: 22px;
	line-height: 32px;
}

.ruv-topline-medium {
	font-family: "Marselis Slab Fett", arial;
	font-size: 18px;
	line-height: 24px;
}

.ruv-topline-small {
	font-family: "Marselis Slab Fett", arial;
	font-size: 16px;
	line-height: 24px;
}

/* 
 * Lead Text
 */
 
 .ruv-lead-text-large-slab {
	font-family: "Marselis Slab Regular", arial, sans-serif;
	font-size: 28px;
	line-height: 40px;
}

 .ruv-lead-text-small-slab {
	font-family: "Marselis Slab Regular", arial, sans-serif;
	font-size: 20px;
	line-height: 28px;
}

 .ruv-lead-text-large-sans {
	font-family: "Marselis Regular", arial, sans-serif;
	font-size: 28px;
	line-height: 40px;
}

 .ruv-lead-text-small-sans {
	font-family: "Marselis Regular", arial, sans-serif;
	font-size: 20px;
	line-height: 28px;
}

/* 
 * Copy Text
 */

p {
	font-family: "Marselis Regular", sans-serif;
	font-size: 20px;
}

.ruv-copy-text-large {
	font-family: "Marselis Regular", sans-serif;
	font-size: 20px;
	line-height: 28px;
}

.ruv-copy-text-small {
	font-family: "Marselis Regular", sans-serif;
	font-size: 18px;
	line-height: 26px;
}

.ruv-copy-text-xsmall {
	font-family: "Marselis Regular", sans-serif;
	font-size: 16px;
	line-height: 24px;
}

.arrow {
	width: 20px;
	height: 20px;
}

@media screen and (max-width: 460px) {

/* 
 * Schriftgrößen Mobile 
 */

	p {
		font-family: "Marselis Regular", sans-serif;
		font-size: 18px;
	}

	.ruv-display-3 {
		font-family: "Marselis Fett", arial, sans-serif;
		font-size: 28px;
		line-height: 36px;
	}
	
	.ruv-heading-4 {
		font-family: "Marselis Fett", arial, sans-serif;
		font-size: 28px;
		line-height: 36px;
	}	
	
	.ruv-heading-4-mobile {
		font-family: "Marselis Fett", arial, sans-serif;
		font-size: 36px;
		line-height: 44px;
	}		
	
	.ruv-lead-text-large-slab {
		font-family: "Marselis Slab Regular", arial, sans-serif;
		font-size: 18px;
		line-height: 26px;
	}
	
/* 
 * Partnerschaftsrad Mobile 
 */
	
	.rad {
		background-image: url(../img/guy.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 64px !important;
	}
	
	.img_unt_back {
		width: 143px !important;
		height: 141px !important;
		background-image: url('../img/unternehmen.png');
		background-repeat: no-repeat;
		background-size: 143px !important;
	}
	
	.img_unt_back:hover {
		width: 143px !important;
		height: 141px !important;
		background-image: url('../img/unternehmen_hover.png');
		background-repeat: no-repeat;
		background-size: 143px !important;
	}
	
	.img_mit_back {
		width: 141px !important;
		height: 141px !important;
		background-image: url('../img/mitarbeiter.png');
		background-repeat: no-repeat;
		background-size: 141px !important;
	}
	
	.img_mit_back:hover {
		width: 141px !important;
		height: 141px !important;
		background-image: url('../img/mitarbeiter_hover.png');
		background-repeat: no-repeat;
		background-size: 141px !important;
	}
	
	.img_kun_back {
		width: 144px !important;
		height: 143px !important;
		background-image: url('../img/kunden.png');
		background-repeat: no-repeat;
		background-size: 144px !important;
	}
	
	.img_kun_back:hover {
		width: 144px !important;
		height: 143px !important;
		background-image: url('../img/kunden_hover.png');
		background-repeat: no-repeat;
		background-size: 144px !important;
	}
	
	.img_sie_back {
		width: 143px !important;
		height: 142px !important;
		background-image: url('../img/sie.png');
		background-repeat: no-repeat;
		background-size: 143px !important;
	}
	
	.img_sie_back:hover {
		width: 143px !important;
		height: 142px !important;
		background-image: url('../img/sie_hover.png');
		background-repeat: no-repeat;
		background-size: 143px !important;
	}

	.img_unt:hover {
		content: url('../img/unternehmen_hover.png');
	}
	
	.img_mit:hover {
		content: url('../img/mitarbeiter_hover.png');
	}
	
	.img_kun:hover {
		content: url('../img/kunden_hover.png');
	}
	
	.img_sie:hover {
		content: url('../img/sie_hover.png');
	}
	
	.uk-tooltip {
		font-family: "Marselis Regular", sans-serif; 
		background-color: #fff;
		color: #001957;
		font-size: 20px;
		max-width: 260px;
		border-radius: 5px;
		padding: 20px;
		box-shadow: 0 0 15px rgb(0,0,0,0.15);
	}

}

.blank-space {
	height: 30px;
}

.size-scroll {
	height: 50px;
}


.uk-container-large {
  max-width: 1440px !important;
}

.ruv-height-hero-mobile {
	height: 50%;
}

.ruv-width-hero-claim {
	max-width: 617px;
} 

/* 
 * Buttons
 */

.uk-button-ruv {
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 18px;
	padding-bottom: 18px;
	background-color: #00E6E6;
	border-radius: 5px;
	font-size: 20px;
	color: #001957;
	font-weight: bold;
}

.uk-button-ruv:hover {
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 18px;
	padding-bottom: 18px;
	background-color: #00FAFA;
	border-radius: 5px;
	font-size: 20px;
	color: #001957;
	font-weight: bold;
}
	
.uk-button-ruv:active {
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 18px;
	padding-bottom: 18px;
	background-color: #01E6E6;
	border-radius: 5px;
	font-size: 20px;
	color: #001957;
	font-weight: bold;
}

.uk-button-ruv-outline {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 18px;
	padding-bottom: 18px;	
	border-radius: 10px;
	border: 3px solid #00E6E6 !important;
	font-size: 20px;
	color: #00E6E6 !important;
	font-weight: bold;
}

.uk-button-ruv-outline-primary {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 18px;
	padding-bottom: 18px;	
	border-radius: 10px;
	border: 3px solid #00E6E6 !important;
	font-size: 20px;
	color: #001957 !important;
	font-weight: bold;
}

.uk-button-ruv-outline:hover {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 18px;
	padding-bottom: 18px;	
	border-radius: 10px;
	border: 3px solid #00FAFA !important;
	font-size: 20px;
	color: #00FAFA !important;
	font-weight: bold;
}

.uk-button-ruv-outline:active {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 18px;
	padding-bottom: 18px;	
	border-radius: 10px;
	border: 3px solid #01E6E6 !important;
	font-size: 20px;
	color: #01E6E6 !important;
	font-weight: bold;
}

.ruv-button-text {
	color: #001957;
	font-size: 20px;
	text-decoration: none !important;
	background-color: #f8f8f8;
	padding-left: 11px;
	padding-right: 11px;
	padding-top: 9px;
	padding-bottom: 9px;
	border-radius: 10px;
}

.ruv-button-text:hover {
	color: #001957;
	font-size: 20px;
	text-decoration: none !important;
	background-color: #F5F5F5;
	padding-left: 11px;
	padding-right: 11px;
	padding-top: 9px;
	padding-bottom: 9px;
	border-radius: 10px;
}

.ruv-button-text:active {
	color: #001957;
	font-size: 20px;
	text-decoration: none !important;
	background-color: #F5F5F5;
	padding-left: 11px;
	padding-right: 11px;
	padding-top: 9px;
	padding-bottom: 9px;
	border-radius: 10px;
}

.rad {
	background-image: url(../img/guy.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 87px;
}

.img_unt_back {
	width: 195px;
	height: 191px;
	background-image: url('../img/unternehmen.png');
	background-repeat: no-repeat;
	background-size: 195px;
}

.img_unt_back:hover {
	width: 195px;
	height: 191px;
	background-image: url('../img/unternehmen_hover.png');
	background-repeat: no-repeat;
	background-size: 195px;
}

.img_mit_back {
	width: 192px;
	height: 191px;
	background-image: url('../img/mitarbeiter.png');
	background-repeat: no-repeat;
	background-size: 192px;
}

.img_mit_back:hover {
	width: 192px;
	height: 191px;
	background-image: url('../img/mitarbeiter_hover.png');
	background-repeat: no-repeat;
	background-size: 192px;
}

.img_kun_back {
	width: 195px;
	height: 193px;
	background-image: url('../img/kunden.png');
	background-repeat: no-repeat;
	background-size: 195px;
}

.img_kun_back:hover {
	width: 195px;
	height: 193px;
	background-image: url('../img/kunden_hover.png');
	background-repeat: no-repeat;
	background-size: 195px;
}

.img_sie_back {
	width: 193px;
	height: 193px;
	background-image: url('../img/sie.png');
	background-repeat: no-repeat;
	background-size: 193px;
}

.img_sie_back:hover {
	width: 193px;
	height: 193px;
	background-image: url('../img/sie_hover.png');
	background-repeat: no-repeat;
	background-size: 193px;
}

.img_unt:hover {
	content: url('../img/unternehmen_hover.png');
}

.img_mit:hover {
	content: url('../img/mitarbeiter_hover.png');
}

.img_kun:hover {
	content: url('../img/kunden_hover.png');
}

.img_sie:hover {
	content: url('../img/sie_hover.png');
}

.uk-tooltip {
	font-family: "Marselis Regular", sans-serif; 
	background-color: #fff;
	color: #001957;
	font-size: 20px;
	max-width: 260px;
	border-radius: 5px;
	padding: 20px;
	box-shadow: 0 0 15px rgb(0,0,0,0.15);
}


/* entire container, keeps perspective */
.flip-container {
	perspective: 1000px;
}

/* flip the pane when hovered */
.flip-container:hover .flipper, .flip-container.hover .flipper {
	transform: rotateY(180deg);
}

/* size of the flip-container */
.flip-container, .front, .back {
	width: 289px;
	height: 320px !important;
}

/* flip speed goes here */
.flipper {
	transition: 0.6s;
	transform-style: preserve-3d;
	position: relative;
}

/* hide back of pane during swap */
.front, .back {
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
}

.back-green {
	background-color: #A7D54C !important;
}

/* front pane, placed above back */
.front {
	z-index: 2;
	/* for firefox 31 */
	transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back {
	transform: rotateY(180deg);
}

.uk-slideshow-items {
	min-height: 842px !important;
	max-height: 842px;
}

.uk-dotnav {
	
}

.element-animation{
  animation: animationFrames linear 1s;
  animation-iteration-count: infinite;
  transform-origin: 50% 0%;
  animation-fill-mode:forwards; /*when the spec is finished*/
  -webkit-animation: animationFrames linear 1s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 0%;
  -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ 
  -moz-animation: animationFrames linear 1s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 0%;
  -moz-animation-fill-mode:forwards; /*FF 5+*/
  -o-animation: animationFrames linear 1s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 0%;
  -o-animation-fill-mode:forwards; /*Not implemented yet*/
  -ms-animation: animationFrames linear 1s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 0%;
  -ms-animation-fill-mode:forwards; /*IE 10+*/
}

@keyframes animationFrames{
  0% {
    transform:  translate(0px,0px)  ;
  }
  50% {
    transform:  translate(0px,10px)  ;
  }
  100% {
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    -moz-transform:  translate(0px,0px)  ;
  }
  50% {
    -moz-transform:  translate(0px,10px)  ;
  }
  100% {
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  50% {
    -webkit-transform:  translate(0px,10px)  ;
  }
  100% {
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes animationFrames {
  0% {
    -o-transform:  translate(0px,0px)  ;
  }
  50% {
    -o-transform:  translate(0px,10px)  ;
  }
  100% {
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    -ms-transform:  translate(0px,0px)  ;
  }
  50% {
    -ms-transform:  translate(0px,10px)  ;
  }
  100% {
    -ms-transform:  translate(0px,0px)  ;
  }
}

/*Cookie Consent Begin*/
		#cookieConsent {
		    background-color: #fff;
		    box-shadow: rgba(0, 0, 0, 0.247059) 0px 0px 35px 5px;
		    position: fixed;
		    bottom: 0;
		    left: 0px;
		    right: 0px;
		    display: none;
		    z-index: 9999;
		    text-align: center;
		    padding: 20px 30px 20px 30px;
		}
		#cookieConsent a {
		    text-decoration: none;
		}
		#closeCookieConsent {
		    float: right;
		    display: inline-block;
		    cursor: pointer;
		    height: 20px;
		    width: 20px;
		    margin: -15px 0 0 0;
		    font-weight: bold;
		}
		#closeCookieConsent:hover {
		    color: #001957;
		}
		#cookieConsent a.cookieConsentOK {   
		    color: #ffffff;
		    display: inline-block;
		    cursor: pointer;
		}
		#cookieConsent a.cookieConsentOK:hover {
		    
		}
/*Cookie Consent End*/

/*Cookie Consent Begin*/
		#cookieConsent_mob {
		    background-color: #fff;
		    box-shadow: rgba(0, 0, 0, 0.247059) 0px 0px 35px 5px;
		    position: fixed;
		    bottom: 0;
		    left: 20px;
		    right: 20px;
		    display: none;
		    z-index: 9999;
		    padding: 30px;
		}
		#cookieConsent_mob a {
		    text-decoration: none;
		}
		#closeCookieConsent_mob {
		    float: right;
		    display: inline-block;
		    cursor: pointer;
		    height: 20px;
		    width: 20px;
		}
		#closeCookieConsent_mob:hover {
		    color: #001957;
		}
		#cookieConsent_mob a.cookieConsentOK_mob {   
		    color: #ffffff;
		    display: inline-block;
		    cursor: pointer;
		}
		#cookieConsent_mob a.cookieConsentOK_mob:hover {
		    
		}
/*Cookie Consent End*/
