body {
	background-color: ${color.content.background-color};
	font-family:	${font.standard.font-family};
	font-size:		${font.standard.font-size};
	font-weight:	${font.standard.font-weight};
	font-style:		${font.standard.font-style};
}

#content_main, #content_sidebar {
	font-family:	${font.standard.font-family};
	font-size:		${font.standard.font-size};
	font-weight:	${font.standard.font-weight};
	font-style:		${font.standard.font-style};
	color: 			${color.content.color};
}
#title, #subtitle, #title_separator_normal, #page_wrapper h1, #page_wrapper h2, #page_wrapper h3, #page_wrapper h4, #page_wrapper h5, #page_wrapper h6 {
	color:			${color.header.title.color};
}
#title {
	font-size:		${font.title.font-size};
	font-family:	${font.title.font-family};
	font-weight:	${font.title.font-weight};
	font-style:		${font.title.font-style};
}
#page_wrapper h1, .cm-h1 {
	font-size:		${font.h1.font-size};
	font-family:	${font.h1.font-family};
	font-weight:	${font.h1.font-weight};
	font-style:		${font.h1.font-style};
}
	
#page_wrapper h2, #content_sidebar h2, #subtitle {
	font-size:		${font.h2.font-size};
	font-family:	${font.h2.font-family};
	font-weight:	${font.h2.font-weight};
	font-style:		${font.h2.font-style};
}
#page_wrapper h3 {
	font-size:		${font.h3.font-size};
	font-family:	${font.h3.font-family};
	font-weight:	${font.h3.font-weight};
	font-style:		${font.h3.font-style};
}


/* ################################################## */
/* ################ INPUT ELEMENTS ################## */
/* ################################################## */
#page_wrapper .cm_widget input[type='text'], #page_wrapper .cm_widget input[type='date'], #page_wrapper .cm_widget input[type='datetime'], 
#page_wrapper .cm_widget input[type='email'], #page_wrapper .cm_widget input[type='number'], #page_wrapper .cm_widget input[type='password'],
#page_wrapper .cm_widget input[type='search'], #page_wrapper .cm_widget input[type='tel'], #page_wrapper .cm_widget input[type='time'],
#page_wrapper .cm_widget input[type='url'], #page_wrapper .cm_widget textarea, #page_wrapper .cm_widget select,
#page_wrapper .cm_widget button, #page_wrapper .cm_widget input[type='button'], #page_wrapper .cm_widget input[type='submit'], #page_wrapper .cm_widget input[type='reset'] {
	border-radius:		0px;
	padding:			9px 14px;
	color:				${color.content.color};
	background-color:	${color.content.background-color};
	background-color:	rgba(${color.content.color.red}, ${color.content.color.green}, ${color.content.color.blue}, 0.08);
	background-color:	rgba(${color.content.color.rgb},0.08);
	border:				1px solid rgba(${color.content.color.red}, ${color.content.color.green}, ${color.content.color.blue}, 0.15);
	border:				1px solid rgba(${color.content.color.rgb},0.15);
	-webkit-transition:	color 0.3s, background-color 0.3s, box-shadow 0.3s, border 0.3s;
	-moz-transition:	color 0.3s, background-color 0.3s, box-shadow 0.3s, border 0.3s;
	-o-transition:		color 0.3s, background-color 0.3s, box-shadow 0.3s, border 0.3s;
	transition:			color 0.3s, background-color 0.3s, box-shadow 0.3s, border 0.3s;
	
	font-family:	${font.standard.font-family};
	font-size:		${font.standard.font-size};
	font-weight:	${font.standard.font-weight};
	font-style:		${font.standard.font-style};
}
#page_wrapper .cm_widget button, #page_wrapper .cm_widget input[type='button'], #page_wrapper .cm_widget input[type='submit'], #page_wrapper .cm_widget input[type='reset'] {
	cursor:			pointer;
}
#page_wrapper .cm_widget input[type='text']:focus, #page_wrapper .cm_widget input[type='date']:focus, #page_wrapper .cm_widget input[type='datetime']:focus, 
#page_wrapper .cm_widget input[type='email']:focus, #page_wrapper .cm_widget input[type='number']:focus, #page_wrapper .cm_widget input[type='password']:focus,
#page_wrapper .cm_widget input[type='search']:focus, #page_wrapper .cm_widget input[type='tel']:focus, #page_wrapper .cm_widget input[type='time']:focus,
#page_wrapper .cm_widget input[type='url']:focus, #page_wrapper .cm_widget textarea:focus, #page_wrapper .cm_widget select:focus, #page_wrapper .cm_widget select:focus option,
#page_wrapper .cm_widget button:hover, #page_wrapper .cm_widget input[type='button']:hover, #page_wrapper .cm_widget input[type='submit']:hover, #page_wrapper .cm_widget input[type='reset']:hover {
	color:				#FFFFFF;
	color:				${color.content.background-color};
	background-color:	rgba(0,0,0,0.7);
	background-color:	rgba(${color.content.color.red}, ${color.content.color.green}, ${color.content.color.blue}, 0.7);
	background-color:	rgba(${color.content.color.rgb},0.7);
	box-shadow:			0px 0px 15px rgba(0,0,0,0.3);
	outline:			none;
}

