html,body,h1,h2,h3,h4,h5,h6
{
	font-family:Futura,Arial,sans-serif;
	font-weight:200;
}

body
{
	background-color:#111111;
	color:#ffffff;
}


a:link
{
	/*color:				#555555;
	font-style:			normal;*/
	text-decoration:	none;
}

a:visited
{
	/*color:				#666666;
	font-style:			normal;*/
	text-decoration:	none;
}

a:focus
{
	/*color:				#FFFFFF;
	font-style:			normal;*/
	text-decoration:	none;
}

a:hover
{
	/*color:				#AAAAAA;
	font-style:			normal;*/
	text-decoration:	none;
}

a:active
{
	/*color:				#FFFFFF;
	font-style:			normal;*/
	text-decoration:	none;
}


p
{
	margin-top: 16px;
	margin-bottom: 16px;
}

figure
{
	margin: 0px;
}

figcaption
{
	font-size: 10px;
	opacity: 0.5;
}

blockquote
{
	margin: 0px;
}

/*
q 
{
  quotes: "«" "»" "‹" "›";
}
q::before {
    content: open-quote;
}
q::after {
    content: close-quote;
}
*/




/* animations test only */

.cdm-animate-opacity-in{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.cdm-animate-opacity-out{animation:opac 0.8s}@keyframes opac{from{opacity:1} to{opacity:0}}

.cdm-container ul /* mailchimp archive */
{
	list-style-type: none;
	margin: 10px;
	padding: 0;
}

.cdm-container ul li /* mailchimp archive */
{
	background: #282828;
	color: #ffffff;
	padding: 8px;
	margin: 5px;
}


/* font sizes */

.cdm-medium-plus /* usage: btns (on stage) */
{
	font-size: 16px;
}

/* colors */

.cdm-black-transparent {color:#fff;background-color:rgba(0, 0, 0, 0.6)}
.cdm-hover-black-transparent:hover {color:#fff !important; background-color:rgba(0, 0, 0, 0.6) !important}

.cdm-dark-grey-transparent {color:#fff;background-color:rgba(0.4, 0.4, 0.4, 0.6)}
.cdm-hover-dark-grey-transparent:hover {color:#fff !important; background-color:rgba(0.4, 0.4, 0.4, 0.6) !important}

.cdm-dark-ocean-blue {color:#fff;background-color:#004f65}
.cdm-text-ocean-blue {color:#004f65 !important}
.cdm-border-dark-ocean-blue {border-color:#004f65 !important}

.cdm-dark-blue-grey {color:#fff;background-color:#296b85}
.cdm-text-dark-blue-grey {color:#296b85 !important}
.cdm-border-dark-blue-grey {border-color:#296b85 !important}


.cdm-light-black {color:#fff;background-color:#141414}
.cdm-text-light-black {color:#141414 !important}
.cdm-border-light-black {border-color:#141414 !important}

.cdm-hover-light-black:hover {color:#fff !important; background-color:#141414 !important}
.cdm-hover-text-light-black:hover {color:#141414 !important}
.cdm-hover-border-light-black:hover {border-color:#141414 !important}


.cdm-darkest-grey {color:#fff;background-color:#282828}
.cdm-text-darkest-grey {color:#282828 !important}
.cdm-border-darkest-grey {border-color:#282828 !important}

.cdm-hover-darkest-grey:hover {color:#fff !important; background-color:#282828 !important}
.cdm-hover-text-darkest-grey:hover {color:#282828 !important}
.cdm-hover-border-darkest-grey:hover {border-color:#282828 !important}


.cdm-fair-grey {color:#000000;background-color:#a1a1a1}
.cdm-text-fair-grey {color:#a1a1a1 !important}
.cdm-border-fair-grey {border-color:#a1a1a1 !important}

.cdm-hover-fair-grey:hover {color:#000000 !important; background-color:#a1a1a1 !important}
.cdm-hover-text-fair-grey:hover {color:#a1a1a1 !important}
.cdm-hover-border-fair-grey:hover {border-color:#a1a1a1 !important}


.cdm-fairest-grey {color:#000000;background-color:#cdcdcd}
.cdm-text-fairest-grey {color:#cdcdcd !important}
.cdm-border-fairest-grey {border-color:#cdcdcd !important}

.cdm-hover-fairest-grey:hover {color:#000000 !important; background-color:#cdcdcd !important}
.cdm-hover-text-fairest-grey:hover {color:#cdcdcd !important}
.cdm-hover-border-fairest-grey:hover {border-color:#cdcdcd !important}


/* video containers */

/* set max-width of the parent element */
.video-wrap
{
	width: 100%;
	max-width: 720px;
}

/* set aspect ratio */
.video-container
{
	position: relative;
	overflow: hidden;
	height: 0;
	padding-bottom: 56.25%; /* for aspect ratio 16:9 */
}

.video-container iframe, .video-container embed
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	max-width: 100%;
}






/* background images */

/* background images - main */

.cdm-bg-test-01
{
	background-image: url("../images/background/cdm-bg-test-1200x1200-01.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-test-02
{
	background-image: url("../images/background/cdm-bg-timeline-01-200x20.png");

	background-repeat: repeat-y;
	background-position: left top; /* center or left top or left bottom */
	
	/*min-height: 450px;
	max-width: 1200px;*/
}

.cdm-bg-timeline
{
	background-image: url("../images/layout/cdm-sprite-400x400-20200815.png");
	
	background-repeat: repeat-y;	
	background-position: 0px 0px;
}

.cdm-bg-timeline-branch-01
{
	background-image: url("../images/layout/cdm-sprite-400x400-20200815.png");

	background-repeat: no-repeat;	
	background-position: -600px 0px;
	
	width: 200px;
	height: 20px;
}

.cdm-bg-timeline-branch-02
{
	background-image: url("../images/layout/cdm-sprite-400x400-20200815.png");

	background-repeat: no-repeat;	
	background-position: -600px -20px;
	
	width: 200px;
	height: 50px;
}

.cdm-bg-timeline-branch-02-01
{
	background-image: url("../images/layout/cdm-sprite-400x400-20200815.png");

	background-repeat: no-repeat;	
	background-position: -600px -70px;
	
	width: 200px;
	height: 50px;
}




.cdm-bg-magicnight-01
{
	background-image: url("../images/background/cdm-bg-magicnight-01-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-magicnight-02
{
	background-image: url("../images/background/cdm-bg-magicnight-02-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-20years-01
{
	background-image: url("../images/background/cdm-bg-20years-01-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-band01
{
	background-image: url("../images/background/cdm-bg-band-01-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-content1-bg
{
	background-image: url("../images/background/cdm-bg-test-1200x1200-01.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-cbtl-01
{
	background-image: url("../images/background/cdm-bg-cbtl-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-film-01
{
	background-image: url("../images/background/cdm-bg-film-01-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-hammer-01
{
	background-image: url("../images/background/cdm-bg-hammer-01-1200x1400.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-hammer-02
{
	background-image: url("../images/background/cdm-bg-hammer-02-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-division-heads-01
{
	background-image: url("../images/background/cdm-bg-division-heads-01-1200x1400.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-division-heads-02
{
	background-image: url("../images/background/cdm-bg-division-heads-02-1200x1400.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-history-01
{
	background-image: url("../images/background/cdm-bg-history-01-1200x1788.jpg");

	background-repeat: repeat-y;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-lines-01
{
	background-image: url("../images/background/cdm-bg-lines-01-1200x1600.jpg"),url("../images/background/cdm-bg-lines-02-1200x1600.jpg");

	background-repeat: no-repeat, repeat-y;
	background-position: left top, left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-andreas-01
{
	background-image: url("../images/background/cdm-bg-andreas-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-bryan-01
{
	background-image: url("../images/background/cdm-bg-bryan-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-dani-01
{
	background-image: url("../images/background/cdm-bg-dani-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-fabian-01
{
	background-image: url("../images/background/cdm-bg-fabian-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-francesco-01
{
	background-image: url("../images/background/cdm-bg-francesco-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-goegs-01
{
	background-image: url("../images/background/cdm-bg-goegs-01-1200x2250.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-kathrin-01
{
	background-image: url("../images/background/cdm-bg-kathrin-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-kata-01
{
	background-image: url("../images/background/cdm-bg-kata-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-thomas-01
{
	background-image: url("../images/background/cdm-bg-thomas-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-uese-01
{
	background-image: url("../images/background/cdm-bg-uese-01-1200x1000.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}


.cdm-bg-stagelights-01
{
	background-image: url("../images/background/cdm-bg-stagelights-01-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-stagelights-02
{
	background-image: url("../images/background/cdm-bg-stagelights-02-1200x1800.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-stagelights-03
{
	background-image: url("../images/background/cdm-bg-stagelights-03-1200x1800.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-pictures-01
{
	background-image: url("../images/background/cdm-bg-pictures-01-1200x1920.jpg"),url("../images/background/cdm-bg-pictures-02-1200x1920.jpg");

	background-repeat: no-repeat, repeat-y;
	background-position: left top, left top; /* center top or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-silhouette-02
{
	background-image: url("../images/background/cdm-bg-silhouette-02-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-darkside01
{
	background-image: url("../images/background/cdm-bg-darkside01-1200x1600.png");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-wall-concrete-01
{
	background-image: url("../images/background/cdm-bg-wall-concrete-03-1200x1200.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}


.cdm-bg-wall-logo-01
{
	background-image: url("../images/background/cdm-bg-wall-logo-01-1200x2400.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

.cdm-bg-wall-logo-02
{
	background-image: url("../images/background/cdm-bg-wall-logo-02-1200x1800.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}


.cdm-bg-be-careful-01
{
	background-image: url("../images/background/cdm-bg-be-careful-01-1200x450.jpg");

	background-repeat: no-repeat;
	background-position: left top; /* center or left top or left bottom */
	
	min-height: 450px;
	max-width: 1200px;
}

/* background images - parts */


/* background images - links */




/* spacer */

.cdm-top-spacer-01 /* usage: template */
{
	min-height:15vmin;
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-01 /* deprecated */
{
	margin-top:120px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-02 /* deprecated */
{
	margin-top:180px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-03 /* deprecated */
{
	margin-top:80px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-20
{
	margin-top:20px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-50
{
	margin-top:50px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-60
{
	margin-top:60px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}


.cdm-main-spacer-80
{
	margin-top:80px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-104
{
	margin-top:104px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-120
{
	margin-top:120px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-130
{
	margin-top:130px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}

.cdm-main-spacer-145
{
	margin-top:145px;
	/*min-height:12vmin;*/
	/*min-height:calc(100% - 50px);*/
}


h1
{
	/*padding-top:15vmin;*/ /* use spacer instead */
	margin-bottom:0px;
	padding-bottom:0px;
}

h2
{
	font-size: 15px;
	display: inline-block;
	vertical-align: middle;
	margin: 0px;
}

h3
{
	margin-bottom:0px;
	padding-bottom:0px;
}

h3.cdm-band-member
{
	font-size: 36px;
	display: inline-block;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

h4
{
	margin-top:0px;
	margin-bottom:0px;
	padding-bottom:0px;
}

h5 /* used in ON STAGE*/
{
	margin-bottom:0px;
	padding-bottom:0px;
}
/*
h4
{
	font-size: 15px;
	display: inline-block;
	vertical-align: top;
	padding-left: 3px;
	margin-bottom: 8px;
}
*/
.cdm-card-120 h4
{
	font-size:16px;
}

.cdm-inline-block
{
	font-size: 15px;
	display: inline-block;
	vertical-align: top;
	margin-top:0px;
	padding-left: 3px;
	margin-bottom: 8px;
}

/* select restyle */
/* inspired by: https://www.clickstorm.de/blog/dropdown-css3/ */

select
{
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border: none;
	
	width: 100%;
	height: 40px;
	-moz-padding-start: calc(10px - 3px);
	padding-left: 10px;
	/* background: url(fff-0-2.png) repeat; */
	/* color: #fff; */
	/* font-family: 'Open Sans', sans-serif; */
	font-size: 16px;
	/* outline: none; */
	cursor: pointer;
}

select[multiple]
{
    height: auto;
}

select option
{
	color: #666;
}

select[multiple] option
{
    color: #fff; 
}

select::-ms-expand
{
	display: none;
}

select:focus::-ms-value 
{
	background-color: transparent;
}

.cdm-select
{
	
	
}



/* use: w3-margin-top (Adds a 16px top margin to an element) used in mainmenu bottom */

/*
.cdm-padding-16-toponly 
{
	padding-top:16px!important;
}
*/ 


.w3-panel p
{
	margin-bottom: 0px;
}


.cdm-container
{
	margin-top: 16px;
	padding-top: 0px;
	padding-bottom: 0px;
}

.cdm-container p
{
	margin-top: 0px;
	margin-bottom: 0px;
}

.cdm-panel
{
	margin-top: 16px;
	margin-bottom: 16px;
	padding-top: 0px;
	padding-bottom: 0px;
}

.cdm-padding-8
{
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.cdm-padding-12
{
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 12px;
	padding-bottom: 12px;
}

.cdm-no-padding
{
	padding-left: 0px !important;
	padding-right: 0px !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.cdm-no-padding-top
{
	padding-top: 0px !important;
}

.cdm-no-padding-topbottom
{
	padding-top: 0px;
	padding-bottom: 0px;
}

.cdm-small-padding-topbottom
{
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

.cdm-no-padding-leftright
{
	padding-left: 0px !important;
	padding-right: 0px !important;
}

.cdm-no-padding-right
{
	padding-right: 0px !important;
}




.cdm-no-margin-top
{
	margin-top: 0px;
}

.cdm-no-margin-bottom
{
	margin-bottom: 0px;
}

.cdm-no-margin-topbottom
{
	margin-top: 0px;
	margin-bottom: 0px;
}

.cdm-margin-bottom-8
{
	margin-bottom: 8px;
}

.cdm-margin-topbottom-8
{
	margin-top: 8px;
	margin-bottom: 8px;
}

.cdm-margin-right-8
{
	margin-right: 8px;
}

.cdm-margin-rightbottom-8
{
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-submenu
{
	padding:0 8px 8px 0;
}

.cdm-block-120
{
	width: 120px;
	display: block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-block-248
{
	width: 248px;
	display: block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card
{
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-120
{
	width: 120px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-min-120 /* usage: btns (on stage) */
{
	min-width: 120px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-min-200 /* usage: index */
{
	min-width: 200px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-248 /* usage: on stage */
{
	width: 248px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-245 /* usage: contact */
{
	width: 245px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-490 /* usage: contact - not final */
{
	width: 490px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-max-220 /* usage: on stage pictures */
{
	max-width: 220px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}


.cdm-card-max-240 /* usage: pictures */
{
	max-width: 240px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-max-248
{
	max-width: 248px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-max-760
{
	max-width: 760px;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	margin-bottom: 8px;
}

.cdm-card-max-80
{
	max-width: 80px;
	display: inline-block;
	vertical-align: top;
	margin-right: 4px;
	margin-bottom: 4px;
}

.cdm-card-max-height-60
{
	max-height: 60px;
	display: inline-block;
	vertical-align: top;
	margin-right: 4px;
	margin-bottom: 4px;
}


.cdm-min-width-50px
{
	min-width: 50px;
}

.cdm-min-width-60px
{
	min-width: 60px;
}

.cdm-min-width-100px
{
	min-width: 100px;
}

.cdm-min-width-120px
{
	min-width: 120px;
}

.cdm-min-width-150px
{
	min-width: 150px;
}

.cdm-min-width-200px
{
	min-width: 200px;
}

.cdm-min-width-250px
{
	min-width: 250px;
}

.cdm-min-width-300px
{
	min-width: 300px;
}



.cdm-max-width-400px
{
	max-width: 400px;
}

.cdm-max-width-450px
{
	max-width: 450px;
}

.cdm-max-80-pct
{
	max-width: 80%;
}

.cdm-card p
{
	margin-top: 4px;
	margin-bottom: 8px;
}

.cdm-card-header-150 /* deprecated: use cdm-min-width... */
{
	min-width: 150px;
}

/*
.cdm-card-header-240
{
	min-width: 240px;
	background: url("../images/layout/cdm-card-header-240x80.png") no-repeat;
}
*/

.cdm-fullspace
{
	min-height:450px;
	width:100%;
}

.main-top
{
	margin-top:120px;
}



/*
#main-menu-bottom .w3-show-inline-block
{
	margin-bottom:0px;
	padding-bottom:0px;
}
*/


/* sprite */
/* images with sprite */

.cdm-sprite
{
	background: url("../images/layout/cdm-sprite-800x800.png") no-repeat;
}

.cdm-icon-logo-50
{
	width: 50px; /* icon width */
	height: 50px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -110px 0px; /* icon background position in cdm-sprite */
}

.cdm-icon-logo-50:hover
{
	background-position: -110px -50px; /* icon background position in cdm-sprite */
}

.cdm-icon-logo-100
{
	width: 100px; /* icon width */
	height: 100px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -320px 0px; /* icon background position in cdm-sprite */
}

.cdm-icon-logo-100:hover
{
	background-position: -320px -100px; /* icon background position in cdm-sprite */
}

.cdm-icon-younger-logo-150-50
{
	width: 150px; /* icon width */
	height: 50px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -160px 0px; /* icon background position in cdm-sprite */
}

.cdm-icon-younger-logo-150-50:hover
{
	background-position: -160px -50px; /* icon background position in cdm-sprite */
}

.cdm-icon-redwood-logo-150-50
{
	width: 150px; /* icon width */
	height: 50px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -160px -200px; /* icon background position in cdm-sprite */
}

.cdm-icon-redwood-logo-150-50:hover
{
	background-position: -160px -250px; /* icon background position in cdm-sprite */
}

.cdm-icon-arrow-right-30
{
	width: 30px; /* icon width */
	height: 30px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -30px; /* icon background position in cdm-sprite */
}

.cdm-icon-arrow-left-30
{
	width: 30px; /* icon width */
	height: 30px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -60px; /* icon background position in cdm-sprite */
}

.cdm-test-logo-180-60
{
	width: 180px; /* icon width */
	height: 60px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -420px -80px; /* icon background position in cdm-sprite */
}


/* pseudo elements with sprite */
/* credit: https://css-tricks.com/pseudo-spriting/ */


.cdm-icon-arrow-nw-18:before
{
	/* empty content required for pseudo element to display */
	content: "";

	/* size of img within sprite */
	width: 10px;
	height: 18px;

	/* sprite */
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px 0px no-repeat;
	
	/* position / spacing */
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-icon-arrow-nw-18:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -40px no-repeat;
}


.cdm-icon-arrow-nw-10:before
{
	content: "";
	width: 10px;
	height: 10px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -3px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-icon-arrow-nw-10:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -43px no-repeat;
}



.cdm-icon-arrow-ne-18:before
{
	content: "";
	width: 10px;
	height: 18px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -10px 0px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-icon-arrow-ne-18:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -10px -40px no-repeat;
}



.cdm-icon-arrow-sw-10:before
{
	content: "";
	width: 10px;
	height: 10px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -28px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-icon-arrow-sw-10:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -68px no-repeat;
}

.cdm-icon-arrow-sw-18:before
{
	content: "";
	width: 10px;
	height: 18px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -20px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-icon-arrow-sw-18:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") 0px -60px no-repeat;
}



/* icon 30 */ 

.cdm-icon-30-content
{
	/* to adjust div in <a></a> tags that contain an icon of height 30 px */
	display: inline-block;
	padding-top: 3px;
}

.cdm-arrow-left-30:before
{
	content: "";
	width: 30px;
	height: 30px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -90px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-arrow-left-30:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -210px no-repeat;
}

.cdm-arrow-left-30-inactive:before
{
	content: "";
	width: 30px;
	height: 30px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -330px no-repeat;
	float: left;
	margin: 0 5px 2px 0;
}

.cdm-arrow-right-30:before
{
	content: "";
	width: 30px;
	height: 30px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -120px no-repeat;
	float: right;
	margin: 0 0 2px 5px;
}

.cdm-arrow-right-30:hover:before
{
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -240px no-repeat;
}

.cdm-arrow-right-30-inactive:before
{
	content: "";
	width: 30px;
	height: 30px;
	background: url("../images/layout/cdm-sprite-400x400-20200815.png") -40px -360px no-repeat;
	float: right;
	margin: 0 0 2px 5px;
}


.cdm-icon-document-01-30
{
	width: 30px; /* icon width */
	height: 40px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -450px; /* icon background position in cdm-sprite */
	float: left;
	margin: -5px 10px 5px 5px;
}

.cdm-icon-document-01-30:hover
{
	background-position: -40px -490px; /* icon background position in cdm-sprite */
}


.cdm-icon-document-02-30
{
	width: 30px; /* icon width */
	height: 40px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -530px; /* icon background position in cdm-sprite */
	float: left;
	margin: -5px 10px 5px 5px;
}

.cdm-icon-document-02-30:hover
{
	background-position: -40px -570px; /* icon background position in cdm-sprite */
}


.cdm-icon-document-03-30
{
	width: 30px; /* icon width */
	height: 40px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -610px; /* icon background position in cdm-sprite */
	float: left;
	margin: -5px 10px 5px 5px;
}

.cdm-icon-document-03-30:hover
{
	background-position: -40px -650px; /* icon background position in cdm-sprite */
}


.cdm-icon-document-04-30
{
	width: 30px; /* icon width */
	height: 40px; /* icon height */
	display: inline-block; /* display icon (span) as inline block (inline-block) or block (block)*/
	background-position: -40px -690px; /* icon background position in cdm-sprite */
	float: left;
	margin: -5px 10px 5px 5px;
}

.cdm-icon-document-04-30:hover
{
	background-position: -40px -730px; /* icon background position in cdm-sprite */
}





/* animation */

.cdm-animate-opacity-in{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.cdm-animate-opacity-out{animation:opac 0.8s}@keyframes opac{from{opacity:1} to{opacity:0}}

.cdm-animate-opacity-out
{
	animation-name:opac;
	animation-duration:1.5s;
	animation-fill-mode:forwards;
}
@keyframes opac
{
	from{opacity:1} to{opacity:0}
}










