@font-face {
    font-family: 'tinet';
    src: url('/fonts/tungusfont_tinet-webfont.eot');
    src: url('/fonts/tungusfont_tinet-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/tungusfont_tinet-webfont.woff') format('woff'),
    url('/fonts/tungusfont_tinet-webfont.ttf') format('truetype'),
    url('/fonts/tungusfont_tinet-webfont.svg#tinetregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'broken15';
    src: url('/fonts/broken15-webfont.eot');
    src: url('/fonts/broken15-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/broken15-webfont.woff') format('woff'),
    url('/fonts/broken15-webfont.ttf') format('truetype'),
    url('/fonts/broken15-webfont.svg#asapregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'shortcut';
    src: url('/fonts/shortcut-webfont.eot');
    src: url('/fonts/shortcut-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/shortcut-webfont.woff') format('woff'),
    url('/fonts/shortcut-webfont.ttf') format('truetype'),
    url('/fonts/shortcut-webfont.svg#asapregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asap';
    src: url('/fonts/asap-regular-webfont.eot');
    src: url('/fonts/asap-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/asap-regular-webfont.woff') format('woff'),
    url('/fonts/asap-regular-webfont.ttf') format('truetype'),
    url('/fonts/asap-regular-webfont.svg#asapregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asapbold';
    src: url('/fonts/asap-bold-webfont.eot');
    src: url('/fonts/asap-bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/asap-bold-webfont.woff') format('woff'),
    url('/fonts/asap-bold-webfont.ttf') format('truetype'),
    url('/fonts/asap-bold-webfont.svg#asapbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asapitalic';
    src: url('/fonts/asap-italic-webfont.eot');
    src: url('/fonts/asap-italic-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/asap-italic-webfont.woff') format('woff'),
    url('/fonts/asap-italic-webfont.ttf') format('truetype'),
    url('/fonts/asap-italic-webfont.svg#asapitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asapbold_italic';
    src: url('/fonts/asap-bolditalic-webfont.eot');
    src: url('/fonts/asap-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
    url('/fonts/asap-bolditalic-webfont.woff') format('woff'),
    url('/fonts/asap-bolditalic-webfont.ttf') format('truetype'),
    url('/fonts/asap-bolditalic-webfont.svg#asapbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*
 * General Page Reset
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  background: transparent;
  border: 0;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html, body {
  width: 100%;
  height: 100%;
  font-size: 100%;
  background: url('/images/background/pagebackground.png');
  background-repeat: repeat;
  font-family: asap, Trebuchet, Verdana, Helvetica, Arial, sans-serif;
}

/*
 * End General Page Reset
 *
 * ---------------------------------------------------------------------
 *
 * General Page Config
 */
object, embed {
  outline: 0;
}

/*
div {
  font-size: 12px;
  color: black;
}
*/

h1 {
  line-height: 45px;
}

textarea {
  resize: none;
}

.clear {
  clear: both;
}

.spacer {
  height: 10px;
  width: 100%;
}

.flright {
  float: right;
}

.flleft {
  float: left
}

.errors {
  padding-left: 5px;
  color: #d7001c;
}

.message_success {
  color: green;
}

.message_notices {
  color: orange;
}

.message_errors {
  color: #d7001c;
}

.loadPage:hover {
    cursor: pointer;
}

/*
 * End General Page Config
 *
 * ---------------------------------------------------------------------
 *
 * head config
*/

#top_info {
  float: left;
  position: absolute;
  top: 8px;
  left: 60px;
}

#top_info ul {
    padding: 5px;
}

#top_nav {
  float: right;
  position: absolute;
  top: 8px;
  right: 80px;
}

#top_nav ul {
  padding: 5px;
}

#top_nav li.red {
  color: #d7001c;
}

#top_nav ul li:hover {
  text-decoration: underline;
}

.top_menu {
  font-size: 0.7em;
  font-weight: bold;
  color: white;
  font-family: asap;
  float: left;
  cursor: pointer;
}

ul.top_menu li {
  display: inline;
  padding: 0;
}

#webplayer_container {
  position: absolute;
  top: 60px;
  right: 70px;
  width: 319px;
  height: 90px;
}

#main_logo {
  position: absolute;
  top: 64px;
  left: 39px;
  width: 468px;
  height: 80px;
  background: url('/images/background/logo.png');
}

#sub_logo {
  position: absolute;
  top: 145px;
  left: 123px;
  width: 310px;
  height: 18px;
  background: url('/images/background/slogan.png');
}

