@charset "UTF-8";
/**
 * MAN Framework Styles - Nav Flyout
 *
 * @project       MAN Web 2012/2013
 * @package       html-css-js
 * @subpackage    css
 * @author        Timo Mayer, VI
 *
 * @note all styles should be concatenated and minified to one file (eg. man.all.min.css) in production use
 */

/**
 * @section  flyout
 */

#nav-flyout-wrapper {
	top: -1px;
	position: relative;
	margin: 0 0 -1px;
	min-height: 1px;
	overflow: visible;
}

.ie-shadow-wrapper {
	position: absolute;
	display: block;
	bottom: -9px;
	left: 0;
	width: 100%;
	height: 19px;
	z-index: 6;
	overflow: hidden;
}

#nav-flyout-wrapper:before,
#nav-flyout-wrapper > .ie-shadow-wrapper .ie-before {
	content: "";
	position: absolute;
	display: block;
	bottom: 0px;
	left: 0;
	width: 100%;
	height: 10px;
	-webkit-box-shadow: 0px 1px 9px 0 #333333;
	box-shadow: 0px 1px 9px 0 #333333;
	z-index: 6;
}

 #nav-flyout-wrapper .ie-shadow-wrapper .ie-before {
	bottom: 9px;
}

#nav-flyout {
	position: relative;
	background: #fff; /* over main-nav shadow */
	overflow: hidden;
	padding: 0 0 21px; /* +1px because of #nav-flyout-wrapper top:-1px  */
	z-index: 21; /* overlap main-nav */
}

/* we have to overwrite the negative margin grid solution here because of a iOS bug */

#nav-flyout > .anythingSlider {
	margin: 0 auto;
	width: 940px !important;
}

#nav-slider,
#nav-slider .row {
	margin-left: 0 !important;
}

#nav-slider > .grid_12:first-child,
#nav-slider > .grid_12 > .row > div:first-child {
	margin-left: 0 !important;
}

#nav-flyout.vhidden {
	visibility: hidden;
	height: 1px;
	padding: 0;
}

#nav-flyout.active {
	display: block;
	height: auto;
}

#nav-flyout .close-arrow {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 20px;
	background: #737b84;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzczN2I4NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzNmNGE1NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ1JSIgc3RvcC1jb2xvcj0iIzMwM2M0OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyOTMzM2UiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top, #737b84 0%, #3f4a56 44%, #303c49 45%, #29333e 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#737b84), color-stop(44%,#3f4a56), color-stop(45%,#303c49), color-stop(100%,#29333e));
	background: -webkit-linear-gradient(top, #737b84 0%,#3f4a56 44%,#303c49 45%,#29333e 100%);
	background: -o-linear-gradient(top, #737b84 0%,#3f4a56 44%,#303c49 45%,#29333e 100%);
	background: -ms-linear-gradient(top, #737b84 0%,#3f4a56 44%,#303c49 45%,#29333e 100%);
	background: linear-gradient(to bottom, #737b84 0%,#3f4a56 44%,#303c49 45%,#29333e 100%);
	cursor: pointer;
}

.lt-ie9 #nav-flyout .close-arrow {
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#737b84', endColorstr='#29333e',GradientType=0 );
}

#nav-flyout .close-arrow:before ,
.lt-ie8 #nav-flyout .close-arrow div.ie-before {
	content: "";
	display: block;
	width: 13px;
	height: 12px;
	margin: 4px auto 0;
	background: url(http://www.man.eu/media/resources/img/sprites/general.png) no-repeat top left;
	background-position: 0 -66px;
}

.lt-ie8 #nav-flyout .close-arrow div.ie-before {
	left: 50%;
	top: 3px;
}

#nav-flyout .close {
	top: 20px;
	right: -17px;
}

#nav-slider {
	padding: 0;
	margin: 0;
}

#nav-slider > li {
	margin: 0;
}

/* nav flyout content */

#nav-slider section {
	padding: 0 0 16px;
}

#nav-slider section h2 {
	font-size: 18px;
	margin: 24px 0 0;
	padding: 0 0 5px;
}

#nav-slider .nav-teaser + .nav-teaser {
	margin-top: 6px;
	border-top: 1px solid #eaebec;
}

.nav-teaser img {
	width: 220px;
	height: 165px;
	margin-top: 10px;
}

.nav-teaser .overline span {
	line-height: 16px;
}

