.page { padding-top:0px;width:100%;overflow:hidden }

.beginn_start { background-image:url('/grafik/beginn/01/background.svg');background-size:cover;background-position:center;padding:50px 100px 20px 100px }
.beginn_start > div { margin:0px auto;max-width:2000px;position:relative; }
.beginn_start .logo { width:53%;z-index:3;position:relative }
.beginn_start .laptop { position:absolute;right:0px;width:50%;top:160px;z-index:2 }
.beginn_start .anbieter { position:absolute;right:5%;top:0px;z-index:3;font-size:30px; }
.beginn_start .anbieter a { color:white;cursor:pointer }
.beginn_start .anbieter a.mobile { display:none }
.beginn_start .anbieter img { height:25px }

.beginn_start .gratis {position: absolute; top: -5px; right: 700px; font-size: 30px; background-color: black; padding: 20px 20px 15px 20px; color: white; border-radius: 30px;line-height:25px }
.beginn_start .anbieter svg { display: inline-block; fill: none; height: 20px; width: 20px; stroke: white; stroke-width: 3; overflow: visible;margin-right:10px;vertical-align:top;margin-top:3px }
.beginn_start .anbieter span { display:inline-block;border:solid 1px white;border-radius:30px;padding:10px 15px;position:relative;top:-2px;margin-left:20px;cursor:pointer;width:98px;box-sizing:border-box }
.beginn_start .anbieter .anbietermenu { position:absolute;margin-top:3px;background-color:white;padding:10px 20px 6px 20px;border-radius:20px;right:0px;font-size:16px;line-height:16px;display:none;width:128px;z-index:19 }
.beginn_start .anbieter .anbietermenu a { display:block;border-bottom:solid 1px #a0a0a0;padding:7px 0px;color:#a0a0a0 }
.beginn_start .anbieter .anbietermenu a:last-child { border-bottom-width:0px }
.beginn_start .beginn_suche input { background-color:white;border-radius:48px;border-width:0px;padding:27px 37px;width:670px;margin-top:330px;font-weight:bold;font-size:27px }
.beginn_start .beginn_suche a img { width:67px;position:relative;left:-90px;top:22px }
.beginn_start .scrolldown img { position:absolute;right:3%;width:90px;bottom:20px;z-index:2;cursor:pointer }


.beginn_musikanbieter { margin:30px auto; max-width:1750px;clear:both;text-align:center;overflow:hidden }
.beginn_musikanbieter a { display:inline-block;width:270px; }
.beginn_musikanbieter h3 { text-align:center;font-weight:bold;font-size:25px;margin:0px 0px 0px 0px;line-height:25px }
.beginn_musikanbieter a { width:290px;display:inline-block;text-align:center }
.beginn_musikanbieter img { height:90px;margin-top:40px;margin-bottom:50px }

h3 > span { color:#F27405 }
.button { background-color:#F27405;border-radius:30px;padding:10px 35px 5px 35px;color:white;font-weight:bold;display:inline-block;line-height:40px;cursor:pointer }
.beginn_newsletter .button { font-size: 31px;border-radius:40px;padding:15px 50px 10px 50px;color:white;margin-top:20px;position:relative;top:-10px }
.beginn_text .text a.button, .beginn_text_right .text a.button { border-radius:40px;padding:15px 50px 10px 50px;color:white;margin-top:20px; }
.beginn_text .text a.hover1:hover { color:#045BB0 }
.beginn_text .text a.hover2:hover { color:#2CA83E }
.beginn_text .text a.hover3:hover { color:#BF49F2 }
.beginn_text .text a.hover4:hover { color:#D80000 }
.beginn_text .text a.hover5:hover { color:#8190A3 }

.button.color1 { background-color:#045BB0 }
.button.color2 { background-color:#2CA83E }
.button.color3 { background-color:#D80000 }
.button.color4 { background-color:#BF49F2 }
.button.color5 { background-color:#8190A3 }
.beginn_abo > div > div > div a.clr1, .clr1 { color:#045BB0 }
.beginn_abo > div > div > div a.clr2, .clr2 { color:#2CA83E }
.beginn_abo > div > div > div a.clr3, .clr3 { color:#D80000 }
.beginn_abo > div > div > div a.clr4, .clr4 { color:#BF49F2 }
.beginn_abo > div > div > div a.clr5, .clr5 { color:#8190A3 }
.clr9 { color:#BF9000 }

.beginn_text { margin:150px auto; max-width:1750px;clear:both;padding:0px 30px 150px 30px; }
.beginn_text h3 { font-weight:bold;font-size:88px;line-height:90px;margin:50px 0px 20px 0px; }
.beginn_text .bild { width:45%;float:left;border-radius:30px; }
.beginn_text .text { font-size:39px;line-height:49px;margin-left:55%;padding-top:0px }
.beginn_text .text p { padding:15px 0px }
.beginn_text .text a { color:black }
.beginn_text .button img { width:270px;margin-top:20px;display:block }

.beginn_text_right { margin:150px auto; max-width:1750px;clear:both;padding:0px 30px 150px 30px; }
.beginn_text_right h3 { font-weight:bold;font-size:88px;line-height:90px;margin:50px 0px 20px 0px;text-align:right }
.beginn_text_right .bild { width:45%;float:right;border-radius:30px; }
.beginn_text_right .text { font-size:39px;line-height:49px;margin-right:55%;padding-top:30px }
.beginn_text_right .button img { width:270px;margin-top:20px;display:block }

.beginn_angebot { background-image:url('/grafik/beginn/01/background.svg');background-size:cover;background-position:center;padding:50px 100px 20px 100px;clear:both;position:relative; }
.beginn_angebot > h3 { text-align:center;color:white;margin:70px auto 0px auto;font-size:60px;font-weight:bold }
.beginn_angebot > div { height:480px;position:relative;margin:100px auto 150px auto; max-width:1224px;clear:both;overflow:hidden }
.beginn_angebot .swiper-portale { overflow:hidden;margin:0px 100px }
.beginn_angebot .swiper-portale .swiper-slide { background-color:white;padding:20px;border-radius:20px;text-align:center;font-size:25px;line-height:29px; }
.beginn_angebot .swiper-portale .swiper-slide > div { margin-top:20px;height:145px }
.beginn_angebot .swiper-portale .swiper-slide h4 { font-weight:bold;margin-bottom:10px }
.beginn_angebot .swiper-portale .swiper-slide > img { width:100%;border-radius:20px }
.beginn_angebot .swiper-portale .swiper-slide a > img { width:200px;max-width: 100%; }

.swiper-button-next, .swiper-button-prev { color:transparent;width:70px; }
.swiper-button-next { right:0px; }
.swiper-button-prev { left:0px }

.swiper-button-next:after, .swiper-button-prev:after { background-image:url('/grafik/beginn/04/button right.svg');background-size:contain;background-repeat:no-repeat;font-family:none;width:70px;height:70px }
.swiper-button-prev:after { background-image:url('/grafik/beginn/04/button left.svg'); }


.beginn_kunden > h3 { font-weight:bold;font-size:88px;line-height:90px;margin:50px 0px 20px 0px;text-align:center }
.beginn_kunden > div { height:580px;position:relative;margin:100px auto 70px auto; max-width:1724px;clear:both;overflow:hidden }
.beginn_kunden .swiper-kunden { overflow:hidden;margin:0px 100px }
.beginn_kunden .swiper-kunden .swiper-slide { background-color:white;padding:20px;border-radius:20px;text-align:center;font-size:25px;line-height:29px; }
.beginn_kunden .swiper-kunden .swiper-slide h4 { font-weight:bold;margin:50px 0px 22px 0px;font-size:40px;line-height:40px }
.beginn_kunden .person { border-radius:10px;width:240px }
.beginn_kunden .stars { margin-top:34px;width:34px }


.beginn_newsletter { margin:10px auto; max-width:1750px;clear:both;padding:0px 30px 50px 30px; }
.beginn_newsletter h3 { font-weight:bold;font-size:70px;line-height:90px;display:inline-block;margin-right:40px }
.beginn_newsletter > div { width:45%;display:inline-block;text-align:right }
.beginn_newsletter > div .last img { vertical-align:bottom }


.footer2 { background-image:url('/grafik/beginn/10/background.svg');background-size:cover;background-position:center; text-align:center; padding:200px 0px 220px 0px; color:white; height:100%; font-size:19px;line-height:19px;position:relative;z-index:30; }
.footer2 > div > img { width:187px;margin-bottom:15px }
.footer2 .social { margin-top:21px }
.footer2 .social img { height:62px;display:inline-block;margin:0px 20px }
.footer2 .social a:first-child img { height:77px; }
.footer2 .social a:nth-child(2) img { height:70px; }
.footer2 a { color:white }
.footer2 .submenu { margin-top:46px }
.footer2 .submenu a { display:inline-block;padding:5px 10px;font-size:22px;line-height:22px }


.beginn_abo { margin:150px auto; max-width:1750px;clear:both;padding:0px 30px 50px 30px; }
.beginn_abo h2 { font-weight:bold;font-size:70px;line-height:90px;text-align:center;margin-bottom:10px }
.beginn_abo h3 { font-weight:bold;font-size:30px;line-height:40px;text-align:center;margin-bottom:50px }
.beginn_abo > div > div { float:left;width:550px;padding:20px 30px;font-size:22px;line-height:27px;text-align:center;margin-bottom:70px }
.beginn_abo > div > div > img { height:120px }
.beginn_abo > div > div .icon-official { vertical-align:bottom;position:relative;top:-22px }
.beginn_abo > div > div .icon-official::before { color:#BF9000; }
.beginn_abo > div > div .icon-official.iconblue::before { color:#045BB0; }
.beginn_abo > div > div > div { height:205px }
.beginn_abo > div > div h4 { font-weight:bold;font-size:30px;line-height:36px;margin-top:20px; }
.beginn_abo > div > div h5 { font-weight:bold;margin-bottom:10px; }
.beginn_abo > div > div > div a { display:block;color:black;margin-top:3px;font-size:20px;cursor:pointer }
.beginn_abo > div > div > div a img { margin-left:5px;width:20px }

.qa {
    padding: 120px 200px;
    min-height: 400px;
    max-width:1155px;
    margin:09px auto;
}


.beginn_popup { display:none;position:fixed;z-index:80;max-width:1150px;margin:10px 10px;background-color:white;padding:100px 50px 50px 50px;overflow:hidden;width:100%;
                border-radius:50px;left:50%;top: 50%;transform: translate(-50%, -50%); border:solid 3px #F27405;font-size:22px;line-height:26px; }

.beginn_popup span.icon-schliessen { margin-top: 0px; font-size: 21px; line-height: 21px; color: white; display: inline-block; margin-bottom: 26px; background-color: #F27405; border-radius: 50%;
    width: 98px; height: 98px; padding-top: 56px; box-sizing: border-box; top: -45px; position: absolute; left: 50%; margin-left: -49px;text-align:center }


.beginn_popup > div { position:relative }
.beginn_popup .bild { position:absolute;top: 50%;transform: translateY(-50%);text-align:center;width:300px;padding-bottom:80px }
.beginn_popup .text { margin-left:400px;overflow:auto;max-height:670px }
.beginn_popup .text h3 { font-size:28px;line-height:30px;margin-bottom:0px;font-weight:bold }
.beginn_popup .text > div { margin:10px 0px }
.beginn_popup .text .mitgliedwerden img { width:200px }
.beginn_popup h3 span { color:black;font-size:15px }
.beginn_popup .text > .sub { color:black;font-size:15px;line-height:19px;margin-top:0px; }
.beginn_popup .text > .sub i { font-weight:bold }
.beginn_popup h3 span font { color:#d80000 }
.beginn_popup h4 { font-weight:bold }



@media screen and (max-width: 1510px) {
    .beginn_start .beginn_suche input { width:500px;font-size:22px }
    .beginn_musikanbieter { max-width:900px }
    .beginn_musikanbieter a { width:177px }
    .beginn_musikanbieter img { height:60px }
    .beginn_newsletter > div { width:500px; }
    .beginn_newsletter > div:first-child { width:650px }
    .beginn_start .scrolldown img { width:60px;bottom:10px; }
}




@media screen and (max-height: 1030px) {
    .beginn_start .beginn_suche input { margin-top:230px }

}

@media screen and (max-height: 790px) {
    .beginn_start .scrolldown img { width:60px;bottom:10px; }
    .beginn_start .logo { width:45% }
    .beginn_start .laptop { width:45%;top:50px; }
    .beginn_start .beginn_suche input { border-radius:48px;padding:14px 20px;width:450px;margin-top:145px; }
    .beginn_start .beginn_suche a img { width:50px;left:-70px;top:16px }

}

@media screen and (max-width: 1600px) {
.beginn_start .gratis {right:600px; }
}

@media screen and (max-width: 1425px) {
    .beginn_start .gratis {right:5%;top:55px;font-size:20px;padding: 19px 20px 15px 20px;  }
    .beginn_angebot .swiper-portale .swiper-slide { font-size:21px;line-height:24px}
    .beginn_kunden .swiper-kunden .swiper-slide { font-size:21px;line-height:24px}
    .beginn_text .text, .beginn_text_right .text { font-size:30px;line-height:35px;padding-top:0px }
    .beginn_kunden .swiper-kunden .swiper-slide h4 { font-size:30px;line-height:35px; margin:30px 0px 12px 0px; }
    .beginn_text h3, .beginn_text_right h3, .beginn_kunden > h3 { font-size:60px;line-height:70px }
    .beginn_newsletter h3 { font-size:50px;line-height:60px }
}

@media screen and (max-width: 1229px) {
    .beginn_angebot .swiper-portale .swiper-slide > div { height:110px }
    .beginn_newsletter > div { width:100%;margin-bottom:100px;text-align:right }
    .beginn_newsletter > div:first-child { width:100%;text-align:left; }
}

@media screen and (max-width: 1160px) {
    .beginn_abo > div > div { float:none;margin:0px auto 40px auto }
    .beginn_popup .text h3 { font-size:24px;line-height:29px }
    .beginn_popup { width:unset;left:10px;right:10px;transform:unset;top:0px;padding:40px 20px 20px 20px;border-radius:25px;font-size:20px;line-height:24px }
    .beginn_popup .bild { position:static;top:0px;padding-bottom:20px;margin:30px auto 0px auto;transform:unset;width:unset; }
    .beginn_popup .bild img { max-width:80%;max-height:125px }
    .beginn_popup .text { margin-left:0px }
}

@media screen and (max-width: 1019px) {
    .beginn_start .laptop { position:static;width:80%;margin:50px auto 0px auto;display:block }
    .beginn_start .logo { position:static;width:80%;margin-top:100px;margin }
    .beginn_start .beginn_suche input { margin-top:230px }
    .beginn_start .anbieter, .beginn_start .scrolldown img, .beginn_start .gratis { right:0px }
    .beginn_suche { margin:0px auto;text-align:center;padding-left:50px }
}


@media screen and (max-width: 800px) {
    .beginn_start .beginn_suche input { border-radius:48px;padding:14px 20px;width:450px;margin-top:145px; }
    .beginn_start .beginn_suche a img { width:50px;left:-70px;top:16px }

    .beginn_start  {  padding: 50px 20px 20px 20px; }
    .beginn_angebot { padding: 50px 20px 20px 20px; }
    .beginn_text .text { font-size:24px;line-height:30px;margin-left:50%;padding:0px }
    .beginn_text_right .text { font-size:24px;line-height:30px;margin-right:50%;padding:0px }
    .beginn_text, .beginn_text_right { padding-bottom:0px }
    .beginn_kunden .swiper-kunden .swiper-slide h4 { font-size:24px;line-height:30px; }
    .beginn_text h3, .beginn_text_right h3, .beginn_kunden > h3 { font-size:50px;line-height:60px }
    .beginn_newsletter h3 { font-size:40px;line-height:50px }
    .beginn_kunden > div { margin-top:50px }
    .beginn_newsletter, .beginn_musikanbieter { margin:100px auto 0px auto;padding-bottom:0px }
    
    .beginn_abo h2 { font-size:50px;line-height:60px }
}


@media screen and (max-width: 750px) {
    .beginn_angebot { min-height:800px }
    .beginn_angebot > div { height:unset }
    .beginn_start .anbieter a.desktop { display:none }
    .beginn_start .anbieter a.mobile { display:inline-block }
}

@media screen and (max-width: 599px) {
    .beginn_start .anbieter span { padding:5px 10px;width:88px;top:2px }
    .beginn_start .logo { margin-top: 140px;width:100%  }

    .beginn_text .bild, .beginn_text_right .bild { float:none;width:100%}
    .beginn_text .text, .beginn_text_right .text { margin-left:0%;margin-right:0px;margin-top:20px }
    .beginn_start .anbieter { font-size:20px }
    .beginn_start .beginn_suche { position:relative }
    .beginn_start .beginn_suche input { width: 85%; font-size:17px; padding-right:70px }
    .beginn_start .beginn_suche a img { top: unset;left:unset;position:absolute;right:34px;bottom:0px }
    
    .beginn_kunden .swiper-kunden .swiper-slide h4 { font-size:22px;line-height:27px; }
    .beginn_text h3, .beginn_text_right h3, .beginn_kunden > h3,.beginn_angebot > h3 { font-size:35px;line-height:50px }
    .beginn_newsletter h3 { font-size:35px;line-height:40px }

    .swiper-button-next, .swiper-button-prev { width:30px; }
    .swiper-button-next:after, .swiper-button-prev:after { width:30px;height:30px }
    .beginn_angebot .swiper-portale, .beginn_kunden .swiper-kunden { margin:0px 40px }
    .beginn_angebot { padding: 30px 10px 0px 10px;min-height: 400px; }
    .beginn_angebot > h3 { margin-top: 30px }
    .beginn_angebot > div { margin-top: 30px;margin-bottom:50px }

    .beginn_abo > div > div { width:100%;padding-left:0px;padding-right:0px }
    .beginn_abo > div > div > div { height:unset;margin-bottom:10px }
    .beginn_abo h2 { font-size:35px;line-height:40px }
    .beginn_abo > div > div h4 { font-size:30px;line-height:35px }

    .beginn_start .gratis { font-size:18px }
}

@media screen and (max-width: 440px) {
    .beginn_start { padding-top: 20px }
    .beginn_start .logo { margin-top: 140px;width:100%  }
    .beginn_suche { padding-left:0px; }
    .beginn_start .laptop { width:100% }
    .beginn_start .beginn_suche input { margin-top:50px }
    .beginn_newsletter, .beginn_musikanbieter, .beginn_text, .beginn_text_right { margin-top:50px }
    .beginn_kunden > h3 { margin:0px }
    .beginn_kunden > div { margin-top:20px }
    
    .footer2 .social img { height:40px; }
    .footer2 .social a:first-child img { height:48px; }
    .footer2 .social a:nth-child(2) img { height:46px; }
    
    .beginn_start .gratis { padding: 9px 20px 10px 20px;  }
}