/*********************************************
Reset
*********************************************/
html{color:#000;background:#fff;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}

/*********************************************
Fonts
*********************************************/
body{font:13px/1.231 arial,helvetica,clean,sans-serif;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font-size:100%;}pre,code,kbd,samp,tt{font-family:monospace;line-height:100%;}

/*********************************************
Base
*********************************************/
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
sup { vertical-align: super; }
sub { vertical-align: sub; }
p, table, pre { margin-bottom: 1em; }
th, td { padding: .5em; }
th{ font-weight: bold; }
.cl:after { clear: both; content: "."; display: block; height: 0; overflow: hidden; visibility: hidden}
a { color: #7dc0ff; outline: none; text-decoration: none; }
a:hover { text-decoration: underline; }
a.strike:hover,.strike a:hover { text-decoration: line-through; }
img { vertical-align: bottom; }
.br { padding-top: 20px; }
#atffc { display: none !important; } /* hide 'add this' flash */
.fir { clear: left; }

/**********************************************
Frame
*********************************************/

html, body { background: #191919; height: 100%; width: 100%; }
#wrap { background: #454545 url(/img/frame/body.png) 0 0 repeat-x; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; padding-bottom: 75px; }
#head { height: 98px; position: relative; }

#foot {
	background: #191919 url(/img/frame/footer.png) 0 0 repeat-x;
	clear: both;
	color: #605f5f;
	font-size: 93%;
	text-shadow: 0 1px 1px #000;
}

#foot .inner { padding: 25px 0; }
#foot a { color: #bfbfbf; display: block; float: left; margin: 0 15px 0 0; }
#foot a:hover { color: #58a6f0; text-decoration: none; }
#foot h4 { color: #58a6f0; padding-bottom: 20px; }

#foot ul {
	background: url(/img/frame/footer-sep.png) 0 0 repeat-y;
	display: block;
	float: left;
	padding: 0 40px;
}

#foot ul.first { background: none; padding-left: 0; }
#foot ul.last { padding-right: 0; }
#foot li { line-height: 1.5em; }

.inner {
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	margin: 0 auto;
	width: 960px;
}

/**********************************************
Bookmarks und Städte Pulldown
*********************************************/

#bookmarks a {
	cursor: pointer;
	display: block;
	line-height: 16px;
	margin: 0 11px 15px 0;
}

#bookmarks a.last { margin-right: 0; }

#bookmarks,
#cities,
#tg-arten {
	background: url(/img/frame/pulldown.png) bottom center no-repeat;
	display: none;
	left: 0;
	line-height: normal;
	padding: 10px 30px 25px;
	position: absolute;
	text-shadow: 0 1px 1px #000;
	top: 98px;
	width: 900px;
	z-index: 1;
}

#bookmarks ul,
#cities ul,
#tg-arten ul {
	background: url(/img/frame/pulldown-sep.png) right repeat-y;
	color: #fff;
	float: left;
	font-weight: 200;
	line-height: 1.5em;
	padding: 0 18px;
}

#bookmarks ul.first,
#cities ul.first,
#tg-arten ul.first { padding-left: 0; }
#bookmarks ul.last,
#cities ul.last,
#tg-arten ul.last { background: none; padding-right: 0; }

#cities .name,
#tg-arten .name {
	color: #fff;
	height: 20px;
	line-height: 20px;
	margin-bottom: 10px;
}

#bookmarks a,
#cities a,
#tg-arten a { color: #666; }

#bookmarks a:hover,
#cities a:hover,
#tg-arten a:hover { color: #7dc0ff; text-decoration: none; }

#bookmarks a,
#cities a
#tg-arten a { display: block; }