.nav-teaser h1 {
	font-family: Arial;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	padding: 0;
	margin: 0;
}

.nav-teaser h1:first-child, .nav-teaser p:first-child {
	margin: 7px 0 0;
}

.nav-teaser p {
	margin: 0;
}

.nav-teaser p + p, .nav-teaser h1 + p.more {
	margin: 13px 0 0;
}

.nav-teaser p > a {
	display: block;
	margin: -5px 0 0
}

.nav-teaser .blank {
	width: 100% !important;
	overflow: hidden !important;
	max-height: 600px;
}

/* double teaser */
#nav-slider section .double-teaser h2 {
	margin: 0 0 -1px 20px;
	padding: 0;
}

.double-teaser {
	background: #ededed;
	margin-top: 20px;
	padding: 4px 10px 16px;
}

.double-teaser .items {
	margin-left: -20px;
}

.double-teaser .nav-teaser {
	display: inline-block;
	vertical-align: top;
	width: 205px;
	margin-left: 20px;
}

#nav-slider .double-teaser .nav-teaser {
	margin-top: 6px;
}

#nav-slider .double-teaser .nav-teaser + .nav-teaser {
	border-top: none;
}

.double-teaser img {
	float: left;
	width: 80px;
	height: 60px;
	margin-right: 10px;
}

.double-teaser .nav-teaser div {
	overflow: auto;
}

.double-teaser .overline span + span {
	display: block;
}

.double-teaser .overline span + span:before {
	content: '';
}

.media-teaser,
.double-teaser {
	margin-bottom: 4px;
}

/* latest fotos and latest videos */

#nav-slider section .media-teaser h2 {
	margin: 0 0 0 10px;
}

.media-teaser {
	margin-top: 20px;
	padding: 4px 0 20px 20px;
	background: #ededed;
}

.media-teaser .items {
	margin-left: -10px;
}

.media-teaser .items + .items {
	margin-top: 14px;
}

.media-teaser p {
	margin: 17px 0 -4px 0
}

/* set icons for videos and pictures */
#nav-slider .media-teaser a.trigger-layer-video img,
#nav-slider .media-teaser a.trigger-layer-image img{
	z-index: -1;
}

#nav-slider .media-teaser a.trigger-layer-video,
#nav-slider .media-teaser a.trigger-layer-image {
	position: relative;
	display: block;
	float: left;
	width: 53px;
	height: 40px;
	margin: 10px 0 0 10px;
}

#nav-slider .media-teaser a.trigger-layer-video:before,
#nav-slider .media-teaser a.trigger-layer-image:before,
#nav-slider .media-teaser a.trigger-layer-video .ie-before,
#nav-slider .media-teaser a.trigger-layer-image .ie-before {
	margin: 0;
	content: "";
	position: absolute;
	display: block;
	right: 0px;
	bottom: 0px;
	height: 15px;
	width: 15px;
	background-color: #fff;
}

#nav-slider .media-teaser a.trigger-layer-video:before,
#nav-slider .media-teaser a.trigger-layer-video .ie-before {
	background: #fff url(http://www.man.eu/media/resources/img/sprites/general.png) no-repeat top left;
	background-position: 5px -801px;
}

#nav-slider .media-teaser a.trigger-layer-image:before,
#nav-slider .media-teaser a.trigger-layer-image .ie-before {
	background: #fff url(http://www.man.eu/media/resources/img/sprites/general.png) no-repeat top left;
	background-position: 3px -942px;
}

.lt-ie9 #nav-slider .media-teaser * {
	zoom: 1;
	z-index: 100;
	position: relative;
}

/* flyout navigation */

.nav-wrapper > div {
	border-left: 1px solid #ccc;
	padding-left: 10px;
	margin-top: 30px;
	height: 100%;
}

nav.flyout-nav {
	margin: -1px 0 0;
}

nav.flyout-nav li {
	position: relative;
	font-family: 'HelveticaNeueLt57Cd', Arial;
	font-size: 16px;
	line-height: 20px;
	margin: 6px 0 0;
	word-wrap: break-word;
}

#nav-slider section .nav-wrapper h2 {
	margin-top: -6px;
}

#nav-slider section .nav-wrapper a {
	font-weight: normal;
}

/* flyout job offer */
#nav-slider .button-wrapper {
	border-top: 1px solid #eaebec;
	margin-top: 6px;
	padding: 10px 0 0;
}