body{
background-image: url(/images/cmc-home.jpg) ;
background-color:#000000;
color:#CCCCCC;
background-size: cover;
}
body a{
color:#CCCCCC;
text-decoration:underline;
}
#sp-header {
    background:none;
}
#sp-footer, #sp-bottom {
    background: none;
    color: #FFFFFF;
}
div.divbio { float:left; }
.clearBoth { clear:both; }
.divbio-div:after {
    content: "";
    clear: both;
    display: table;
}
.sp-megamenu-parent > li > a:hover {
  color:#f5b986;
}
.sp-megamenu-parent > li.active > a, .sp-megamenu-parent > li.active:hover > a {
  color: #f5b986;
}
a{
    color:#f5b986;
}

#sp-left .sp-module, #sp-right .sp-module {
  margin-top: 50px;
  border: 0px solid #f3f3f3;
  padding: 30px;
  border-radius: 3px;
}
#sp-left .sp-module img{
max-width:100px;
width:auto;
padding:3px;
}
#sp-left .sp-module ul > li, #sp-right .sp-module ul > li {
  display: block;
  border-bottom: 0px solid #f3f3f3;
}
#get-started-page .section1 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.audio{
height:18px;
width:250px;
}
.pink-box {
    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.debutcd{
font-size:16px;
text-align:center;
}
.image-container img {
  max-width: 400px;
  height: auto;object-fit: cover;
}
.imagemusik {
    width:400;
    height: auto;
    object-fit: cover;
}
.avPlayerWrapper .avPlayerContainer .avPlayerBlock audio {
  padding: 1px;
  box-sizing: border-box;
}
.flex-container{
	width: 80%;
	min-height: 150px;

	display: -webkit-flex; /* Safari */		
	display: flex; /* Standard syntax */
}
.flex-container .column{
	padding: 10px;

	-webkit-flex: 1; /* Safari */
	-ms-flex: 1; /* IE 10 */
	flex: 1; /* Standard syntax */
}
.flex-container .column.bg-alt{
	background:none;
}
.flex-container .column img{
width: 200px; /* Set a fixed width for all images */
  height: 200px; /* Set a fixed height for all images */
  object-fit: cover; /* This will make sure the images maintain their proportions */
  margin: 5px; /* This will add some spacing between the images */
}
#sp-header .logo a {
  font-size: 40px;
  color:#f5b986;
  line-height: 1;
  margin: 0;
  padding: 0;
  text-decoration:none;

}
/* Three image containers (use 25% for four, and 50% for two, etc) */
.rowvideos {
width:98%;
 text-align:center; margin: 0 auto;
}
.columnvideos {

text-align:center; margin-right:25px;display:inline-block;
}

/* Cle;ar floats after image containers */
.rowvideos::after {
  content: "";
  clear: both;
  display: table;
}
#cf_1 {
background :none;
    max-width:70%;
}
.cf-form-wrap{
background-color:none;
}
.convertforms.cf-success .cf-response {
    background-color: #494a4d;
    display: block;
}
.convertforms .captcha-container .captcha-equation {
    font-size: 1.2em; color: #CCCCCC;
}

#form1_captcha4{
background-color: #000000;
color: #999999;
font-size:16px;
border:none;
width:200px;
display: table-cell;
}
.convertforms .captcha-container .captcha-equation {

    flex-grow: 0; 

}
.red{
color: #FF0000;
}
.star{
color: #FF0000;
}
#jform_spacer-lbl{
color: #CCCCCC;
font-size:16px;
}
#jform_contact_name{
font-size:16px;
}
#jform_contact_name-lbl{
font-size:16px;
}
.required{
color: #CCCCCC;
font-size:16px;
}

#form1_name{
background-color: #000000;
color: #999999;
font-size:16px;
border:none;
}
#form1_email{
background-color: #000000;
color: #999999;
font-size:16px;
border:none;
}
#form1_message{
background-color: #000000;
color: #999999;
font-size:16px;
border:none;
}


.offcanvas-menu {
    background: url(/images/back_cmc.jpg) repeat;
	color:#ffffff;
}
.offcanvas-menu .offcanvas-inner ul.menu>li span {
    color: #f5b986;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a, .offcanvas-menu .offcanvas-inner ul.menu>li span {
    color: #ffffff;text-decoration:none;
}
.offcanvas-menu .offcanvas-inner ul.menu li.active a {
    color: #f5b986 !important;
}

.offcanvas-menu .offcanvas-inner ul.menu>li a:hover,.offcanvas-menu .offcanvas-inner ul.menu>li a:focus,.offcanvas-menu .offcanvas-inner ul.menu>li span:hover,.offcanvas-menu .offcanvas-inner ul.menu>li span:focus{color:#f5b986;}

.offcanvas-menu .offcanvas-inner ul.menu>li>ul li a img {
    display:inline;
	 font-size: 17px;
    padding: 8px 8px;
    line-height: 18px;
    font-weight: bold;
	width:50px;
	height:auto;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover,.offcanvas-menu .offcanvas-inner ul.menu>li a:focus,.offcanvas-menu .offcanvas-inner ul.menu>li span:hover,.offcanvas-menu .offcanvas-inner ul.menu>li span:focus{color:#f5b986;}

offcanvas-menu logo{
color:#ffffff;
text-decoration:none;
}
.offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent .menu-toggler {
    color: #FFFFFF;
	font-size:18px;
}

.offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>a>.menu-toggler, .offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>.menu-separator>.menu-toggler {
    color: #FFFFFF;
	font-size:18px;
}
.offcanvas-menu.border-menu .offcanvas-inner ul.menu ul {
    padding-bottom:1px;
}


.burger-icon {
color:#ffffff;
}

.burger-icon {
background-color: #FFFFFF;
color:#000000;
}
.burger-icon>span {
width:35px;

}
@media only screen and (max-width : 992px) {

#get-started-page .section1 {
    display: block;

}
.image-container img {
  max-width:100%;
  height: auto;
  object-fit: cover;
}

}

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

#get-started-page .section1 {
    display: block;

}
.image-container img {
  max-width:100%;
  height: auto;
  object-fit: cover;
}
table td{
font-size:14px;
}

}


@media only screen and (max-width: 480px) {
body{
background-image: url(/images/back_cmc-startseite_mobile.jpg);  
background-color:#2c2d31;
color:#CCCCCC;
background-size: contain;
 background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:center;

}
#sp-header .logo a {
padding-top:20px;
  font-size: 30px;
}
.flex-container{
	width: 100%;
	margin: 0 auto;
	display: -webkit-flex; /* Safari */		
	display: block; /* Standard syntax */
}
.flex-container .column{
	padding: 10px;
	background: #dbdfe5;
	-webkit-flex: 1; /* Safari */
	-ms-flex: 1; /* IE 10 */
	flex: 1; /* Standard syntax */
}
.flex-container .column.bg-alt{
	background: #b4bac0;
}
.flex-container .column img{
width: 100%; /* Set a fixed width for all images */
  height:auto; /* Set a fixed height for all images */
  object-fit: cover; /* This will make sure the images maintain their proportions */
  margin: 5px; /* This will add some spacing between the images */
}
#get-started-page .section1 {
    display: block;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.image-container img {
  max-width:100%;
  height: auto;
  object-fit: cover;
}
table td{
font-size:14px;
}

}