body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
html,
body,
figure,
img,
h1,
h2,
h3,
p,
ol,
ul,
li,
a,
div,
p,
span,
strong,
h5 {
    font-family: sans-serif;
    font-weight: normal;
    font-size: 17px;
    line-height: 32px;
    color: #333;
}

html,
body,
figure,
img,
h1,
h2,
h3,
p,
a,
div,
span,
ul,
li {
    margin: 0;
    padding: 0;
}

body {
    min-height: 101vh;
}
strong {
	font-weight: bold;
}

h1,
h2 {
    font-family: serif;
    color: #017;
    color: #218ECC;
    font-size: 28px;
    line-height: 28px;
    padding: 20px 0 20px 0;
    font-weight: normal;
}
h3 {
    color: #218ECC;
    color: #017;
    font-size: 17px;
    line-height: 17px;
    font-weight: bold;
}
h4 {
	display: inline-block;
    font-family: serif;
    color: #218ECC;
    font-size: 40px;
    line-height: 40px;
    margin: 0;
    padding: 0;
    font-weight: normal;
}
h5 {
    font-weight: bold;
}

@media all and (min-width: 720px) {
	h1,
	h2 {
		font-size: 36px;
		line-height: 36px;
	}
	h3 {
		font-size: 25px;
		line-height: 25px;
	}
	h4 {
		font-size: 60px;
		line-height: 60px;
	}
}

p {
    margin: 0;
    padding: 0 0 10px 0;
}

ul {
    list-style: none;
}

a {
    color: #218ECC;
    text-decoration: none;
}
a:hover {
    opacity: 0.7;
}

.mobileonly .backbutton {
    display: inline-block;
    padding: 0 0 10px 0;
}
.wideonly .backbutton {
    display: inline-block;
    padding: 10px 0 0 12px;
}
.cweiss {
    color: #fff;
}
.cdunkelblau {
    color: #017;
}
.chellblau {
    color: #218ECC;
}
.corange {
    color: #F6A12B;
}
.crot {
    color: #D6353E;
}
.cgruen {
    color: #579D66;
}
.cmalve {
    color: #983170;
}
.cweiss {
    color: #fff;
}
.bdunkelblau {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
}
.bhellblau {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/hellblau.jpg);
}
.borange {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelorange.jpg);
}
.brot {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/rot.jpg);
}
.bgruen {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/gruen.jpg);
}
.bmalve {
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/malve.jpg);
}

.teaser {
    display: block;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
    border-bottom: solid 20px #fff;
}
.teaserinner {
    display: block;
    width: auto;
    height: auto;
    margin: 0 auto;
    padding-top: 20px;
    padding-bottom: 10px;
}
.teaser figure {
    display: block;
    width: 64vw;
    height: 64vw;
    margin: 0 auto;

}
.teaser figure img {
    width: 64vw;
    height: 64vw;
}
@media all and (min-width: 720px) {
    .teaserinner {
        padding-top: 30px;
        padding-bottom: 20px;
    }
    .teaser figure {
        display: block;
        width: 400px;
        height: 400px;
        margin: 0 0 0 150px;
            padding-top: 10px;
    padding-bottom: 10px;
    }
        .teaser figure img {
        width: 400px;
        height: 400px;
    }
}

.allekonzerte {
    display: block;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
    text-align: left;
    padding: 0 5px 0px;
    border-bottom: solid 20px #fff;
}
.allekonzerte p {
    color: #fff;
}

.miniteaser {
	margin: 0 10px;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
    text-align: center;
    border-bottom: solid 10px #fff;
}
.miniteaser:hover {
	opacity: 1;
}
.miniteaserinner figure {
    margin: 0 auto;
    padding: 10px 40px 0 0;
}
.miniteaserinner figure img {
    width: auto;
    height: 30px;
}
a:hover .miniteaserinner,
a:hover .miniteaserinner {
    text-decoration: none;
}
.teaser h2 {
    display: inline;
}
.teaser h3 {
    margin-top: 10px;
}

.miditeaser {
    display: block;
    text-align: left;
    height: 120px;
    padding: 20px 0 18px 130px;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/collage-2023-2024-800x800.jpg);
    background-repeat: no-repeat;
    background-position: left 20px;
    background-size: 120px 120px;
}
.miditeaser h1 {
    color: #fff;
    padding: 20px 8px 0;
}
.miditeaser p {
    color: #fff;
    padding: 10px 8px 0;
    font-weight: bold;
}
.vereinsteaser {
    display: block;
    text-align: left;
    height: 120px;
    padding: 20px 0 18px 130px;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/VMO_kleines_Logo_H62.png);
    background-repeat: no-repeat;
    background-position: left 45px;
    background-size: auto 62px;
}
.vereinsteaser h1 {
    color: #fff;
    padding: 20px 8px 0;
}
.vereinsteaser p {
    color: #fff;
    padding: 10px 8px 0;
    font-weight: bold;
}