/*
 * End head config
 *
 * ---------------------------------------------------------------------
 *
 * page elements
*/
#wrapper {
  position: relative;
  margin: 0 auto;
  width: 1024px;
}

#wrapper_head {
  position: absolute;
  top: 0px;
  width: 1024px;
  height: 180px;
  z-index: 100;
}

#wrapper_navigation {
  position: absolute;
  top: 168px;
  right: 0px;
  height: 310px;
  width: 104px;
  z-index: 100;
}

#wrapper_sb {
  position: absolute;
  top: 185px;
  right: 110px;
  height: 310px;
  width: 64px;
  color: #000000;
  z-index: 100;
}

#back_button {
    background: url('/images/icons/invers/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 15px;
    left: 15px;
    height: 40px;
    width: 40px;
}

#back_button:hover {
    background: url('/images/icons/highlight/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 13px;
    left: 13px;
    cursor: pointer;
}

#back_button_shadow {
    background: url('/images/icons/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 17px;
    left: 17px;
    height: 40px;
    width: 40px;
}

#sb_button {
    position: absolute;
    top: 90px;
    height: 67px;
    width: 64px;
}

#sb_button:hover {
    position: absolute;
    top: 89px;
    left: -1px;
    transform: rotate(45deg);
}

#fb_button  {
    position: absolute;
    top: 190px;
    left: 7px;
    height: 50px;
    width: 50px;
}

#fb_button:hover {
    position: absolute;
    top: 189px;
    left: 6px;
}


#bg_container {
  width: 1024px;
  color: #8888ff;
  z-index: 1;
}

#bg_head {
  background-color: #0000D0;
  height: 582px;
  z-index: 1;
  background: url('/images/background/bg_head.png');
}

#bg_middle {
  background-color: #000090;
  background-repeat: repeat-y;
  z-index: 1;
  background: url('/images/background/bg_middle.png');
}

#bg_bottom {
  background-color: #000060;
  height: 131px;
  z-index: 1;
  background: url('/images/background/bg_bottom.png');
}

#col1_container {
  position: absolute;
  top: 190px;
  left: 20px;
  width: 500px;
  z-index: 100;
}

#col1_bg_head {
  height: 208px;
  z-index: 50;
  background: url('/images/background/col1_bg_head.png');
}

#col1_bg_middle {
  background-repeat: repeat-y;
  height: 22px;
  z-index: 50;
  background: url('/images/background/col1_bg_middle.png');
}

#col1_bg_bottom {
  height: 11px;
  z-index: 50;
  background: url('/images/background/col1_bg_bottom.png');
}

#nav_menu_right_border {
  position: absolute;
  top: -79px;
  right: 0px;
  width: 26px;
  height: 700px;
  background: url('/images/menu/right_border.png');
  background-repeat: repeat-y;
  z-index: 150;
}

#bg_spacer {
  height: 30px;
  z-index: 1;
}

#col1_content {
  position: absolute;
  top: 230px;
  left: 41px;
  padding: 0px 0px 20px 0px;
  width: 460px;
  z-index: 100;
}

#col2_content {
  position: absolute;
  top: 185px;
  left: 532px;
  padding: 0px 0px 20px 0px;
  width: 300px;
  color: #ffffff;
  z-index: 100;
}

#col3_content {
  position: absolute;
  top: 480px;
  left: 846px;
  padding: 0px 0px 20px 0px;
  width: 150px;
  color: #ffffff;
  z-index: 100;
}

a {
    text-decoration: none;
}

#col1_content a {
    color: black;
}

#col2_content a, #col3_content a {
    color: white;
}

.boxshadow {
  -webkit-box-shadow: 0px 0px 5px 5px #222222;
  -moz-box-shadow: 0px 0px 5px 5px #222222;
  -ms-box-shadow: 0px 0px 5px 5px #222222;
  -o-box-shadow: 0px 0px 5px 5px #222222;
  box-shadow: 0px 0px 5px 5px #222222;
}

