@charset "utf-8";
body {
	font-family		: ${font.standard.font-family};
	font-size		: ${font.standard.font-size};
	font-weight		: ${font.standard.font-weight};
	font-style		: ${font.standard.font-style};
	background-color: ${color.body.background-color};
}

h1,h3, .cm-h1 {
	color			: ${color.content.headline.color};
}
h2 {
	color			: ${color.content.color};
	font-family		: ${font.h2.font-family};
	font-size		: ${font.h2.font-size};
	font-style		: ${font.h2.font-style};
	font-weight		: ${font.h3.font-weight};
}

h3 {
	font-family		: ${font.h3.font-family};
	font-size		: ${font.h3.font-size};
	font-weight		: ${font.h3.font-weight};
	font-style		: ${font.h3.font-style};
}

h1, .cm-h1 {
	font-family		: ${font.h1.font-family};
	font-size		: ${font.h1.font-size};
	font-weight		: ${font.h1.font-weight};
	font-style		: ${font.h1.font-style};
}


h4, h5, h6 {
	font-family		: ${font.h1.font-family};
}

a {
	color			: ${color.content.link.color};
}

a:hover {
	color			: ${color.content.link.hover.color};
}


/* ################################################## */
/* ################ INPUT ELEMENTS ################## */
/* ################################################## */
#page .cm_widget input[type='text'], #page .cm_widget input[type='date'], #page .cm_widget input[type='datetime'], 
#page .cm_widget input[type='email'], #page .cm_widget input[type='number'], #page .cm_widget input[type='password'],
#page .cm_widget input[type='search'], #page .cm_widget input[type='tel'], #page .cm_widget input[type='time'],
#page .cm_widget input[type='url'], #page .cm_widget textarea, #page .cm_widget select,
#page .cm_widget button, #page .cm_widget input[type='button'], #page .cm_widget input[type='submit'], #page .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 .cm_widget button, #page .cm_widget input[type='button'], #page .cm_widget input[type='submit'], #page .cm_widget input[type='reset'] {
	cursor:			pointer;
}
#page .cm_widget input[type='text']:focus, #page .cm_widget input[type='date']:focus, #page .cm_widget input[type='datetime']:focus, 
#page .cm_widget input[type='email']:focus, #page .cm_widget input[type='number']:focus, #page .cm_widget input[type='password']:focus,
#page .cm_widget input[type='search']:focus, #page .cm_widget input[type='tel']:focus, #page .cm_widget input[type='time']:focus,
#page .cm_widget input[type='url']:focus, #page .cm_widget textarea:focus, #page .cm_widget select:focus, #page .cm_widget select:focus option,
#page .cm_widget button:hover, #page .cm_widget input[type='button']:hover, #page .cm_widget input[type='submit']:hover, #page .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;
}




/*         ______
__________/ Page \__________________________________________________________________
--------------------------------------------------------------------------------------- */

#page {
	border-left-color : ${color.content.border-color};
	border-right-color : ${color.content.border-color};
}

/*         ________
__________/ header \__________________________________________________________________
--------------------------------------------------------------------------------------- */

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

#keyvisual {
	background-color	: ${color.header.alt.background-color};
}

#title h1 {
	font-family			: ${font.title.font-family};
	font-weight			: ${font.title.font-weight};
	font-style			: ${font.title.font-style};
	font-size			: ${font.title.font-size};
	color				: ${color.header.title.color};
}

#title h2 {
	font-family			: ${font.h2.font-family};
	font-size			: ${font.h2.font-size};
	font-style			: ${font.h2.font-style};
	font-weight			: ${font.h2.font-weight};
	color				: ${color.header.subtitle.color};
}

#separator {
	border-top-color	: ${color.content.border-color};
	border-bottom-color	: ${color.content.border-color};
	background-color	: ${color.footer.background-color};
}


/*         ____________
__________/ navigation \__________________________________________________________________
--------------------------------------------------------------------------------------- */

#cm_navigation {
	border-top-color	: ${color.navigation.border-color};
	border-bottom-color	: ${color.navigation.border-color};
	background-color	: ${color.navigation.background-color};
}

#cm_navigation ul li {
	border-right-color	: ${color.navigation.border-color};
}

#cm_navigation ul li a {
	background-color	: ${color.navigation.background-color};
	color				: ${color.navigation.color};
	font-family			: ${font.navigation.font-family};
	font-style			: ${font.navigation.font-style};
	font-size			: ${font.navigation.font-size};
	font-weight			: ${font.navigation.font-weight};
}

#cm_navigation ul li a:hover {
	background-color	: ${color.navigation.alt.background-color};
	color				: ${color.navigation.alt.color};
}

#cm_navigation ul li.cm_current {
	background-color	: ${color.navigation.alt.background-color};
}

#cm_navigation ul li.cm_current a {
	background-color	: ${color.navigation.alt.background-color};
	color				: ${color.navigation.alt.color};
}

/*         _______________
__________/ 2nd level nav \____________________________________________________________
--------------------------------------------------------------------------------------- */

ul.cm_subnavigation li {
	border-bottom-color	: ${color.subnavigation.border-color};
}

ul.cm_subnavigation li a {
	color				: ${color.subnavigation.color};
	font-family			: ${font.navigation.font-family};
	font-style			: ${font.navigation.font-style};
	font-size			: ${font.navigation.font-size};
	font-weight			: ${font.navigation.font-weight};
}

ul.cm_subnavigation li a:hover {
	color				: ${color.subnavigation.alt.color};
}

ul.cm_subnavigation li.cm_current a {
	color				: ${color.subnavigation.alt.color};
}

/*         _______________
__________/ 3rd level nav \____________________________________________________________
--------------------------------------------------------------------------------------- */

ul.cm_subnavigation li ul.cm_subnavigation li {
	border-bottom-color	: ${color.subnavigation.border-color};
}

ul.cm_subnavigation li ul.cm_subnavigation li a {
	color				: ${color.subnavigation.color};
}

ul.cm_subnavigation li ul.cm_subnavigation li a:hover {
	color				: ${color.subnavigation.alt.color};
}

ul.cm_subnavigation li ul.cm_subnavigation li.cm_current a {
	color				: ${color.subnavigation.alt.color};
}

/*         _________
__________/ content \__________________________________________________________________
--------------------------------------------------------------------------------------- */

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

#maincontent_wrapper {
	border-left-color   : ${color.content.border-color};
}

#sidebar_wrapper {
	border-right-color   : ${color.content.border-color};
	color				: ${color.content.color};
}

.content_main {
	background-color	: ${color.content.background-color};
	color				: ${color.content.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 h1,
.content_main h2,
.content_main h3 {
	color			    : ${color.content.headline.color};
}

.content_main a {
	color				: ${color.content.link.color};
}
.content_main a:hover {
	color				: ${color.content.link.hover.color};
}

/*         ________
__________/ footer \__________________________________________________________________
--------------------------------------------------------------------------------------- */

#footer {
	color				  : ${color.footer.color};
	border-top-color   	  : ${color.content.border-color};
	border-bottom-color   : ${color.content.border-color};
	background-color	  : ${color.footer.background-color};
}

#footer a,
#footer a:hover {
	color				  : ${color.footer.color};
}