.eventreader {
	display: block;
}
.eventcollage {
	display: none;
}
@media all and (min-width: 720px) {
	.eventheader {
		display: block;
		background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
}
.eventheaderinner {
	display: block;
		background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/collage-2023-2024-800x800.jpg);
		background-repeat: no-repeat;
		background-position: calc(50vw + 90px) center;
		background-size: 230px 230px;
	}
}
@media all and (min-width: 1200px) {
	.eventheaderinner {
		background-position: calc(50vw + 240px) center;
		background-size: 280px 280px;
	}
}

.eventtitle {
    display: none;
    position: absolute;
    width: auto;
}
.eventtitle h2 {
	display: block;
    padding: 2vw 0 0 10px;
    color: #fff;
    font-size: 2rem;
    line-height: 2rem;
}
.eventteaser p {
	display: block;
    padding: 0 0 0 10px;
    color: #fff;
    font-weight: bold;
}
@media all and (min-width: 720px) {
	.eventtitle {
        display: none;
    }
}
.eventimage figure {
    padding: 0 0 10px 0;
}
.eventimage figure img {
    display: inline-block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}
.eventdetails {
}
@media all and (min-width: 33720px) {
	.eventimage figure {
        width: 36vw;
        height: auto;
        padding: 0 10px 0 0;
	}
}
@media all and (min-width: 720px) {
	.eventimage figure {
        width: 410px;
        height: auto;
        padding: 0 10px 0 0;
	}
}
@media all and (min-width: 1200px) {
	.eventimage figure {
        width: 36vw;
        height: auto;
	}
}

.logo {
    display: block;
    text-align: left;
}
.logo figure a {
    display: inline-block;
}
.logo figure a:hover {
    opacity: 1;
}
.logo figure img {
    display: block;
    width: auto;
    height: 38px;
    padding: 17px 10px 8px;
}
@media all and (min-width: 960px) {
    .logo {
        position: absolute;
        margin-top: -105px;
    }
    .logo figure img {
        height: 54px;
        padding: 15px 15px 0px;
    }
}
@media all and (min-width: 1200px) {
	.logo {
        display: inline-block;
        margin-left: calc(15vw - 15px);
    }
}

.floatright {
    float: right;
    width: 200px;
    height: auto;
    padding: 0 0 5px 10px
}
@media all and (min-width: 720px) {
    .floatright {
        float: right;
        width: 280px;
        height: auto;
        padding: 0 0 5px 10px
    }
}

.konzertlink {
    display: block;
    width: calc(100% - 10px);
    margin: 15px 4px 0;
    padding: 0;
    text-align: left;
}
.konzertlink:hover {
	opacity: 1;
}
.konzertbild {
    width: 100%;
}
.konzertbild figure img {
    width: 100%;
    height: auto;
}
.konzerttermin {
    font-weight: bold;
    color: #fff;
    padding: 0 15px 0;
}
.konzerttitel {
    text-align: left;
}
.konzerttitel h2 {
    color: #fff;
    text-align: left;
    padding: 0 15px 0;
}
.konzertteaser p {
    color: #fff;
    font-weight: bold;
    text-align: left;
    padding: 0 15px 10px;
}
@media all and (min-width: 720px) {
    .konzertlink {
        width: calc((100% / 2) - 10px);
        float: left;
    }
}
@media all and (min-width: 11960px) {
    .konzertlink {
        width: calc((100% / 3) - 10px);
    }
}
@media all and (min-width: 720px) {
    .allekonzerteinner {
        width: 700px;
        margin: 0 auto;
    }
}

.grusswort figure {
    float: right;
    padding: 1vw 0 1vw 2vw;
}
.grusswort figure img {
    width: 110px;
    height: 110px;
}
@media all and (min-width: 720px) {
    .grusswort figure img {
        width: 160px;
        height: 160px;
    }
}

.ce_hyperlink {
    padding-bottom: 10px;
}