.button, #submit {
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  box-shadow: inset 0px 1px 0px 0px #ffffff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
  background: -moz-linear-gradient(center top, #ededed 5%, #dfdfdf 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ededed', endColorstr = '#dfdfdf');
  background-color: #ededed;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #333333;
  display: inline-block;
  color: #333333;
  font-family: arial;
  font-size: 10px;
  font-weight: bold;
  padding: 6px 24px;
  text-decoration: none;
  text-shadow: 1px 1px 0px #ffffff;
}

.button:hover, #submit:hover {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
  background: -moz-linear-gradient(center top, #dfdfdf 5%, #ededed 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#dfdfdf', endColorstr = '#ededed');
  background-color: #dfdfdf;
}

.button:active, #submit:active {
  position: relative;
  top: 1px;
}

.head_link {
    color: white;
    font-family: 'asap';
}

.link:hover {
    color: #d7001c;
    background: rgba(255,255,255,0.3);
    box-shadow: 0 0 10px 3px rgba(255,255,255,0.5);
}

/* back buttons */

.back_button {
    float: right;
}

.icon_size_normal {
    width: 32px;
    height: 32px;
}

/* buttons */

.link_buttons {
/*    height: 36px; */
    margin-bottom: 1em;
    clear: both;
    overflow: hidden;
}

.button_container {
    float: left;
    margin-right: 1em;
    margin-bottom: 0.5em;
}

.button_box {
    cursor: pointer;
    display: inline-flex;
}

.button_box:hover > .button_left {
    background-image: url('/images/icons/highlight/button-l.png') !important;
    position: relative;
    top: -1px;
    left: -1px;
}

.button_box:hover > .button_mid {
    background-image: url('/images/icons/highlight/button-m.png') !important;
    position: relative;
    top: -1px;
    left: -1px;
}

.button_box:hover > .button_right {
    background-image: url('/images/icons/highlight/button-r.png') !important;
    position: relative;
    top: -1px;
    left: -1px;
}

.button_clear {
    clear: both;
}

/* headline */

.headline_logo_small {
    font-size: 1.5em !important;
    text-align: center;
    top: 0.1em;
}

/* --- col1 --- */

#col1_content .headline_box {
  z-index: 200;
  left: 20px;
}

#col1_content .headline_top {
  background-image: url('/images/headline_col1_grey_top.png');
  background-repeat: no-repeat;
  height: 12px;
  z-index: 200;
  top: 1px;
  position: relative;
}

#col1_content .headline_mid {
  background-image: url('/images/headline_col1_grey_mid.png');
  background-repeat: repeat-y;
  height: auto;
  z-index: 200;
}

#col1_content .headline_bot {
  background-image: url('/images/headline_col1_grey_bot.png');
  background-repeat: no-repeat;
  height: 11px;
  z-index: 200;
  top: -1px;
  position: relative;
}

#col1_content .headline_text {
  position: relative;
  width: 290px;
  padding-bottom: 0.3em;
  font-family: 'tinet';
  letter-spacing: 0.06em;
  font-size: 1.1em;
  font-weight: bolder;
  text-shadow: #000000 0.1em 0.1em;
  text-align: center;
  color: #f5f5f5;
  z-index: 210;
}

#col1_content .headline_ink {
  position: relative;
  top: -10px;
  left: -15px;
  width: 56px;
  height: 47px;
  float: left;
  z-index: 205;
  background: url('/images/ink_black.png');
}

#col1_content .headline_logo {
    position: absolute;
    right: 0%;
    bottom: 25%;
    transform:rotate(-10deg);
    font-family: shortcut;
    font-size: 1.95em;
    z-index: 250;
}

#col1_content .headline_logo_shadow {
    color: #d7001c;
    opacity: 0.4;
    position: absolute;
    right: 0.5%;
    bottom: 24.5%;
    transform:rotate(-7deg);
    font-family: shortcut;
    font-size: 1.9em;
    z-index: 249;
}

