

@font-face {
            font-family: 'Organika-Script';
            src: url("MikaMelvas-OrganikaScript.otf") format('opentype');
        }
        a{
            text-decoration: none;
            color: #d60016;
        }
        body, footer, h3, p, li {
                font-family: Arial, sans-serif;
                color: #505050;
            }
		
		.buttonright{
			position: relative;
			bottom: 45px;
			float: right;
			right: 10px;
		}
		.buttonleft{
			position: relative;
			bottom: 45px;
			float: left;
			left: 10px;
		}
		.buttoncontainer{
			position: relative; 
			max-height: 480px;
			width: 350px;"
		}
		
        p, li {
                line-height: 1.5;
            }
		.red{
			background-color: #80030b;
            border: none;
            border-radius: 5px;
            color: #fff;
            font-size: 1.25rem;
            padding: .35em;
		}
        .red:hover {
                background-color: #419839;
            }
		

        button a {
                color: #fff
            }
		.bannertext2>div>a>img{
				max-height: 250px;
				max-width: 250px;
			}
		.center{
				text-align: center;
				vertical-align: middle;
			}
		.centerh{
				display: flex;
				justify-content: center;
			}
        .ml h3{
            font-size: 16px;
            }
        h2{
			font-family: 'Organika-Script', "Arial", sans-serif;
            font-weight: 300;
			color: #505050;
            font-size: 3.5rem;
        }
        .containerh{
            margin-top: 150px;
        }
        .containerinfos{
            background-color: #505050;
            padding: .35em;
        }
		.containerinfos>h2{
			text-align: center;
		}
        .container{
            display: flex;
            justify-content: flex-start;
			align-items: center;
        }
		.grey{
			background-color: #505050;
			font-size: 1em;
		}
        .w{
            color: #fff;
        }
        .ml {
            margin-left: 2rem;
            margin-top: .35em;
        }
		.margin-left{
			margin-left: 2rem;
		}
        .points li{
            color: #fff;
        }
        .rectangle {
                background-color: #d60016;
                border: none;
                border-radius: 5px;
                color: #fff;
                font-size: 1.25em;
                padding: .35em;
				bottom: .25em;
				font-weight: 300;
				cursor: pointer;
            }
		.circle{
			display: block;
			background-color: #d60016;
            border: none;
            border-radius: 50%;
            color: #fff;
			vertical-align: center;
            font-size: 1.25rem;
			height: 150px;
			width: 150px;
			line-height: 150px;
			cursor: pointer;
            
		}
		.circletext{
			display: inline-block;
			vertical-align: middle;
		}
		.circle2{
			background-color: #d60016;
            border: none;
            border-radius: 5px;
            color: #fff;
            font-size: 1.25rem;
            padding: .35em;	
			cursor: pointer;			
		}
        #footer{
            display: flex;
            flex-direction: column;
            background-color: #505050;
            justify-content: space-between;
            height: auto;
            margin-top: 2rem;
            padding: .35em;
        }
        .bold{
            font-weight: 700;
        }
        .link:hover{
            color: #d60016;
        }
		.points {
                max-width: 400px;
                margin: 0 auto;
            }
		.points>ul>li{
			font-weight: 700;
		}
		.top{
			margin-top: 0;
		}
		.tooltip{
			color: #fff;
			position: relative;
		}
		.tooltip span[role=tooltip] {
			display: none;
		}
		.tooltipnob span[role=tooltipnob] {
			display: none;
		}
		.tooltip:hover span[role=tooltip] {
		  display: block;  
		  position: relative; 
		  bottom: 105px;
		  left: 0px;
		  width: 15em;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		}
		.tooltipnob:hover span[role=tooltipnob] {
		  display: block;  
		  position: relative; 
		  bottom: 80px;
		  left: 10px;
		  width: 15em;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		  cursor: pointer;
		}
		.tooltipcircle span[role=tooltipcircle] {
			display: none;
		}
		.tooltipcircle:hover span[role=tooltipcircle] {
		  display: block;
		  text-align: left;		  
		  position: relative; 
		  bottom: 150px;
		  left: -230px;
		  width: 200px;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		}
		.tooltipmobil span[role=tooltipmobil] {
		  display: block;  
		  position: relative; 
		  bottom: 105px;
		  left: 0px;
		  width: 15em;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		}
		.tooltipmobilnob span[role=tooltipmobil] {
		  display: block;  
		  position: relative; 
		  bottom: 80px;
		  left: 10px;
		  width: 15em;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		}
		.rectanglemobil {
            background-color: #d60016;
            border: none;
            border-radius: 5px;
            color: #fff;
            font-size: 1.25em;
            padding: .35em;
			font-weight: 300;
			position: absolute;
			bottom: 45px;
			float: right;
			left: 10px;
        }
		.tooltipcirclemobil span[role=tooltipcirclemobil] {
		  display: block;
		  text-align: left;		  
		  position: relative; 
		  bottom: 235px;
		  left: 0px;
		  width: 180px;
		  height: auto;
		  padding: 0.35em;
		  z-index: 1;
		  color: #fff; 
		  background-color: #505050;
		  border-radius: 5px;
		}
		
		@keyframes move{
				0% {
					right: 0%;
				}
				11%{
					right: 0%;
				}
				22%{
					right: 0%;
				}
				33% {
					right: 100%;
				}
				44%{
					right: 100%;
				}
				55%{
					right: 100%;
				}
				66%{
					right: 200%;
				}
				77%{
					right: 200%;
				}
				88%{
					right: 200%;
				}
				100%{
					right: 300%;
				}
				
			}
        @media screen and (max-width:723px) {
			.full{
				width: 100%;
			}
            .box {
                    width: auto;
                    max-height: 480px;
                    margin: 0 auto;
                    margin-top: 1rem;
					overflow: visible;
                }
			.boxtext{
                width: 100%;
                height: auto;
            }
			.buttoncontainercircle{
				position: relative; 
				bottom: 100px; 
				left: 200px;
				max-width: 150px;
			}
			.container{
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: flex-start;
			}
            .containerh {
                    display: flex;
                    flex-direction: column;
                    justify-content: flex-start;
                }
            .containerfixed{
                    display: none;
                }
            .containerfixedmobil{
                    display: flex;
                    justify-content: flex-start;
                    position: fixed;
                    background-color: #fff;
                    top: 0;
                    width: 100%;
                    margin: 0 auto;
					z-index: 10;
                }
            .containerfixedmobil h3{
                font-size: 1rem;
                margin: 0;
            }
			.containerservice {
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            .bannertext {
                    background-color: #d60016;
                    flex-grow: 1;
                    text-align: center;
                    height: 200px;
					width: 300px;
                }
			.bannertext>div>h2{
				font-size: 32px;
			}
			.bannerbild>img{
				height: 150px;
				width: 300px;
			}
			.bannertext2 {
				text-align: center;
				vertical-align: center;
                background-color: #505050B3;
				flex-grow: 1;
                margin: 0;
            }
            .bannertext h2 {
                    color: #fff;
                }
			.f{
				display: flex;
				align-items: center;
				flex-direction:row;
				}
			.h{
				display: flex;
				align-items: center;
				flex-direction:row;
				margin-bottom: 1rem;
			}
			
			h2{
				margin: .35em 0 .35em 0;
			}
			.info{
				display: none;
			}
			#footer>div>p{
				margin-bottom: 0;
			}
			.logo{
				max-width: 20%;
			}
			.margin{
				margin-left: 2.5rem;
			}
			.nomobile{
				display: none;
			}
            .produkte {
                    display: none;
                }
            .produktemobil{
                display: flex;
                flex-direction: column;
                justify-content: space-evenly;
                margin-bottom: 2rem;
                align-items: center;
            }
		
            .tablet{
                display: flex;
                flex-direction: column;
            }
            .text {
                    text-align: left;
                }
            
			.sliderwrapper{
				margin: 0 auto;
				display: block;
				overflow-x: hidden;
				max-width: 300px;
			}
			.slider{
				display: flex;
				position: relative;
				min-height: 100%;
				animation: move 12s infinite;
			}
		}
        @media screen and (min-width:724px) {
            
            h3{
                margin-top: 0;
            }
            .box {
                    width: 350px;
                    max-height: 480px;
                    margin: 0 auto;
                    margin-top: 1rem;
					overflow: visible;
                }
			.boxtext{
                max-width: 350px;
                max-height: 480px;
                margin: 0 auto;
				margin-top: 20px;
            }
			.buttoncontainercircle{
				position: relative; 
				bottom: 100px; 
				left: 240px;
				max-width: 150px;
			}
			.largeimage{
                max-width: 720px;
                max-height: 480px;
                margin: 0 auto;
				margin-top: 100px;
            }
			.bannertext2 {
				text-align: center;
                background-color: #505050B3;
				flex-grow: 1;
                margin: 0;
            }
			.containerlogos{
				display: flex;
				justify-content: space-evenly;
				align-items: center;
			}
            .containerh {
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                }
            .containerp {
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
					padding-bottom: 2em;
					
                }
            .containerfixedmobil{
                    display: flex;
                    justify-content: flex-start;
                    position: fixed;
                    background-color: #fff;
                    top: 0;
                    width: 100%;
                    margin: 0 auto;
					z-index: 10;
                }
            .containerfixed{
                    display: none;
                }
			.containerservice {
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            .bannerbild{
                margin: 0 auto;
                width: 100%;
            }
			.bannerbild>img{
				height: 340px;
				width: 600px;
			}
            .bannertext {
                background-color: #d60016;
                text-align: center;
                line-height: 60px;
                width: 100%;
				height: 340px;
                margin: 0 auto;
            }
			.bannertext>div>h2{
				
			}
			.f{
				display: flex;
				align-items: center;
				flex-direction:row;
				}
			.h{
				display: flex;
				align-items: center;
				flex-direction:row;
				margin-bottom: 1rem;
			}
			.info{
				display: none;
			}
			.left{
				display: flex;
				flex-direction: column;
				align-content: space-evenly;
			}
			.logo{
				max-width: 20%;
			}
			.margin{
				margin-left: 2.5rem;
				margin-bottom: 0;
			}
			.marginl{
				margin-left: 10px;
			}
			.hbox{
				display: flex;
				align-items: center;
				flex-direction:row;
				margin-bottom: .7em;
				margin-top: .7em;
			}
            .produkte {
                    display: none;
                }
            .produktemobil{
                display: flex;
                flex-direction: column;
                justify-content: space-evenly;
                margin-bottom: 2rem;
            }
			.bildmobil{
                display: flex;
                flex-direction: column;
                justify-content: space-evenly;
                margin-bottom: 2rem;
                align-items: center;
            }
            .tablet{
                display: flex;
            }
            .text {
                    text-align: center;
                }
            
			.sliderwrapper{
				margin: 0 auto;
				display: block;
				overflow: hidden;
				max-width: 600px;
			}
			.slider{
				display: flex;
				position: relative;
				min-height: 100%;
				width: 2400px;
				animation: move 12s infinite;
			}
		}
        @media screen and (min-width: 1440px) {
            
            h3{
                margin-top: 0;
            }
            .bannerbild{
				min-width: 816px;
                margin: 0;
            }
			.bannerbild2{
                margin: 0;
            }
            .bannertext {
                display: flex;
                flex-direction: column;
                justify-content: center;
                background-color: #d60016;
                flex-grow: 1;
                max-width: 584px;
				height: 500px;
                margin: 0;
            }
			.bannertext2 {
				text-align: center;
                background-color: #505050B3;
				flex-grow: 1;
                margin: 0;
            }
            .box {
                width: 350px;
                max-height: 480px;
				overflow: visible;
            }
            .boxtext{
                max-width: 680px;
                max-height: 480px;
                margin: 20px 25px 25px 25px;
            }
			.boxcolumn{
				display: flex;
				flex-direction: column;
				max-width: 720px;
				margin-top: 2rem;
			}
			.bildmobil{
				display: none;
			}
			.buttoncontainercircle{
				position: relative; 
				bottom: 100px; 
				left: 240px;
				max-width: 150px;
			}
            .containerfixed{
                display: flex;
                flex-direction: row;
                justify-content: flex-start;
                position: fixed;
                background-color: #fff;
                top: 0;
                width: 1460px;
                margin: 0 auto;
				z-index: 10;
            }
            .containerfixedmobil{
                display: none;
            }
			.cta{
				background-color: #91989c;
				text-align: center;
			}
            .wrapper, footer {
                max-width: 1460px;
                height: auto;
                margin: 0 auto;
            }
			.containerlogos{
				display: flex;
				justify-content: space-evenly;
				align-items: center;
			}
            .containerp {
                display: flex;
                flex-direction: row;
                justify-content: space-between;

            }
            .containerh {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                min-height: 500px;
				min-width: 1460px;
            }
			.containerservice {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                height: 350px;
            }
			.h{
				margin-bottom: 2rem;
			}
			.info{
				display: block;
				max-width: 240px;
				position: fixed;
				padding: .35em;
				right: 0;
				bottom: 0px;
                background-color: #fff;
				z-index:10;
			}
			.largeimage{
				display: none;
			}
			.logo{
				max-width: 200px;
			}
            .produkte {
                display: flex;
                justify-content: space-between;
                margin-bottom: 2rem;
            }
            .produktemobil{
                display: none;
            }
            .text {
                text-align: center;
                margin-top: 50px;
            }
			.bannerbild>img{
				height: 500px;
				width: 100%;
			}
			.sliderwrapper{
				top: 0;
				display: inline-block;
				overflow-x: hidden;
				max-width: 1460px;
				min-height: 500px;
			}
			.slider{
				display: flex;
				position: relative;
				min-height: 500px;
				width: 4380px;
				animation: move 12s infinite;
			}
			
			.mySlides{
				min-height: 500px;
			}
			.prev, .next{
				cursor: pointer;
				position: absolute;
				top: 50%;
				width: auto;
				margin-top: -22px;
				padding: 16px;
				color: white;
				font-weight: bold;
				font-size: 24px;
				transition: 0.6s ease;
				border-radius: 0 3px 3px 0;
				user-select: none;
			}
			.next{
				right: 100px;
				border-radius: 3px 0 0 3px;
				color: white;
			}
			.dot{
				 width: 8px;
				height: 8px;
				  display: inline-block;
				  border-radius: 100%;
				  background-color: #505050;
				  opacity: 0.2;
				  margin: 0 4px;
			}
        }
		@media print {
            
           .full{
				width: 100%;
			}
            .box {
                    width: auto;
                    max-height: 480px;
                    margin: 0 auto;
                    margin-top: 1rem;
					overflow: visible;
                }
			.boxtext{
                width: 100%;
                height: auto;
            }
			.buttoncontainercircle{
				display: none;
			}
			.container{
				display: block;
				
			}
            .containerh {
                    display: block;
                  
                }
            .containerfixed{
                    display: none;
                }
            .containerfixedmobil{
                    display: relative;
                    justify-content: flex-start;
                    background-color: #fff;
                    top: 0;
                    width: 100%;
                    margin: 0 auto;
					z-index: 10;
                }
            .containerfixedmobil h3{
                font-size: 1rem;
                margin: 0;
            }
			.containerservice {
                display: block;
               
            }
            .bannertext {
                    background-color: #d60016;
                    flex-grow: 1;
                    text-align: center;
                    height: 200px;
					width: 300px;
                }
			.bannertext>div>h2{
				font-size: 32px;
			}
			.bannerbild>img{
				height: 150px;
				width: 300px;
			}
			.bannertext2 {
				text-align: center;
				vertical-align: center;
                background-color: #505050B3;
				flex-grow: 1;
                margin: 0;
            }
            .bannertext h2 {
                    color: #fff;
                }
			.f{
				display: flex;
				align-items: center;
				flex-direction:row;
				}
			.h{
				display: flex;
				align-items: center;
				flex-direction:row;
				margin-bottom: 1rem;
			}
			
			h2{
				margin: .35em 0 .35em 0;
			}
			.info{
				display: none;
			}
			#footer>div>p{
				margin-bottom: 0;
			}
			.logo{
				max-width: 20%;
			}
			.margin{
				margin-left: 2.5rem;
			}
			.nomobile{
				display: none;
			}
            .produkte {
                    display: none;
                }
            .produktemobil{
                display: block;
               
            }
		
            .tablet{
                display: block;
               
            }
            .text {
                    text-align: left;
                }
            
			.sliderwrapper{
				margin: 0 auto;
				display: block;
				overflow-x: hidden;
				max-width: 300px;
			}
			.slider{
				display: flex;
				position: relative;
				min-height: 100%;
				animation: move 12s infinite;
			}
		}