.footer {
	padding-top: 40px;
	padding-bottom: 25px;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/dunkelblau.jpg);
}
.footer p {
    display: inline-block;
}
.footer,
.footer span,
.footer p,
.footer strong {
    color: #fff;
}
.footer p a {
    display: inline-block;
}
@media all and (min-width: 1200px) {
    .footer {
        padding-top: 60px;
        padding-bottom: 30px;
    }
}
.footer ul.level1 li {
    display: block;
    width: auto;
    vertical-align: top;
}

@media all and (min-width: 960px) {
    .footer ul.level1 li {
        display: inline-block;
        vertical-align: top;
        width: 50%;
    }
    .footer ul.level2 {
        display: block;
    }
    .footer ul.level2 li {
        display: block;
    }
    .footer ul.level1 li.share {
    	text-align: right;
    }
}

#nav-holder {
    position: absolute;
    top: 17px;
    right: 9px;
    padding: 10px 8px 7px;
    background: #218ECC;
    border-radius: 0px;
}
#nav-icon {
    width: 28px;
    height: 24px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}

@media all and (min-width: 980px) {
    #nav-holder {
        display: none;
    }
}

.inline {
	display: inline-block;
}

#nav-icon span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #137;
    background: #218ECC;
    background: #fff;
    border-radius: 3px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .1s ease-in-out;
    -moz-transition: .1s ease-in-out;
    -o-transition: .1s ease-in-out;
    transition: .1s ease-in-out;
}

#nav-icon span:nth-child(1) {
    top: 0px;
}

#nav-icon span:nth-child(2),
#nav-icon span:nth-child(3) {
    top: 9px;
}

#nav-icon span:nth-child(4) {
    top: 18px;
}

#nav-icon.open span {
    background: #fff;
}

#nav-icon.open span:nth-child(1) {
    top: 9px;
    width: 0%;
    left: 50%;
}

#nav-icon.open span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

#nav-icon.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

#nav-icon.open span:nth-child(4) {
    top: 15px;
    width: 0%;
    left: 50%;
}
@media all and (min-width: 960px) {
	#nav-icon {
		display: none;
    }
}
.tothetop {
    display: none;
    position: fixed;
    width: 45px;
    height: 45px;
    bottom: 45px;
    right: 9px;
    border-radius: 0px;
    background-color: #218ECC;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/fast-arrow-top-fff-svgrepo-com.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 32px;
    cursor: pointer;
}
@media all and (min-width: 980px) {
	.tothetop:hover {
        opacity: 0.8;
    }
}
.navi-mobile {
    display: none;
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    background-color: #017;
    background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/hellblau.jpg);
    text-align: center;
    opacity: 0.99;
}
.navi-mobile ul {
    display: block;
    margin: 0 10px;
    text-align: center;
    padding-top: 80px;
}
.navi-mobile ul li {
    display: block;
}
.navi-mobile ul li a {
    text-decoration: none;
    display: block;
}
.navi-mobile ul li.active strong,
.navi-mobile ul li a {
    display: inline-block;
    font-size: 23px;
    line-height: 50px;
    margin: 0px 0 0 0;
    padding: 0;
    font-weight: normal;
    xbackground-color: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.92);
    color: #fff;
}
.navi-mobile ul li a:hover {
	opacity: 1;
}
.navi-mobile ul li.trail a,
.navi-mobile ul li.trail a:hover,
.navi-mobile ul li.trail strong,
.navi-mobile ul li.active strong {
    font-weight: normal;
}

@media all and (min-width: 720px) {
	.navi-mobile {
        display: none;
    }
}

.topnavi,
.navi-wide {
    display: none;
}
@media all and (min-width: 960px) {
	.topnavi {
	    display: block;
	    width: 100%;
	    margin: 0;
        padding: 0;
	    text-align: right;
	}
	.topnavi ul {
	    display: block;
	    width: 100%;
	    margin: 10px 0 0 0;
        padding: 0;
	    text-align: right;
	}
    .topnavi ul li {
		display: inline-block;
		margin: 0;
		padding: 0;
	}
    .topnavi ul li:first-of-type {
        background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/phone-blau.svg);    
        background-position: center left;
        background-repeat: no-repeat;
        background-size: auto 11px;
        padding-left: 11px;
    }	
    .topnavi ul li span,
    .topnavi ul li a,
    .topnavi ul li strong {
        display: block;
		text-decoration: none;
		font-size: 13px;
        letter-spacing: 1px;
        line-height: 35px;
		margin: 0;
        padding: 0 15px 0px;
		font-weight: bold;
		color: #218ECC;
		color: #222;
		color: #017;
	}
    .topnavi ul li span {
        padding-left: 20px;
        background-image: url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/phone-blau.svg);    
        background-position: center left;
        background-repeat: no-repeat;
        background-size: auto 11px;
		color: #218ECC;
		color: #222;
		color: #017;
	}
    .topnavi ul li.pagemitgliedwerden a,
    .topnavi ul li.pagemitgliedwerden strong {
    	background-color: #218ECC;
		color: #017;
        color: #fff;
		font-weight: bold;
        border-radius: 35px;
        margin-right: 20px;
        padding: 0 20px 0px;
	}
    .topnavi ul li a:hover,
	.topnavi ul li.trail a:hover,
    .topnavi ul li.active a:hover {
		opacity: 0.5;
	}
	.topnavi ul li strong,
	.topnavi ul li.trail a,
	.topnavi ul li.trail strong,
    .topnavi ul li.active a,
    .topnavi ul li.active strong {
		opacity: 0.5;
	}
    .topnavi ul li.pagemitgliedwerden a:hover,
    .topnavi ul li.pagemitgliedwerden strong {
	    background-color: #319EDC!important;
		opacity: 1!important;
	}
}