/**********************************************
Breadcrumb
*********************************************/
#breadcrumb { margin: 50px 0 0; }
#breadcrumb a,
#breadcrumb a.active span {
	background: url(/img/frame/breadcrumb.png) 0 -33px no-repeat;
	color: #393939;
	float: left;
	font-weight: 700;
	height: 33px;
	line-height: 30px;
	padding: 0 10px 0 30px;
	text-decoration: none;
	text-shadow: 0 1px 0 #ddd;
}
#breadcrumb a.active span { background-position: 0 -66px; }
#breadcrumb a.first { background-position: 0 0; padding-left: 15px; }
#breadcrumb a.active { background-position: right -66px; padding: 0 17px 0 0; }
#breadcrumb a.active span { color: #fff; text-shadow: 0 1px 1px #00396f; }
#breadcrumb a:hover { text-decoration: underline; }
#breadcrumb a.active:hover { text-decoration: none; }
.breadcrumb-first-active .active { background-position: left -99px !important; padding-left: 7px !important; }
.breadcrumb-first-active .active span { background-position: right -66px !important; padding: 0 27px 0 9px !important; }

/**********************************************
Nav
*********************************************/

.nav {
	color: #fff;
	display: block;
	float: left;
	font-size: 116%;
	font-weight: 500;
	line-height: 98px;
	margin-right: 50px;
	text-shadow: 0 1px 1px #000;
}

