/* ========================================================================

Stylesheet für das Template "cm_dh_065"
Datei: main.css
Datum: 27.01.2012

    --- Aufbau ---

	1 - Allgemeine Stylesheets
		html, body, a, ul, li, p, h1, h2, h3, hr, textarea, tt, pre, code
	
	2 - Positionierung der Layoutbereiche
		2.1 - Webseitencontainer
		2.2 - Header
		2.3 - Container Spacer
		2.4 - Navigation
		2.5 - Keyvisual
		2.6 - Content
		2.7 - Sidebar
		2.8 - Footer
	
	3 - Formatierung der Layoutbereiche
		3.1 - Navigation
		3.2 - Subnavigation
		3.3 - SubSubNavigation
		3.4 - Spacer
		3.5 - Sidebar
		
=========================================================================== */




/* ========================================================
	1 - Allgemeine Stylesheets
=========================================================== */

html, body {
	margin:		0px;
	padding:	0px;
	width:		100%;
}
#content_wrapper h1, #content_wrapper h2, #content_wrapper h3, #content_wrapper h4, #content_wrapper h5, #content_wrapper h6 {
	margin:			0 0 0.7em 0;
}
#content_wrapper p, #content_wrapper code, #content_wrapper pre, #content_wrapper kbd {
	margin:			0 0 1em 0;
}
#content_wrapper li ul, #content_wrapper li ol {
	margin:			0 1em;
}
#content_wrapper ul, #content_wrapper ol {
	margin:			0 1em 1em 1em;
}
#content_wrapper dl {
	margin:			0 0 1em 0;
}
#content_wrapper dd {
	margin-left:	1em;
}
a {
	outline:	none;
}

/* =================================================
	2 - Positionierung der Layoutbereiche
==================================================== */

/* ----- 2.1 Webseitencontainer ------ */
#page_wrapper {			
	width:				100%;
	padding:			0px;
	margin:				0 auto;
	overflow: hidden;
}
/* -----  Ende Webseitencontainer ----- */

#social_wrapper {
	position:			relative;
	height:				30px;
	border-bottom:		solid 1px #FFF;
	-webkit-box-shadow:		0px 0px 3px #666;
	-moz-box-shadow:		0px 0px 3px #666;
	box-shadow:				0px 0px 3px #666;
}


/* ----- 2.2 Header ----- */
#head_wrapper {
	width:			100%;
	z-index:		10;
}

#header {
	width:			1150px;
	margin:			0 auto;
	position:		relative;
}

#logo {
	height:			110px;
	width:			200px;
	border:			none;
	display:		inline-block;
	vertical-align:	top;
}

#logo.cm_empty {
	display: none;
}

#keyvisual, .cm-slides-addon {
	width:			100%;
	height:			320px;
	margin:			0 auto;
	position:		relative;

	background-repeat:		no-repeat;
}

.cm-template-keyvisual__media, 
.cm-slides-addon {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

#keyvisual.cm-templates-kv-deprecated-px,
#keyvisual.cm-templates-kv-deprecated-px .cm-slides-addon {
  background-position: center;
  background-size: cover;
}

#title_wrapper {
	width:				100%;
	margin:				0 auto;
	
	-webkit-box-shadow:	0px 7px 5px -5px rgba(0,0,0,0.7) inset, 0px -7px 5px -5px rgba(0,0,0,0.7) inset;
	-moz-box-shadow:	0px 7px 5px -5px rgba(0,0,0,0.7) inset, 0px -7px 5px -5px rgba(0,0,0,0.7) inset;
	box-shadow:			0px 7px 5px -5px rgba(0,0,0,0.7) inset, 0px -7px 5px -5px rgba(0,0,0,0.7) inset;
	
	background-image:		url('../img/shadow.png');
	background-position:	top center;
	background-repeat:		no-repeat;
}

#title_wrapper h1 {
	padding:		15px 0px 0px 0px;
	margin:			0 auto;
	text-align:		center;
}
#title_wrapper h2 {
	padding:		0px 0px 15px 0px;
	margin:			0 auto;
	text-align:		center;
}
	
/* ----- Ende Header ------ */


/* ----- 2.3 Container Spacer ----- */
.spacer_top, .spacer_bottom {
	width:				100%;
	height:				30px;
	border:				none;
	margin:				0px;
	padding:			0px;
}
/* ----- Ende Container Spacer ----- */

/* ----- 2.4 Navigation ----- */
#cm_navigation {
	display:			inline-block;
	width:				950px;
	vertical-align:		top;
	height:				110px;
	z-index:		10;
}

/* ---- Ende Navigation ----- */



/* ----- Ende Keyvisual ----- */

/* ----- 2.6 Content ----- */
#content_wrapper {
	width:				1150px;
	margin:				0 auto;
	padding:			30px 0px 30px 0px;
}

.content_main_dho {
    display:			inline-block;
	width:				890px;
	vertical-align:		top;
}

/* ----- Ende Content ----- */

/* ----- 2.7 Sidebar ----- */

.sidebar_wrapper {
	display:			inline-block;
    padding: 			0px 0px 30px 40px;
	vertical-align:		top;
}
	
.content_sidebar {
	padding:			20px;
	
	-webkit-box-shadow:	0px 2px 4px #CCC;
	-moz-box-shadow:	0px 2px 4px #CCC;
	box-shadow:			0px 2px 4px #CCC;
	
}


/* ----- Ende Sidebar ----- */

/* ----- 2.8 Footer ----- */
#footer_wrapper {
	width:				100%;
	text-align:			center;
	font-weight:		normal;
	background-image:	url('../img/shadow.png');
	background-position:	top center;
	background-repeat:	no-repeat;
}