.shopWidgetSeperatedDiv input[type='text'], .shopWidgetSeperatedDiv button, .shopWidgetSeperatedDiv input[type='button'], .shopWidgetSeperatedDiv input[type='submit'], .shopWidgetSeperatedDiv input[type='reset'] {
	padding:		8px 3px;
	min-width:		45px;
}	
.shopWidgetSeperatedDiv button, .shopWidgetSeperatedDiv input[type='button'], .shopWidgetSeperatedDiv input[type='submit'], .shopWidgetSeperatedDiv input[type='reset'] {
	background-size: 	cover !important;
	border:				none;
}




/* ========================================================
	3 - Navigation
=========================================================== */

#navigation_background, #navigation_wrapper  {
	background-color:	${color.navigation.background-color};
}

/** 1st Level **/

#nav-mobile-heading a {
	font-size:		${font.navigation.font-size};
	font-family:	${font.navigation.font-family};
	font-weight:	${font.navigation.font-weight};
	font-style:		${font.navigation.font-style};
	color:			${color.navigation.color} !important;
}
#cm_navigation a {
	font-size:		${font.navigation.font-size};
	font-family:	${font.navigation.font-family};
	font-weight:	${font.navigation.font-weight};
	font-style:		${font.navigation.font-style};
}

#page_wrapper #cm_navigation > ul > li {
	background-color:			${color.navigation.background-color};
}

#page_wrapper #cm_navigation > ul > li > a {
	color:			${color.navigation.color};
}

#page_wrapper #cm_navigation>ul>li.cm_current,
#page_wrapper #cm_navigation>ul>li:hover {
	background-color:		${color.navigation.color};
}

#page_wrapper #cm_navigation>ul>li.cm_current>a,
#page_wrapper #cm_navigation ul>li:hover>a,
#page_wrapper #navigation_wrapper #nav-mobile-heading a,
#page_wrapper #navigation_wrapper #nav-mobile-heading a:hover {
	color:					${color.navigation.background-color};
}

/** 2nd Level **/

#page_wrapper #cm_navigation > ul > li > ul > li {
	background-color: 		${color.subnavigation.background-color};
}
#page_wrapper #cm_navigation > ul > li > ul > li.cm_current, 
#page_wrapper #cm_navigation > ul > li > ul > li:hover {
	background-color: 		${color.subnavigation.color};
}

#page_wrapper #cm_navigation > ul > li > ul > li > a {
	color: 					${color.subnavigation.color};
}
#page_wrapper #cm_navigation > ul > li > ul > li:hover > a,
#page_wrapper #cm_navigation > ul > li > ul > li.cm_current > a {
	color:					${color.subnavigation.background-color};
}


/** 3rd Level **/

#page_wrapper #cm_navigation > ul > li > ul > li > ul > li {
	background-color: 		${color.subnavigation.background-color};
}
#page_wrapper #cm_navigation > ul > li > ul > li > ul > li.cm_current, 
#page_wrapper #cm_navigation > ul > li > ul > li > ul > li:hover {
	background-color: 		${color.subnavigation.color};
}

#page_wrapper #cm_navigation > ul > li > ul > li > ul > li > a {
	color: 					${color.subnavigation.color};
}
#page_wrapper #cm_navigation > ul > li > ul > li > ul > li:hover > a,
#page_wrapper #cm_navigation > ul > li > ul > li > ul > li.cm_current > a {
	color:					${color.subnavigation.background-color};
}


/* ========================================================
	4 - Title
=========================================================== */

#header_wrapper {
	background-color: ${color.header.background-color};
}

/* ========================================================
	5 - Inhaltsbereich
=========================================================== */
#content_wrapper {
	color:				${color.content.color};
	background-color: 	${color.content.background-color}
}	

#page_wrapper h1, .cm-h1, #page_wrapper h2, #page_wrapper h3 {
	color:				${color.content.headline.color};
}

#page_wrapper a {
	color:				${color.content.link.color};
	text-decoration: underline;
}
#page_wrapper a:hover {
	color:				${color.content.link.hover.color};
	text-decoration: underline;
}

/* ========================================================
	6 - Sidebar
=========================================================== */

#content_sidebar {
	color:				${color.content.color};
	background-color: 	${color.content.background-color}
}

/* ========================================================
	7 - Footer
=========================================================== */

#footer_wrapper {
	color:				${color.footer.color};
	background-color:	${color.footer.background-color}
}

#footer_wrapper a,
#footer_wrapper a:hover {
	color:				${color.footer.color};
	font-family:	${font.h1.font-family}; 
	font-weight: normal;
}

#footer_wrapper a {
	text-decoration: none;
}

#footer_wrapper a:hover {
	text-decoration: underline;
}