@media all and (min-width: 960px) {
	.navi-wide {
	    display: block;
	    width: calc(100% - 356px);
	    height: 80px;
        margin: 0 0 0 356px;
		padding: 0 0 20px 0;
	    text-align: center;
	}
	.navi-wide ul {
		display: block;
	    width: 80%;
        height: 80px;
		margin: 0 auto;
		padding: 0;
	    text-align: center;
	}
	.navi-wide ul li {
		display: inline-block;
		width: 25%;
        float: left;
	}
    .navi-wide ul li a {
		-webkit-transition: color 100ms ease;
		-moz-transition: color 100ms ease;
		-o-transition: color 100ms ease;
		transition: color 100ms ease;
    }
    .navi-wide ul li a,
    .navi-wide ul li strong {
        display: block;
		text-decoration: none;
		font-family: sans-serif;
		font-size: 15px;
        letter-spacing: 1px;
        line-height: 80px;
		font-weight: bold;
        text-transform: none;
		color: #218ECC;
		color: #017;
		margin: 0;
		padding: 0 0 0 0;
		text-align: center;
	}
	.navi-wide ul li a:hover {
		opacity: 0.5;
	}
	.navi-wide ul li.trail a,
	.navi-wide ul li.trail strong,
	.navi-wide ul li.active a,
	.navi-wide ul li.active strong {
		opacity: 0.5!important;
	}
}
@media all and (min-width: 1200px) {
	.navi-wide {
	    width: calc(100% - 356px - 20vw);
        margin-left: calc(15vw + 356px);
    }
}

.socialmedia {
    display: block;
    margin: 0 auto;
    padding: 5vw 0 6vw;
    text-align: center;
}
.socialmedia figure {
    display: inline-block;
    text-align: center;
}
.socialmedia img {
    display: block;
    width: auto;
    height: 29px;
}
.socialmedia a:hover {
    opacity: 0.6;
}
.socialmedia span {
    font-size: 14px;
    line-height: 20px;
}

.wrapper {
    padding-left: 10px;
    padding-right: 10px;
    margin: 0 auto;
}
@media all and (min-width: 720px) {
    .wrapper {
        padding-left: calc(50vw - 350px);
        padding-right: calc(50vw - 350px);
        margin: 0 auto;
    }
}
.wrapperflex {
    margin: 0 auto;
    padding: 0 10px;
}
@media all and (min-width: 720px) {
    .wrapperflex {
        width: 680px;
        padding-left: 0;
        padding-right: 0;
        margin: 0 auto;
    }
}

.wrapperleft {
    padding-left: 10px;
    padding-right: 10px;
    margin: 0;
}
@media all and (min-width: 720px) {
    .wrapperleft {
        width: 700px;
        padding-left: 0;
        padding-right: 0;
        margin: 0 auto;
        text-align: left;
    }
}
@media all and (min-width: 1200px) {
    .wrapperleft {
        width: auto;
        padding-left: 15vw;
        margin: 0;
        text-align: left;
    }
}

.mobileonly {
    display: block;
}
.wideonly {
    display: none;
}
@media all and (min-width: 960px) {
    .mobileonly {
        display: none;
    }
    .wideonly {
        display: block;
    }
}

.vorteile ul {
    padding-bottom: 10px;
}
.vorteile li {
    background-image:url(https://www.musikfreunde-oldenburg.de/files/vmo/layout/tick-green-freepik.svg);
    background-repeat: no-repeat;
    background-position: left 10px;
    background-size: 12px 12px;
    padding-left: 21px;
}