#col1_content .button_left {
    background-image: url('/images/icons/button-l.png');
    background-repeat: no-repeat;
    width: 10px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col1_content .button_mid {
    background-image: url('/images/icons/button-m.png');
    background-repeat: repeat-x;
    width: auto;
    min-width: 100px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col1_content .button_right {
    background-image: url('/images/icons/button-r.png');
    background-repeat: no-repeat;
    width: 10px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col1_content .button_text {
    position: relative;
    top: 7px;
    font-family: 'tinet';
    letter-spacing: 0.06em;
    font-size: 0.8em;
    font-weight: bold;
    text-shadow: lightgrey 0.1em 0.1em;
    text-align: center;
    color: #252525;
    z-index: 210;
}

#col1_content .icon_back {
    background: url('/images/icons/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_left {
    background: url('/images/icons/arrow-left.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_right {
    background: url('/images/icons/arrow-right.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_up {
    background: url('/images/icons/arrow-up.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_down {
    background: url('/images/icons/arrow-down.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_calendar {
    background: url('/images/icons/calendar.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

/* --- col2 --- */

#col2_content .headline_box {
  z-index: 200;
  left: 20px;
}

#col2_content .headline_top {
  background-image: url('/images/headline_col2_black_top.png');
  background-repeat: no-repeat;
  height: 12px;
  top: 1px;
  position: relative;
  z-index: 200;
}

#col2_content .headline_mid {
  background-image: url('/images/headline_col2_black_mid.png');
  background-repeat: repeat-y;
  height: auto;
  z-index: 200;
}

#col2_content .headline_bot {
  background-image: url('/images/headline_col2_black_bot.png');
  background-repeat: no-repeat;
  height: 11px;
  top: -1px;
  position: relative;
  z-index: 200;
}

#col2_content .headline_text {
  position: relative;
  left:10px;
  width: 280px;
  padding-bottom: 0.3em;
  font-family: 'tinet';
  font-size: 1.1em;
  font-weight: bolder;
  letter-spacing: 0.06em;
  color: #f5f5f5;
  z-index: 210;
  text-align: center;
}

#col2_content .headline_ink {
  position: relative;
  top: -5px;
  left: -5px;
  width: 56px;
  height: 47px;
  float: left;
  margin-right: -1.3em;
  z-index: 205;
  background: url('/images/ink_red.png');
}

#col2_content .headline_logo {
    display: none;
}

#col2_content .headline_logo_shadow {
    display: none;
}


/* buttons in column 2 */

#col2_content .button_left {
    background-image: url('/images/icons/invers/button-l.png');
    background-repeat: no-repeat;
    width: 10px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col2_content .button_mid {
    background-image: url('/images/icons/invers/button-m.png');
    background-repeat: repeat-x;
    width: auto;
    min-width: 100px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col2_content .button_right {
    background-image: url('/images/icons/invers/button-r.png');
    background-repeat: no-repeat;
    width: 10px;
    height: 32px;
    z-index: 200;
    float: left;
}

#col2_content .button_text {
    position: relative;
    top: 7px;
    font-family: 'tinet';
    letter-spacing: 0.06em;
    font-size: 1em;
    font-weight: bold;
    text-shadow: lightgrey 0.1em 0.1em;
    text-align: center;
    color: #F5F5F5;
    z-index: 210;
}

#col2_content .icon_back {
    background: url('/images/icons/invers/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col2_content .icon_left {
    background: url('/images/icons/invers/arrow-left.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col2_content .icon_right {
    background: url('/images/icons/invers/arrow-right.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col2_content .icon_up {
    background: url('/images/icons/invers/arrow-up.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col2_content .icon_down {
    background: url('/images/icons/invers/arrow-down.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col2_content .icon_calendar {
    background: url('/images/icons/invers/calendar.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

/* col1 & col2 */

#col1_content .button_link:hover, #col2_content .button_link:hover {
    text-decoration: none;
    cursor: pointer;
    position: relative;
    top: -1px;
    left: -1px;
}

#col1_content .icon_back:hover, #col2_content .icon_back:hover {
    background: url('/images/icons/highlight/arrow-back.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_left:hover, #col2_content .icon_left:hover {
    background: url('/images/icons/highlight/arrow-left.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_right:hover, #col2_content .icon_right:hover {
    background: url('/images/icons/highlight/arrow-right.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_up:hover, #col2_content .icon_up:hover {
    background: url('/images/icons/highlight/arrow-up.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_down:hover, #col2_content .icon_down:hover {
    background: url('/images/icons/highlight/arrow-down.png');
    background-size: 100%;
    background-repeat: no-repeat;
}

#col1_content .icon_calendar:hover, #col2_content .icon_calendar:hover {
    background: url('/images/icons/highlight/calendar.png');
    background-size: 100%;
    background-repeat: no-repeat;
}


/* alle Tooltips */
.web-tooltip {
    font-size: 0.8em !important;
}