/* roboto-300 - latin */
@font-face {
  font-display: swap;
  font-family: 'Roboto Lt';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/roboto-v30-latin-300.woff2') format('woff2'),
       url('./fonts/roboto-v30-latin-300.ttf') format('truetype');
}

/* roboto-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Roboto Rg';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/roboto-v30-latin-regular.woff2') format('woff2'),
       url('./fonts/roboto-v30-latin-regular.ttf') format('truetype');
}

/* roboto-500 - latin */
@font-face {
  font-display: swap;
  font-family: 'Roboto Md';
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/roboto-v30-latin-500.woff2') format('woff2'),
       url('./fonts/roboto-v30-latin-500.ttf') format('truetype');
}

/* roboto-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Roboto Bd';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/roboto-v30-latin-700.woff2') format('woff2'),
       url('./fonts/roboto-v30-latin-700.ttf') format('truetype');
}


body {
  font-family: "Roboto Lt",arial,helvetica,sans-serif;
  font-size: 90%;
	line-height: 1.6em;
}

body, dl, h6, li, ol, pre, ul {
    line-height: 1.6em;
  }

.fontface .medium, 
.fontface h1, 
.fontface h2, 
.fontface h3, 
.fontface h4, 
.fontface h5, 
.fontface h6 {
    font-family: "Roboto Rg",arial,helvetica,sans-serif;
    font-weight: 400;
 }

.fontface #Downloads h3, 
.fontface #mainnav span, 
.fontface #tracking-modal .btn-agree, 
.fontface .bold, 
.fontface .button-link, 
.fontface .button-link-red, 
.fontface .cb-enable, 
.fontface .eye-catcher, 
.fontface .pagelinks a, 
.fontface .pagelinks span, 
.fontface .produkte a, 
.fontface b, 
.fontface h2.h2, 
.fontface strong {
    font-family: "Roboto Bd",arial,helvetica,sans-serif;
    font-weight: 700;
  }

#call-back-datenschutz, 
#call-back-form, 
#call-back-success .inside {
    font-family: "Roboto Rg",arial,helvetica,sans-serif;
  }

.fontface footer strong {
	font-family: 'Roboto Md',arial,helvetica,sans-serif;
	font-weight: 500;
}


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

	.fontface .produkte a { 
    font-family: "Roboto Rg",arial,helvetica,sans-serif;
    font-weight: 400;
	}
	
}

/* zusätzliche styles aus der custom.css */

.youtubevideo {
margin-bottom: 30px;
position: relative;
padding-top: 56.25%;
overflow: hidden;
cursor: pointer;
}
.youtubevideo img {
width: 100%;
height: 100%;
top: 0%;
left: 0;
}
.youtubevideo .play-button {
width: 90px;
height: 60px;
background-color: #09c;
box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
z-index: 1;
opacity: 0.9;
border-radius: 6px;
}
.youtubevideo:hover .play-button {
width: 100px;
height: 70px; 
background-color: #007acc;
}
.youtubevideo .play-button:before {
content: "";
border-style: solid;
border-width: 15px 0 15px 26.0px;
border-color: transparent transparent transparent #fff;
}
.youtubevideo img,
.youtube .play-button {
cursor: pointer;
}
.youtubevideo img,
.youtubevideo iframe,
.youtubevideo .play-button,
.youtubevideo .play-button:before {
position: absolute;
}
.youtubevideo .play-button,
.youtubevideo .play-button:before {
top: 50%;
left: 50%;
transform: translate3d( -50%, -50%, 0 );
}
.youtubevideo iframe {
height: 100%;
width: 100%;
top: 0;
left: 0;
} 