.nav:hover,
.nav-active { color: #7dc0ff; text-decoration: none; }
.nav-pulldown {	background: url(/img/frame/nav-arrow.png) top right no-repeat; padding-right: 28px; }
.nav-pulldown:hover { background-position: bottom right; }

/**********************************************
Home
*********************************************/

.home-cover,
.thumb-cover {
	background: url(/img/frame/home-cover.png);
	display: block;
	float: left;
	height: 220px;
	margin-left: 35px;
	padding: 3px 4px 5px;
	position: relative;
	text-align: center;
	width: 255px;
}

.home-cover { margin-right: 52px; }

.thumb-cover {
	background: url(/img/frame/thumb-cover.png);
	height: 155px;
	margin-left: 0;
	width: 180px;
}

.home-cover .badge {
	background: url(/img/frame/home-cover-badge.png);
	display: block;
	height: 72px;
	left: 2px;
	overflow: hidden;
	position: absolute;
	text-indent: -9999em;
	top: 2px;
	width: 72px;
}

.block-home .bright-text {
	float: left;
	padding: 0;
	width: 550px;
}

/* upcoming issues */

.upcoming .bright-text { font-size: 108%; width: 350px; }
.upcoming .home-cover { margin-right: 30px; }

.upcoming .trendguide-list {
	margin-right: 35px;
	padding-top: 0;	
	width: 220px;
}

.upcoming .trendguide-list .wrapper { height: 200px; }
.upcoming .trendguide-list h3 {
	color: #f1e745;
	font-size: 108%;
	font-weight: 200;
	padding-top: 0;
}

/**********************************************
Generic lists and text
*********************************************/

.block-generic p,
.block-generic ul {
	color: #eee;
	float: left;
	font-weight: 200;
	font-size: 116%;
	line-height: 1.5em;
	padding-left: 25px;
	text-shadow: 0 1px 1px #333;
	width: 45%;
}

.block-generic p {
	float: none;
	padding: 0 25px;
	width: auto;
}

.block-generic strong {
	color: #fff;
	font-weight: 500;
	text-shadow: 0 1px 1px #333;
}

.block-generic a:hover {
	color: #fff;
	text-decoration: none;
}

.bright-text {
	color: #eee;
	display: block;
	font-weight: 200;
	font-size: 116%;
	line-height: 1.5em;
	padding: 0 25px;
	text-shadow: 0 1px 1px #333;
}

.bright-text strong {
	color: #333;
	font-weight: normal;
	text-shadow: 0 1px 0 #9f9f9f;
}

h4.bubble {
	-moz-border-radius: 5px;
	-moz-box-shadow: 0 1px 2px #333;
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px #333;
	background-color: #7DC0FF;
	background-image: -moz-linear-gradient(center top , #7DC0FF, #4B88C2);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7DC0FF), to(#4B88C2));
	border-top: 1px solid #A7D0F7;
	clear: left;
	color: #fff;
	display: block;
	float: left;
	font-weight: 700;
	margin: 6px 15px 0 25px;
	padding: 4px 9px 5px;
	text-shadow: 0 1px 1px #1e4870;
}

ul.features {
	float: right;
	font-size: 100%;
	font-weight: 400;
	line-height: 22px;
	margin-bottom: 50px;
	padding-left: 40px;
	width: 350px;
}

ul.features li {
	background: url(/img/icon/tick.png) center left no-repeat;
	display: block;
	margin-bottom: 10px;
	padding-left: 27px;
}

/**********************************************
Thumblist
*********************************************/

.thumb-list {
	float: left;
	height: 220px;
	margin-right: 20px;
	overflow: hidden;
	padding-bottom: 15px;
	padding-top: 30px;
	position: relative;
	width: 835px;
}

.thumb-wrap {
	width: 300%;
}

.thumb-list li {
	display: block;
	float: left;
	margin-right: 28px;
	position: relative;
	width: 188px;
}

.thumb-list a.thumb-cover { font-weight: 200; text-decoration: none; text-shadow: 0 1px 1px #222; }

.thumb-list .trendguide-info {
	left: 0;
	padding-top: 175px;
	position: absolute;
	text-align: center;
	top: 0;
	width: 188px;
}

.thumb-list .trendguide-info .city { color: #fff; }
.thumb-list .trendguide-info .issue { color: #999; display: block; font-style: normal; }
.thumb-list a:hover, .thumb-list a:hover .city, .thumb-list a:hover .issue { color: #fff; }

.next a, .previous a {
	background: url(/img/frame/arrow.png) 0 0;
	display: block;
	float: left;
	height: 41px;
	margin: 90px 20px 0 0;
	overflow: hidden;
	text-indent: -9999em;
	width: 41px;
}

.next a { background-position: -41px 0; margin-right: 0; }
.next a:hover { background-position: -41px -41px; }
.next a:active { background-position: -41px -82px; }
.previous a:hover { background-position: 0 -41px; }
.previous a:active { background-position: 0 -82px; }
.next_inactive a { background-position: -41px -123px !important; cursor: default; }
.previous_inactive a { background-position: 0 -123px !important; cursor: default; }

/**********************************************
Stadt(Teil)liste
*********************************************/
.city-list {
	padding: 27px 0 0;
}
.city-list .city {
	background: #fff;
	box-shadow: #333 0 1px 2px;
	float: left;
/* 	height: 90px; */
	margin: 0 1% 2%;
	-moz-box-shadow: 0 1px 2px #333;
	-webkit-box-shadow: 0 1px 2px #333;
	overflow: hidden;
	width: 48%;
}

.city-list .photo { float: left; margin-right: 10px; }
.city-list .name {
	color: #333;
	float: left;
	font-size: 111%;
	font-weight: 700;
	margin: 10px 0;
	width: 320px;
}
.city-list .topics {
	color: #333;
	float: left;
	margin-bottom: 10px;
	width: 320px;
}
.city-list .topics li { float: left; }
.city-list .topics a {
	background: #ddd;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	color: #333;
	float: left;
	font-size: 83%;
	letter-spacing: .02em;
	margin: 0 8px 4px 0;
	padding: 1px 4px;
}
.city-list .topics a:hover { background: #2b8cd3; color: #fff; text-decoration: none; }
.city-list .quantity { color: #999; float: right; font-size: 83%; margin: 0 0 8px; width: 330px; }

/**********************************************
Section Blocks
*********************************************/

.block { padding: 50px 0; }
.block-bright { background: url(/img/frame/block-gradient.png) 0 0 repeat-x; }
.block-home { padding: 35px 0; }
.block-detail { padding: 25px; }
.block-border {	background: url(/img/frame/block-line.png) 0 0 repeat-x; }
.block-cities { padding: 40px 0 15px; }
.block-white {
	background: #fff;
	box-shadow: #333 0 1px 2px;
	-moz-box-shadow: 0 1px 2px #333;
	padding: 30px;
	-webkit-box-shadow: 0 1px 2px #333;
}
.block-detail-title { padding: 30px 0; }
/**********************************************
Detailseite
*********************************************/
.partner-nav {
	margin-left: 7px;
}

.partner-nav li {
	float: left;
	margin-right: 7px;
}

.partner-nav a {
	background: #bbb;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	border-bottom: 1px solid #aaa;
	color: #888;
	float: left;
	font-size: 90%;
	font-weight: 700;
	height: 20px;
	line-height: 20px;
	padding: 3px 14px 0px;
}

.partner-nav a:hover { color: #333; text-decoration: none; }
.partner-nav .active a,
.partner-nav .active a:hover { background: #fff; border-bottom-color: #fff; color: #2b8cd3; cursor: default; text-decoration: none; }
.partner-issues .issue { color: #333; float: left; font-size: 85%; margin: 0 18px 20px; text-align: center; width: 188px; }
.partner-issues .cover {
	background: url(/img/frame/thumb-cover.png);
	display: block;
	float: left;
 	height: 155px;
	line-height: 155px;
	padding: 3px 4px 5px;
	vertical-align: middle;
	width: 180px;
}
.partner-issues .name { display: block; font-weight: 700; }
.partner-issues .number { display: block; }

.tg-info { border-right: 1px dotted #ccc; float: left; margin: 0 2.5% 0 0; padding: 0 2.5% 0 0; width: 45%; }
.block-white h2 {
	color: #000;
	font-weight: 700;
	margin-bottom: 15px;
	text-shadow: none;
}
.tg-contact { float: left; width: 49%; }
.tg-contact a { color: #2B8CD3; }
.tg-flash { float: left; width: 625px; }
.tg-options { float: left; padding-top: 30px; width: 275px; }
.media-download,
.tg-options .i-magazine,
.tg-options .pdf-download,
.tg-options .view-all {
	background: url(/img/frame/download-pdf.png) 0 0;
	display: block;
	height: 29px;
	margin-bottom: 15px;
	overflow: hidden;
	text-indent: -9999em;
	width: 260px;
}
.tg-options .pdf-download:hover,
.tg-options .view-all:hover, { background-position: 0 -29px; }
.tg-options .i-magazine:hover { background-position: 0 -29px; }
.tg-options .pdf-download:active,
.tg-options .view-all:active,
.tg-options .i-magazine:active { background-position: 0 -58px; }

.media-download { background-image: url(/img/frame/download-media.png); float: right; margin: -47px 0 0; }

.tg-options .view-all { background-image: url(/img/frame/view-all.png);}
.tg-options .i-magazine { background-image: url(/img/frame/i-magazine.png);}

/**********************************************
Detailseite (alt)
*********************************************/

.trendguide-wrap {
	float: left;
	overflow: hidden;
	position: relative;
	width: 600px;
}

.trendguide-slide {
	left: 0;
	position: relative;
	width: 2600px;
}

.trendguide-slide-content,
.trendguide-detail {
	float: left;
	margin-right: 50px;
	width: 600px;
}

.trendguide-list {
	float: right;
	padding-top: 42px;
	text-shadow: 0 1px 1px #333;
	width: 270px;
}

.trendguide-list h3 {
	margin-bottom: 10px;
	padding-top: 10px;
	text-shadow: 0 1px 1px #333;
}

.trendguide-list .wrapper {
	background: url(/img/frame/block-gradient.png) 0 0 repeat-x;
	height: 295px;
	overflow: auto;
	overflow-x: hidden;
	padding: 15px
}

.trendguide-list .wrapper a {
	color: #fff;
	display: block;
	font-size: 93%;
	text-decoration: none;
	text-shadow: 0 1px 1px #111;
}

.trendguide-list .picture {
	background: url(/img/frame/mini-cover.png) 0 0 no-repeat;
	float: left;
	height: 59px;
	margin-right: 10px;
	padding: 7px 0 0 7px;
	width: 67px;
}

.trendguide-list .active .picture,
.trendguide-list a:hover .picture {
	background-position: 0 -66px;
	height: 59px;
	padding: 7px 0 0 7px;
	width: 67px;
}

.trendguide-list .issue { padding-top: 15px; }
.trendguide-list .active .issue { color: #9aceff; }
.trendguide-list .date { color: #b6b6b6; }
.trendguide-list span { display: block; }
.trendguide-list li { display: block; margin-bottom: 10px; }

/* coming soon detail */
.upcoming-detail { padding-top: 20px; position: relative; }
.upcoming-detail img { position: relative; right: -1px; }
.upcoming-detail .coming-soon-badge {
	background: url(/img/frame/coming-soon-badge.png);
	display: block;
	height: 122px;
	left: -1px;
	overflow: hidden;
	position: absolute;
	text-indent: -9999em;
	top: 19px;
	width: 122px;
}


.icon {
	background-position: center left;
	background-repeat: no-repeat;
	color: #333;
	display: block;
	font-size: 93%;
	margin-bottom: 17px;
	padding-left: 34px;
	text-shadow: 0 1px 0 #999;
}

.icon:hover {
	color: #fff;
	text-decoration: none;
	text-shadow: 0 1px 1px #333;
}

.icon1 {
	background-image: url(/img/icon/view-info.png);
	height: 17px;
}

.icon2 {
	background-image: url(/img/icon/email.png);
	height: 17px;
}

.icon3 {
	background-image: url(/img/icon/view-media.png);
	height: 18px;
}

.icon4 {
	background-image: url(/img/icon/download.png);
	height: 20px;
}

/**********************************************
Slides
*********************************************/

.trendguide-slide-content h2,
.trendguide-detail h2 { padding-left: 1px; }

.trendguide-slide-content {
	color: #eee;
}

.trendguide-slide-content p {
	font-weight: 200;
	font-size: 116%;
	line-height: 1.5em;
	padding-top: 13px;
	text-shadow: 0 1px 1px #333;
}

.trendguide-slide-content p strong {
	color: #333;
	font-weight: normal;
	text-shadow: 0 1px 0 #9f9f9f;
}

.trendguide-slide-content a {
	color: #9aceff;
	text-decoration: none;
	text-shadow: 0 1px 1px #444;
}

a.back-to-guide {
	color: #9aceff;
	font-size: 123.1%;
	font-weight: 500;
	text-shadow: 0 1px 1px #444;
}

.trendguide-slide-content a:hover { color: #fff; }

/**********************************************
Buttons
*********************************************/

.view-current {
	background: url(/img/frame/view-current.png) 0 0;
	display: block;
	height: 29px;
	margin-top: 15px;
	overflow: hidden;
	text-indent: -9999em;
	width: 186px;
}

.view-current:hover { background-position: 0 -29px; }
.view-current:active { background-position: 0 -58px; }

.become-partner {
	background: url(/img/frame/become-partner.png) 0 0;
	display: block;
	float: right;
	height: 37px;
	margin-top: -42px;
	overflow: hidden;
	text-indent: -9999em;
	width: 297px;
}

.become-partner:hover { background-position: 0 -37px; }
.become-partner:active { background-position: 0 -74px; }

.email-partner {
	background: url(/img/icon/email-partner.png);
	float: left;
	height: 54px;
	margin-right: 15px;
	overflow: hidden;
	text-indent: -9999em;
	width: 81px;
}

/**********************************************
Section Headlines
*********************************************/

h1 {
	color: #fff;
	font-size: 241%;
	font-weight: 500;
	text-shadow: 0 1px 1px #222;
}

h1 .blue { color: #7dc0ff; }

h1 .trendguide {
	color: #7dc0ff;
	text-transform: uppercase;
}

h2 {
	color: #fff;
	font-size: 142%;
	text-shadow: 0 1px 1px #222;
}

h2 .year { color: #bbb; }

h3 {
	color: #fff;
	font-size: 123.1%;
	text-shadow: 0 1px 1px #111;
}

.block-jobs h3 {
	color: #7dc0ff;
	display: block;
	font-weight: 700;
	margin-bottom: 10px;
	padding-left: 25px;
}

.butterfly {
	background: url(/img/frame/butterfly.png) 0 center no-repeat;
	padding-left: 25px;
}

/**********************************************
Table
*********************************************/

table {
	color: #fff;
	font-size: 108%;
	font-weight: 200;
	margin-top: 15px;
	text-shadow: 0 1px 1px #333;
	width: 100%;
}

th {
	background: #888;
	border-right: 1px solid #808080;
	color: #444;
	font-weight: 200;
	padding: 6px 7px;	
	text-shadow: 0 1px 0 #aaa;
}

td {
	background: #999;
	border-right: 1px solid #909090;
	border-top: 1px solid #888;
	padding: 6px 7px;	
}

.block-white table {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	color: #333;
	margin: 0;
	text-shadow: none;
}

.block-white th {
	background: #ddd;
	border-color: #ccc;
	font-size: 93%;
	font-weight: 700;
	text-shadow: none;
}

.block-white td {
	background: #f0f0f0;
	border-color: #ddd;
	font-size: 93%;
	font-weight: normal;
	text-shadow: none;
}

/*
	Über uns
*/

.portrait {
	border: 4px solid #fff;
	display: block;
	margin-bottom: 10px;
	-moz-box-shadow: 0 1px 2px #333;
	-webkit-box-shadow: 0 1px 2px #333;
}

/**********************************************
Order Confirmation
*********************************************/

#order table.info td,
#order table.info th {
	background: none;
	border: none;
	color: #000;
	font-size: 80%;
	font-weight: normal;
	margin: 0;
	padding: 0;
	text-shadow: none;
	vertical-align: top;
}

#order {
	background: #fff;
	margin: 30px 0 0;
	-moz-box-shadow: 0 1px 2px #333;
	padding: 40px;
	-webkit-box-shadow: 0 1px 2px #333;
/* 	width: 700px; */
}

#order .logo {
	float: right;
}

#order .logo img { float: right; }
#order .logo ul {
	color: #999;
	float: left;
	font-size: 81%;
	margin: 0 30px 0;
	text-align: right;
}

#order .agent {
	clear: both;
	font-size: 85%;
	margin-bottom: 15px;
	padding-top: 30px;
}

#order .client {
	margin-bottom: 70px;
}

#order .orderid {
	font-size: 142%;
	font-weight: 700;
}

#order .info { margin-bottom: 40px; }

#order table.calc th,
#order table.calc td {
	font-size: 92%;
	padding: 7px 4px;
	text-align: right;
}

#order table.calc td.left,
#order table.calc th.left { text-align: left; }

#order table.calc th {
	border-bottom: 2px solid #000;
	border-top: 2px solid #000;
	font-weight: 700;
}

#order table.calc .sep td {
	border-top: 1px solid #000;
}

#order table.calc .total td {
	border-top: 2px solid #000;
	font-weight: 700;
}

#order .thanks { margin-bottom: 50px; }
#order .note { color: #999; font-size: 83%; }

#confirm-order {
	background: url(/img/frame/confirm-order.png) 0 0;
	display: block;
	height: 54px;
	margin: 30px auto 0;
	overflow: hidden;
	text-indent: -9999em;
	width: 420px;
}

#confirm-order:hover { background-position: 0 -54px; }
#confirm-order:active { background-position: 0 -108px; }