#footer {
    padding: 			30px 0px;
}

#footer a {
	text-transform:		uppercase;
	text-decoration:	none;
	font-weight:		normal;
	padding:			0px 10px 0px 10px;
	letter-spacing:		2px;
}
#footer a:hover {
	text-decoration:	underline
}


/* =================================================
	3 - Formatierung der Layoutbereiche
==================================================== */

.mobile_navigation {
	display:	none;
}

/* ----- 3.1 Navigation ----- */
#cm_navigation > ul {
	list-style-type:	none;
	padding:			0px;
	text-align:			right;
	z-index:			1010;
	position:			relative;
	margin-top: 		0px;
}

#cm_navigation > ul > li {
	padding:		0px;
	margin:			0px 0px 0px 5px;
	display:		inline-block;
	vertical-align:	text-top;
	white-space:		nowrap;
}

#cm_navigation > ul > li > a {
	display:				table-cell;
	text-decoration:		none;	
	height:					107px;
	text-transform:			uppercase;
	letter-spacing:			-0.04em;
	padding:				0px 15px;
	vertical-align:			middle;
	
	-moz-transition:		color 0.4s, background-color 0.4s, border 0.4s, box-shadow 0.4s; /* Firefox 4 */
	-webkit-transition:		color 0.4s, background-color 0.4s, border 0.4s, box-shadow 0.4s; /* Safari and Chrome */
	transition:				color 0.4s, background-color 0.4s, border 0.4s, box-shadow 0.4s;
}


/* ----- Ende Navigation ----- */

/* ----- 3.2 SubNavigation ----- */

#cm_navigation > ul > li > ul {
	opacity:			0;
	visibility:			hidden;	
	
	position:			absolute;
	list-style-type:	none;
	padding:			0px;
	margin:				0px;
	margin-top:			60px;
	text-align:			left;
	-moz-transition:	margin-top 0.4s, opacity 0.7s, visibility 0.3s;
	-webkit-transition:	margin-top 0.4s, opacity 0.7s, visibility 0.3s;
	transition:			margin-top 0.4s, opacity 0.7s, visibility 0.3s;
}

#cm_navigation > ul > li > ul > li {
	margin:			0px;
	padding:		0px;
	overflow:		hidden;
}

#cm_navigation > ul > li > ul > li > a {
	display:				block;
	text-decoration:		none;	
	min-width:				170px;
	padding:				10px 5px;
	text-transform:			uppercase;  
	
	-moz-transition:		color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s; /* Firefox 4 */
	-webkit-transition:		color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s; /* Safari and Chrome */
	transition:				color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s;
}


#cm_navigation > ul > li:hover > ul {
	margin-top:	-12px;
	visibility:	visible;
	opacity:	1;
}

/* ----- Ende SubSubNavigation ----- */


#cm_navigation > ul > li > ul.cm_subnavigation > li > ul {
	opacity:			0;
	visibility:			hidden;	
	
	position:			absolute;
	list-style-type:	none;
	padding:			0px;
	margin:				0px;
	margin-top:			-37px;
	margin-left:		240px;
	text-align:			left;
	-moz-transition:	margin 0.4s, opacity 0.7s, visibility 0.3s;
	-webkit-transition:	margin 0.4s, opacity 0.7s, visibility 0.3s;
	transition:			margin 0.4s, opacity 0.7s, visibility 0.3s;
}

#cm_navigation > ul > li > ul.cm_subnavigation > li > ul > li {
	margin:			0px;
	padding:		0px;
}

#cm_navigation > ul > li > ul.cm_subnavigation > li > ul > li > a {
	display:				block;
	text-decoration:		none;	
	min-width:				170px;
	padding:				10px 5px;
	text-transform:			uppercase;  
	
	-moz-transition:		color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s; /* Firefox 4 */
	-webkit-transition:		color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s; /* Safari and Chrome */
	transition:				color 0.4s, background-color 0.4s, border 0.4s, opacity 0.4s;
}

#cm_navigation > ul > li > ul.cm_subnavigation > li:hover > ul {
	margin-left:	180px;
	opacity:		1;
	visibility:		visible;
}



#cm_navigation li.cm_has_subnavigation > a:after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-image: none;
    border-left: 0.313em solid transparent;
    border-right: 0.313em solid transparent;
    border-style: solid solid none;
    border-width: 0.313em 0.313em medium;
    content: "";
    display: inline-block;
    height: 0;
    position: relative;
    right: -0.313em;
    vertical-align: middle;
    width: 0;
}





/* -----3.5 Sidebar ----- */
#widgetbar_page_1, #widgetbar_page_2, #widgetbar_page_3,
#widgetbar_site_1, #widgetbar_site_2, #widgetbar_site_3 {
	overflow			: hidden;
	width				: 180px;
}

#widgetbar_page_1 div.cm_widget, #widgetbar_page_2 div.cm_widget, #widgetbar_page_3 div.cm_widget, 
#widgetbar_site_1 div.cm_widget, #widgetbar_site_2 div.cm_widget, #widgetbar_site_3 div.cm_widget {
	margin: 			5px 0;
}
/* ----- Ende Sidebar ----- */

 .cm_widget select option {
		color: #333333 !important;
 }


/* the clearfix : ------------------ */
.clearfix {
	display			: inline-block;
}
.clearfix[class] {
	display			: block;
	overflow		: hidden;
}

select option {
	color: #333;
}

.clearly {
	clear:	both;
}

