﻿/***** Defaults *****/

html,body,div,form,ul,li {
  padding: 0;
  margin: 0;
}

img {
  border: none;
  font: 10px Arial;
  max-width: 150px;
  height: auto;
}

ul, li {
  list-style-type: none;
}

@font-face {
  font-family: "ContinentalStagSansLight";
  src: url("../fonts/ContinentalStagSans-Light-Web.eot");
  src: url("../fonts/ContinentalStagSans-Light-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-Light-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-Light-Web.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "ContinentalStagSansLight";
  src: url("../fonts/ContinentalStagSans-LightIt-Web.eot");
  src: url("../fonts/ContinentalStagSans-LightIt-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-LightIt-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-LightIt-Web.woff") format("woff");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "ContinentalStagSansBook";
  src: url("../fonts/ContinentalStagSans-Book-Web.eot");
  src: url("../fonts/ContinentalStagSans-Book-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-Book-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-Book-Web.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "ContinentalStagSansBook";
  src: url("../fonts/ContinentalStagSans-BookIt-Web.eot");
  src: url("../fonts/ContinentalStagSans-BookIt-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-BookIt-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-BookIt-Web.woff") format("woff");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "ContinentalStagSansMedium";
  src: url("../fonts/ContinentalStagSans-Medium-Web.eot");
  src: url("../fonts/ContinentalStagSans-Medium-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-Medium-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-Medium-Web.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "ContinentalStagSansMedium";
  src: url("../fonts/ContinentalStagSans-MediumIt-Web.eot");
  src: url("../fonts/ContinentalStagSans-MediumIt-Web-1.eot") format("embedded-opentype"),
       url("../fonts/ContinentalStagSans-MediumIt-Web.woff2") format("woff2"),
       url("../fonts/ContinentalStagSans-MediumIt-Web.woff") format("woff");
  font-weight: 500;
  font-style: italic;
}


/* General navigation elements */
div.standard_nav ul, ul.standard, div.standard_nav ol, ol.standard {
  margin-left: 0px;
}

div.standard_nav li, ul.standard li, ol.standard li {
  margin-bottom: 10px;
  margin-left: 15px;
  padding-left: 5px;
  border-left: 3px solid #ffa500;
}

div.standard_nav ol li, ol.standard li {
  list-style-type: decimal;
}

a, area, label, .pointer, input[type=submit], input[type=reset] {
  cursor: pointer;
}

/* Misc defaults */
.help      { cursor: help; }
.clear     { clear: both; }
.hidden    { display: none; }
.invisible { visibility: hidden; }

.code {
  padding: 2px;
  border: 1px solid #666;
  background-color: #ccc;
  font-family: monospace;
}

p.code, div.code {
  margin: 5px 0 5px 0;
}

.required {
  color: red;
  font-weight: bold;
}

.required select, select.required, .required textarea, textarea.required {
  border-color: red !important;
}

.required input, input.required  {
  border-color: red !important;
  outline: 2px solid #f00;
}

table.fullsize { width: 100%; }

hr {
  color: black;
  background-color: black;
  height: 1px;
  border: 0px;
  clear: both;
}

h1,h2,h3,h4,p {
  margin: 0;
  padding: 3px 0 3px 0;
}

body { font-size: 16px; }
h1   { font-size: 40px; font-family: ContinentalStagSansLight; }
h2   { font-size: 28px; font-family: ContinentalStagSansMedium; font-weight: 500; }
h3   { font-size: 24px; font-family: ContinentalStagSansMedium; }
h4   { font-size: 18pt; font-family: ContinentalStagSansMedium; }
p    { padding-bottom: 7px; }
a, input[type=submit], input[type=reset], select { font-size: 18px; font-family: ContinentalStagSansMedium; }

/* make li's appear in a row next to each other */
ul.row li {
  float: left;
}

/* simple colors */
.gray   { color: gray; }
.green  { color: green; }
.yellow { color: yellow; }
.red    { color: red; }
.blue   { color: blue; }
.orange { color: orange; }

.bold { font-weight: bold; }

/* form element defaults */
input.short  { width:  50px; }
input.medium { width: 150px; }
input.text   { width: 85%; }
input.long   { width: 500px; }

textarea {
  width: 300px;
  height: 100px;
  color: #000;
}

textarea.tinymce {
  width: 440px;
  height: 300px;
}

textarea.tinymce.small {
  width: 440px;
  height: 250px;
}

textarea.misc {
  width: 440px;
  height: 200px;
}

textarea.cmc_register_terms,div.cmc_register_terms {
  width: 550px;
  height: 300px;
  overflow: auto;
}

/* Link styling */
a         { color: #ffa500; font-size: 18px; font-weight: 500; text-decoration: none; }
a:link    { color: #ffa500; text-decoration: none; }
a:visited { color: #ffa500; text-decoration: none; }
a:hover   { color: #6e6e6e; text-decoration: none; }
a:active  { color: #6e6e6e; text-decoration: none; }
a:focus   { color: #6e6e6e; text-decoration: none; }

/* Buttons and Input elements */
a.button_2017,a.button_next_2017,
input[type=text], input[type=password], input[type=submit], input[type=reset], select {
  display: inline-block;
  text-align: center;
  font-size: 14px;
  height: 26px;
  line-height: 28px;
  min-width: 26px;
  background-color: #ffa500;
  border-radius: 100px;
  margin-right: 5px;
  margin-bottom: 5px;
  padding: 0 15px;
  color: #000;
  text-decoration: none;
  transition: all .5s ease-in-out 0s;
}

form a.button_2017 , a.button_next_2017{
  position: relative;
  top: -1px;
}

input[type=submit], input[type=reset] {
  line-height: 24px;
}

a.button_2017.big, a.button_next_2017.big{
  height: 44px;
  line-height: 44px;
  font-size: 16px;
  min-width: 44px;
  padding: 0 30px;
}

a.button_2017:hover,
a.button_2017:focus,
a.button_2017:active,
a.button_2017.active,
a.button_next_2017:hover,
a.button_next_2017:focus,
a.button_next_2017:active,
a.button_next_2017.active  {
  background-color: #6e6e6e;
  color: #fff;
}

a.button_2017.open_close, a.button_next_2017.open_close{
  padding-right: 35px;
  background: url(../img/layout/icon_open_close.png) no-repeat top right #fff;
}

a.button_2017.open_close:hover,
a.button_2017.open_close:focus,
a.button_2017.open_close:active,
a.button_next_2017.open_close:hover,
a.button_next_2017.open_close:focus,
a.button_next_2017.open_close:active  {
  color: #000;
}

a.button_2017.open_close.opened,a.button_next_2017.open_close.opened {
  background-position: right -29px;
  color: #000;
}

a.button_2017.open_close_simple,a.button_next_2017.open_close_simple {
  padding-right: 22px;
  background: url(../img/layout/icon_open_close_simple.png) no-repeat right 5px transparent;
  transition: none;
  color: #dadada;
}

a.button_2017.open_close_simple:hover,
a.button_2017.open_close_simple:focus,
a.button_2017.open_close_simple:active 
a.button_next_2017.open_close_simple:hover,
a.button_next_2017.open_close_simple:focus,
a.button_next_2017.open_close_simple:active{
  color: #ffa500;
  background-position: right -20px;
}

a.button_2017.open_close_simple.opened,a.button_next_2017.open_close_simple.opened {
  background-position: right -20px;
  color: #ffa500;
}

#head.login a.button_2017.open_close_simple {
  color: #6e6e6e;
}


/* Help ? / Info ? buttons */
p.info, div.info {
  cursor: help;
  padding: 3px;
  margin: 3px;
  border: 1px dotted #333;
}

a.info {
  text-decoration: none;
  width: 20px;
  height: 18px;
  padding-right: 22px;
  cursor: help;
  background: url(../img/layout/icon_info.png) top right no-repeat;
}

a.info:link, a.info:visited {
  color: #000;
}

a.info:hover, a.info:focus, a.info:active, a.info.active {
  text-decoration: none;
  background-position: right -25px;
  color: #ffa500;
}
#pimcore_editable_cmc_document_next{
  margin-left: 50px !important;
}
a.info.expanded {
  background-position: right -50px;
}

a.info.expanded:hover, a.info.expanded:focus, a.info.expanded:active, a.info.expanded.active {
  background-position: right -75px;
}

a.nolink {
  text-decoration: none;
  color: #000;
}

/***** Global Layout Definitions *****/
html {
  height: 100%;
  padding: 0;
}

body {
  width: 100%;
  height: 100%;
  background-color: #000;
  font-family: ContinentalStagSansBook, Lucida Sans Unicode, Helvetica, Arial, sans-serif;
  color: #000;
}

#body_wrapper {
  margin: 0 auto;
  max-width: 1500px;
  min-height: 100%;
  border-left: 20px solid #fff;
  border-right: 20px solid #fff;
  border-bottom: 20px solid #fff;
  background-color: #fff;
}

/***** Modules: content modules *****/

/* module: full width wrapper for background color/image and content container */
div.module {
  margin-top: 4px;
  padding-bottom: 10px;
  clear: both;
}

div.module:first-child {
  margin-top: 0;
}

div.module #headline {
  position: relative;
  min-height: 55px;
}


/* module_content: wrapped into a module, with the actual content */
div.module_content {
  width: 90%;
  margin: 0 auto;
}

h1.module {
  float: left;
  min-width: 90%;
  height: auto; 
  min-height: 45px; /* +padding top and bottom = 55px */
  padding: 10px 0 0 5%;
  font-weight: 300;
  background-color: #ffa500;
  margin-bottom: 10px;
}

div#sortnav {
  position: absolute;
  right: 5%;
  width: 20%;
  height: 100%;
  background-color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
}

ul#sortnav_selection {
  width: 70%;
  position: absolute;
  top: 40px;
  left: 25px;
  padding: 3px;
  background: #fff;
  border: 1px solid #000;
  border-top: none;
  z-index: 2;
}

div.module.grey {
  background: url(../img/layout/bg_grey_tile.jpeg) #e0e0e0;
}

/* Individual module overrides */

/* Login Head */
#head.login #head_nav {
  height: 60px;
  background-color: #fff;
}

#head.login {
  background: url(../img/layout/login_head_2017.jpeg) no-repeat center center #000;
  background-size: cover;
  height: 195px;
}
.editimg{
    /*display: inline-block;*/
    width: 200px;
    height: 120px;
    position: absolute;
    right:0px;  
    top:64px;
    z-index: 1;
}

body.cmc #head.login {
  /* background-image: url(../img/layout/login_head_cmc_2017.jpeg); */
  height: 295px;
}

#head.login div.head_gradient {
  height: 100%;
  padding-bottom: 10px;
  background: url(../img/layout/head_gradient.png) bottom right no-repeat;
}

#head.login #qseal_wrapper {
  width: 258px;
  padding-bottom: 10px;
}

#head.login #qseal {
  text-align: center;
  background-color: #ffa500;
  margin-top: -60px;
  padding: 80px 0 20px 0;
}

#head.login #qseal a {
  padding-bottom: 5px;
  background: url(../img/layout/conti_claim_2017.svg) no-repeat center bottom; /* The Future in Motion */
}

#head.login #contiview_dev_logo {
  position: relative;
  top: -10px;
  left: -10px;
}

/* Main Head after login */
#head.main {
  height: 37px;
  background: url(../img/layout/head_gradient.png) bottom right no-repeat #000;
  position: relative;
}

#head.main #qseal {
  width: 166px;
  height: 46px;
  margin-right: 9px;
  padding-top: 1px;
  text-align: center;
  background-color: #ffa500;
  float: left;
}

#head.main #qseal img {
  width: 146px;
  height: 26px;
}

#head.main #system_label {
  float: left;
  padding-top: 3px;
}

#head.main #system_label h1 {
  font-size: 28px;
}

#head.main #system_label a {
  font-size: 28px;
  color: #fff;
  text-decoration: none;
  font-family: ContinentalStagSansLight;
}

#head div.login_nav {
  float: right;
  margin-top: 8px;
}

#head.login div.module_content {
  position: relative;
}

#head.login div.login_nav {
  position: absolute;
  top: 10px;
  right: 0;
}

#head div.login_nav ul.switch_language {
  position: absolute;
  top: 34px;
  width: 240px;
  background-color: #fff;
  border: 1px solid #dadada;
  z-index: 2;
  display: none;
}

#head.login div.login_nav ul.switch_language {
  right: 0;
  top: 26px;
}

#head div.login_nav ul.switch_language li {
  padding: 4px 5px 4px 10px;
}

#head div.login_nav ul.switch_language li a {
  font-size: 14px;
  color: #6b6b6b;
}

#head div.login_nav ul.switch_language li a:hover,
#head div.login_nav ul.switch_language li a:focus,
#head div.login_nav ul.switch_language li a:active,
#head div.login_nav ul.switch_language li a.current_language {
  color: #ffa500;
}

#tablet_menu, #tablet_menu_button {
  /* See Tablet-Breakpoint */
  display: none;
}

#tablet_menu_button {
  float: right;
  margin-top: 3px;
  margin-left: 5px;
  width: 40px;
}

#tablet_menu_button span.menu_bar {
  display: block;
  height: 6px;
  background-color: #ffa500;
  margin-bottom: 3px;
}

#tablet_menu_button span.menu_bar:last-child {
  margin-bottom: 0;
}

#tablet_menu {
  z-index: 1;
  position: absolute;
  right: 0px;
  background-color: #000;
  color: #fff;
  width: 400px;
  border-bottom: 10px solid #ffa500;
}

#tablet_menu li a {
  color: #fff;
  display: block;
  padding: 10px 0 10px 50px;
  border-bottom: 1px solid #9c9d9d;
}

/* Main navigation */
#main_nav {
  margin-top: 0;
  padding-bottom: 0;
  border-bottom: 1px solid #9c9d9d;
}

#main_nav ul {
  float: right;
}

#main_nav a {
  margin: 0 -1px;
  position: relative;
  display: block;
  padding: 23px 20px 17px 20px;
  color: #000;
  text-decoration: none;
  transition: all .5s ease-in-out 0s;
}

#main_nav a:focus,
#main_nav a:hover,
#main_nav a:active,
#main_nav a.active {
  background-color: #ffa500;
}

#main_nav a::after {
  content: "";
  position: absolute;
  right: 0;
  width: 1px;
  height: 41.2%;
  top: 29.4%;
  background-color: #9c9d9d;
  transition: .5s;
}

#main_nav li:last-child a::after {
  width: 0;
}

#main_nav a:focus::after,
#main_nav a:hover::after,
#main_nav a:active::after,
#main_nav a.active::after {
  background-color: #ffa500;
}

/* Sub navigation */
#sub_nav {
  margin-top: 0;
  padding-bottom: 0;
}

#sub_nav ul {
  float: right;
}

#sub_nav li {
  padding: 10px 0;
}

#sub_nav a {
  padding: 0 10px;
  color: #000;
  text-decoration: none;
  transition: all .5s ease-in-out 0s;
  border-right: 1px solid #9c9d9d;
  font-family: ContinentalStagSansBook;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
}

#sub_nav li:last-child a {
  border-right: none;
}

#sub_nav a:focus,
#sub_nav a:hover,
#sub_nav a:active,
#sub_nav a.active {
  color: #ffa500;
}

#sub_nav a.disabled {
  color: #999;
  cursor: not-allowed;
}

/* Search */
#search {
  margin-top: 0;
  padding: 20px 0;
}

#search #searchterm {
  width: 350px;
  font-size: 18px;
}

#search div.help {
  float: left;
  margin-top: 3px;
}

#search div.help a {
  float: left;
  margin-left: 20px;
  color: #ccc;
}

#search div.limiter {
  min-width: 150px;
  float: left;
}

#search div.limiter h2 {
  padding-bottom: 10px;
}

li.delim {
  padding-top: 2px !important;
  padding-bottom: 3px !important;
  margin-bottom: 3px !important;
}

/* Browsing documents */
#inner_content {
  padding-top: 20px;
}

table.inner_content {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
}

table.inner_content > tbody > tr > td, table.inner_content > tr > td {
  vertical-align: top;
  padding: 0;
  margin: 0;
}

table.inner_content td.nav     { width: 260px; }
table.inner_content td.payload { padding-left: 20px; }

table.inner_content.nonav td.nav     { display: none; }
table.inner_content.nonav td.payload { padding-left: 0; }

.module_head { margin-top: 30px; }

/* Foot */
#foot {
  border-top: 10px solid #ffa500;
  padding-top: 10px;
  background-color: #000;
  color: #fff;
}

#foot a {
  color: #fff;
  font-family: ContinentalStagSansBook;
}



/***** Breakpoints *****/

/* Desktop Layout, slightly reduced size */
@media (max-width: 1090px) {
  #system_label { display: none; }

  #main_nav a, #search_tabs a {
    font-size: 16px;
    padding: 15px 12px;
  }
}

/* Tablet Layout */
@media (max-width: 855px) {

  .no_tablet { display: none !important; }

  h1   { font-size: 36px; }
  h2   { font-size: 36px; }
  h3   { font-size: 22px; }
  h4   { font-size: 16pt; }
  body { font-size: 16px; }

  #body_wrapper {
    border-width: 10px;
  }

  div.module_content {
    width: 96%;
    margin: 0 auto;
  }

  h1.module {
    padding-top: 12px;
    font-size: 28px;
    min-width: 96%;
    height: 43px;
    padding: 6px 0 0 2%;
  }

  .overlay .main {
    padding: 4px;
    border-width: 10px;
  }

  #head.login             { height: 200px; }
  #loginviewi             { display: none; }
  #head.main              { background-image: none; }
  #tablet_menu_button     { display: block; }
  #tablet_menu            { top: 50px; }
  #search #searchterm     { width: 225px; }
  #sub_nav a              { padding: 0 6px; }
  #search_tabs a          { font-size: 12px; padding: 10px 6px; }
  div#sortnav             { right: 2%; height: 49px; width: 200px; }
  ul#sortnav_selection    { top: 36px; }
  ul#sortnav_selection a  { font-family: ContinentalStagSansLight; font-weight: 300; }
}

/* Phone Layout */
@media (max-width: 638px) {

  .no_tablet, .no_phone { display: none !important; }

  h1   { font-size: 24px; }
  h2   { font-size: 24px; }
  h3   { font-size: 22px; }
  h4   { font-size: 16pt; }
  body { font-size: 16px; }

  #body_wrapper  { border-width: 4px; }
  .overlay .main { border-width: 4px; }

  #head.main, #head.login {
    margin-left: -4px;
    margin-right: -4px;
  }

  #head #head_nav {
    display: none;
  }

  #head.main, #head.login {
    background: #ffa500;
    height: 40px;
  }

  #head.main div.head_gradient, #head.login div.head_gradient {
    padding-bottom: 0;
    background: transparent;
  }

  #head.main #qseal_wrapper, #head.login #qseal_wrapper {
    width: 258px;
  }

  #head.main #qseal, #head.login #qseal {
    padding: 3px 0 0 0;
    float: left;
    margin-top: 0;
    background: none;
  }

  #head.main #qseal a, #head.login #qseal a {
    background: none;
  }

  #tablet_menu_button span.menu_bar { background-color: #000; }
  #tablet_menu                      { width: 100%; }
  #sub_nav a                        { padding: 0 2px; }
  #search #searchterm               { width: 100px; }

  #head div.login_nav a.button_2017.open_close_simple:hover,
  #head div.login_nav a.button_2017.open_close_simple:focus,
  #head div.login_nav a.button_2017.open_close_simple:active,
  #head div.login_nav a.button_2017.open_close_simple.opened {
    color: #dadada;
  }
}

/*
#head.cmc_bg_head_pkwreifen      { background: url(../img/layout/background_header_02.jpg); }
#head.cmc_bg_head_motorradreifen { background: url(../img/layout/background_header_cmc_motorrad.jpg); }
*/



/** MAIN-CONTENT **/
#payload ul li {
  list-style-image: url(../img/layout/bulletpoint.png);
  margin-left: 20px;
  padding: 5px 0 4px 5px;
}

#payload ol li {
  list-style-type: decimal;
  margin-left: 20px;
  padding: 5px 0 4px 5px;
}

#payload ul.row li, #payload ol.row li {
  margin-left: 15px;
  margin-right: 20px;
  padding-left: 0;
}

#payload ul.nobullet li, #payload ol.nobullet li {
  list-style-type: none;
  list-style-image: none;
  margin: 0;
  padding: 0;
}

.login_head {
  background-color: #000;
  color: #ffa500;
  width: 100%;
}
.login_head h1 {
  padding: 10px;
}


/* CMC Host Selector */
#cmc_host_selection {
  height: 31px;
  overflow: hidden;
}

#cmc_host_selection a {
  float: left;
  width: 60px;
  height: 40px;
  margin-right: 5px;
  background: url(../img/layout/icon_type_car.png) top left no-repeat;
  transition: none;
}
#cmc_host_selection a:last-child { margin-right: 0; }

/*#cmc_host_selection a.type_truck     { background-image: url(../img/layout/icon_type_truck.png); }*/
/*#cmc_host_selection a.type_motorbike { background-image: url(../img/layout/icon_type_motorbike.png); }*/

#cmc_host_selection a:hover,
#cmc_host_selection a:focus,
#cmc_host_selection a:active,
#cmc_host_selection a.active {
  background-position: 0 -30px;
}

/* payload: container to receive ajax contents */
#payload_wrap {
  min-height: 350px;
}

#payload_wrap.nopadding {
  padding: 0;
  min-height: 150px;
}

#payload_wrap input.file {
  width: 500px;
}

#payload_wrap h1 {
  margin: 0;
  padding: 0;
  width: 100%;
}

#payload_wrap h2:first-child {
  padding-top: 0;
  margin-bottom: 15px;
  font-size: 24px;
}

.metanav {
  display: none; /* hidden by default */
/*
  width: 720px;
  color: #999;
  padding: 15px 0 0 0;
  margin: -70px 0 0 -5px;
  float: left;
*/
}

#payload_wrap.nopadding p {
  padding: 0;
}

label.disabled {
  color: #999;
  cursor: not-allowed;
}

/*** Login screen ***/
/* normale contiVIEW Login-Seite */
table.login td.intro {
  text-align: right;
  padding-right: 10px;
}

table.login td.intro img {
  position: relative;
  top: 3px;
}

/* CMC Login */
form.login label {
  white-space: nowrap;
}

/*** loading: "something is being loaded right now!" indicator ***/
#loading {
  display: none;
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 9999;
}

/*** Browse Navigation ***/
div.nav {
  width: 260px;
  color: #000;
}

div.nav.search {
  float: left;
}

div.nav h2 {
  font-size: 16px;
  font-weight: 300;
  padding: 15px 0 15px 10px;
  margin: -1px 0 0 0;
}

div.nav h2.sub {
  padding: 5px 0 5px 10px;
  margin: 0;
  width: 200px;
}

div.nav a         { text-decoration: none; font-size: 14px; }
div.nav a:link    { color: #000; }
div.nav a:visited { color: #000; }
div.nav a:hover   { color: #ffa500; }
div.nav a:focus   { color: #ffa500; }
div.nav a:active  { color: #ffa500; }
div.nav a.active  { color: #ffa500; }

div.nav h2, div.nav a {
  font-family: ContinentalStagSansLight;
  transition: all .5s ease-in-out 0s;
}

div.nav a.button { transition: none; }

div.nav div.nav_content { padding: 10px; }

div.nav input.searchterm { width: 100px; }

/* Defaults common to all links in the nav */
div.nav ul a {
  background-image: url(../img/layout/link_navi_closed_black.gif);
  background-position: 8px 11px;
  background-repeat: no-repeat;
  display: block;
  margin: 0;
  padding: 8px 4px 7px 18px;
  color: #000;
}

/** Layer 1 **/
div.nav ul    { list-style: none; padding: 0; margin: 0; width: 100%; }
div.nav ul li { padding: 0; margin: 0; }
div.nav ul li.empty { padding-left: 18px; }

div.nav ul a:hover, div.nav ul a:active, div.nav ul a.active {
  background-color: #ffa500;
  color: #000;
}

div.nav ul a.expanded {
  background-image: url(../img/layout/link_navi_open_black.gif);
}

/** Layer 2 **/
div.nav ul ul li { margin: 0; }

div.nav ul ul a:hover, div.nav ul ul a:active, div.nav ul ul a.active { background-color: #ffa500; }

div.nav                ul a:link { background-position:  8px 11px; padding: 7px 4px 6px 18px; } /* Layer 1 */
div.nav             ul ul a:link { background-position: 16px 11px; padding: 7px 4px 6px 26px; } /* Layer 2 */
div.nav          ul ul ul a:link { background-position: 24px 11px; padding: 7px 4px 6px 34px; } /* Layer 3 */
div.nav       ul ul ul ul a:link { background-position: 32px 11px; padding: 7px 4px 6px 42px; } /* Layer 4 */
div.nav    ul ul ul ul ul a:link { background-position: 40px 11px; padding: 7px 4px 6px 50px; } /* Layer 5 */
div.nav ul ul ul ul ul ul a:link { background-position: 48px 11px; padding: 7px 4px 6px 58px; } /* Layer 6 */

/* Im MedienCenter gibt es ein <ul> zu viel, also eine Ebene weniger einruecken */
div.nav li.top_level                ul a:link { background-position:  0px 11px; padding: 7px 4px 6px 10px; } /* Layer 1 */
div.nav li.top_level             ul ul a:link { background-position:  8px 11px; padding: 7px 4px 6px 18px; } /* Layer 2 */
div.nav li.top_level          ul ul ul a:link { background-position: 16px 11px; padding: 7px 4px 6px 26px; } /* Layer 3 */
div.nav li.top_level       ul ul ul ul a:link { background-position: 24px 11px; padding: 7px 4px 6px 34px; } /* Layer 4 */
div.nav li.top_level    ul ul ul ul ul a:link { background-position: 32px 11px; padding: 7px 4px 6px 42px; } /* Layer 5 */
div.nav li.top_level ul ul ul ul ul ul a:link { background-position: 40px 11px; padding: 7px 4px 6px 50px; } /* Layer 6 */

div.nav ul.filter li ul    { width: 200px; }
div.nav ul.filter div      { float: left; margin-right: 4px; }
div.nav ul.filter li       { clear: left; padding-top: 2px; padding-bottom: 3px; }
div.nav ul.filter li ul li { padding-left: 10px; }
div.nav ul.filter li ul ul { width: 190px; }

/** Optionsmenü unterhalb der Browse-Navigation **/
div.nav_button {
  margin: 20px 0;
  padding: 10px 9px 10px 10px;
  background-color: #fff;
  border: 1px solid #000;
  width: 190px;
  height: 28px;
}

div.nav_related                { padding: 8px 0;  }
div.nav_related div.nav_button { padding: 5px 9px 0px 10px; }

div.nav_button a:link, div.nav_button a:visited {
  color: #666 !important;
}

div.nav_button a:focus, div.nav_button a:active, div.nav_button a:hover, div.nav_button a.active {
  color: #000 !important;
}

/* Dito, aber mit mehreren Buttons */
div.nav_buttons {
  margin: 20px 0;
  background-color: #fff;
  border: 1px solid #000;
  width: 100%;
}

div.nav_buttons div.nav_button {
  margin: 0;
  border: none;
}

/* Etwas mehr padding im Formular der Live-Suche */
div.nav.search li {
  padding-left: 5px;
}

/* Schnellauswahl von Reifenart und Hersteller */
div.nav h2.toggle {
  background: url(../img/layout/icon_nav_expand.png) right 12px no-repeat;
  color: #000;
  border-bottom: 1px solid #6e6e6e;
}

div.nav h2.toggle.closed {
  background-position: right -25px;
}

div.nav h2.toggle.closed.opened { /* closed opened... yeah, I know... :) */
  background-position: right 14px;
}

div.nav h2.toggle:hover,
div.nav h2.toggle:focus,
div.nav h2.toggle:active,
div.nav h2.toggle.opened {
  background-color: #ffa500;
  border-color: #ffa500;
}

div.nav h2.toggle.last {
  border-bottom: none;
}

div.nav div.filter_toggle {
  width: 25px;
  height: 18px;
  background: url(../img/layout/nav_filter_toggle.gif) right 0px no-repeat;
}

div.nav div.filter_toggle.closed {
  background-position: right -35px;
}

div.nav ul.top_level {
  border-bottom: 1px solid #ccc;
}

/*** Sidebar ***/

div.sidebar {
  background-color: #363636;
  border: 1px solid #ababab;
  margin: 20px 0;
  padding: 40px 20px;
}

div.sidebar div.item {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #9c9d9d;
}

div.sidebar span.label {
  color: #ffa500;
}

div.sidebar span.value {
  color: white;
}

div.sidebar h2 {
  color: #fff;
  font-size: 28px;
  padding: 15px 0 0 0;
}

div.sidebar h3 {
  font-family: ContinentalStagSansLight;
  font-size: 20px;
}


/*** Display Selector ***/
div.doc_count {
  float: left;
  font-size: 18px;
}

div.format_selector, div.docs_per_page, div.get_url {
  float: right;
  margin-left: 20px;
}


/*** Sort selector (Title/ Date asc and desc) ***/
div.sortby a {
  padding: 0 20px 0 0;
  margin: 0 0 0 10px;
  background: url(../img/layout/icon_sortby.gif) top right no-repeat;
}

div.sortby a.desc {
  background-position: right -30px;
}
div.sortby a.asc {
  background-position: right -60px;
}

/* Sortable tables, design partially taken from blue tablesorter theme */
table.sortable thead th.sortby {
  background-image: url(../img/layout/icon_sortby_bg.gif);
  background-repeat: no-repeat;
  background-position: center right;
  cursor: pointer;
  padding-right: 15px;
}

table.sortable thead tr .headerSortUp {
  background-image: url(../img/layout/icon_sortby_asc.gif);
  background-color: #ffa500;
}

table.sortable thead tr .headerSortDown {
  background-image: url(../img/layout/icon_sortby_desc.gif);
  background-color: #ffa500;
}

/*** Count Selector (20/80/All)     ***/
/*** Format selector (Thumbs, List) ***/
div.metanav ul a {
  padding: 0px;
  margin-right: 5px;
  padding-left: 5px;
  color: #000;
}

div.metanav ul.row a {
  border-left: 1px solid #999;
}

div.metanav ul.row li:first-child a {
  border-left: none;
}

div.metanav ul a:focus,
div.metanav ul a:hover,
div.metanav ul a:active,
div.metanav ul a.active {
  color: #ffa500;
}

/*** Page Selector (<< - 1 - 2 - ... - 25 - >>) ***/
div.page_selector {
  margin: 8px auto 0 auto;
  height: 30px;
  text-align: center;
}

div.page_selector span {
  margin-right: 10px;
  background-color: #6e6e6e;
  border-radius: 20px;
  padding: 2px 10px;
  color: #000;
  text-decoration: none;
}


/** 2013 new button design **/
a.button {
  display: block;
  float: left;
  min-width: 7px; /* min-width + padding = 40px */
  min-height: 28px;
  background: url(../img/layout/button_default_2017.png) top left no-repeat;
  margin: 0 20px 0 0;
  padding: 12px 0 0 33px; /* height + padding = 40px */
  font-weight: normal !important;
}

a.button:link, a.button:visited {
  color: #ffa500;
}

a.button:focus, a.button:hover, a.button:active, a.button.active {
  background-position: left -40px;
  text-decoration: underline;
}

a.button.disabled {
  color: #999 !important;
  background-position: left -80px !important;
  text-decoration: none !important;
  cursor: not-allowed;
}

/* Button background image definition */
a.button.action_apply                  { background-image: url(../img/layout/button_apply_2017.png); }
a.button.action_add_media              { background-image: url(../img/layout/button_add_media_2017.png); }
a.button.action_add_video              { background-image: url(../img/layout/button_add_video_2017.png); }
a.button.action_archive                { background-image: url(../img/layout/button_archive_2017.png); }
a.button.action_calendar_contiview     { background-image: url(../img/layout/button_calendar_contiview_2017.png); }
a.button.action_calendar_extend        { background-image: url(../img/layout/button_calendar_extend_2017.png); }
a.button.action_cancel                 { background-image: url(../img/layout/button_cancel_2017.png); }
a.button.action_confirm                { background-image: url(../img/layout/button_confirm_2017.png); }
a.button.action_collect                { background-image: url(../img/layout/button_collect_2017.png); }
a.button.action_copy                   { background-image: url(../img/layout/button_copy_2017.png); }
a.button.action_create                 { background-image: url(../img/layout/button_create_2017.png); }
a.button.action_create_project         { background-image: url(../img/layout/button_create_project_2017.png); }
a.button.action_create_project_guest   { background-image: url(../img/layout/button_create_project_guest_2017.png); }
a.button.action_create_user            { background-image: url(../img/layout/button_create_user_2017.png); }
a.button.action_delete                 { background-image: url(../img/layout/button_delete_2017.png); }
a.button.action_download               { background-image: url(../img/layout/button_download_2017.png); }
a.button.action_link                   { background-image: url(../img/layout/button_link_2017.png); }
a.button.action_import                 { background-image: url(../img/layout/button_import_2017.png); }
a.button.action_move                   { background-image: url(../img/layout/button_move_2017.png); }
a.button.action_new_collection         { background-image: url(../img/layout/button_new_collection_2017.png); }
a.button.action_new_version            { background-image: url(../img/layout/button_new_version_2017.png); }
a.button.action_paste                  { background-image: url(../img/layout/button_paste_2017.png); }
a.button.action_publish                { background-image: url(../img/layout/button_publish_2017.png); }
a.button.action_remove                 { background-image: url(../img/layout/button_remove_2017.png); }
a.button.action_remove_media           { background-image: url(../img/layout/button_remove_media_2017.png); }
a.button.action_remove_video           { background-image: url(../img/layout/button_remove_video_2017.png); }
a.button.action_restore                { background-image: url(../img/layout/button_restore_2017.png); }
a.button.action_send                   { background-image: url(../img/layout/button_send_2017.png); }
a.button.action_show_all_users         { background-image: url(../img/layout/button_show_all_users_2017.png); }
a.button.action_sync                   { background-image: url(../img/layout/button_sync_2017.png); }
a.button.action_tirebase_evaluation    { background-image: url(../img/layout/button_tirebase_evaluation_2017.png); }
a.button.action_tirebase_export        { background-image: url(../img/layout/button_tirebase_export_2017.png); }
a.button.action_tirebase_factsheet     { background-image: url(../img/layout/button_tirebase_factsheet_2017.png); }
a.button.action_tirebase_link          { background-image: url(../img/layout/button_tirebase_link_2017.png); }
a.button.action_tirebase_unlink        { background-image: url(../img/layout/button_tirebase_unlink_2017.png); }
a.button.action_translate              { background-image: url(../img/layout/button_translate_2017.png); }
a.button.action_unarchive              { background-image: url(../img/layout/button_unarchive_2017.png); }
a.button.action_url                    { background-image: url(../img/layout/button_url_2017.png); }
a.button.action_video                  { background-image: url(../img/layout/button_video_2017.png); }
a.button.action_uncollect              { background-image: url(../img/layout/button_uncollect_2017.png); }
a.button.select_all                    { background-image: url(../img/layout/button_select_all_2017.png); }
a.button.deselect_all                  { background-image: url(../img/layout/button_deselect_all_2017.png); }
a.button.invert_selection              { background-image: url(../img/layout/button_invert_selection_2017.png); }
a.button.action_create_folder          { background-image: url(../img/layout/button_create_folder_2017.png); }
a.button.action_delete_folder          { background-image: url(../img/layout/button_delete_folder.png); }
a.button.action_move_folder            { background-image: url(../img/layout/button_move_folder_2017.png); }
a.button.action_rename_folder          { background-image: url(../img/layout/button_rename_folder_2017.png); }
a.button.action_dev                    { background-image: url(../img/layout/button_dev_2017.png); }
a.button.action_tirebase_add_filter    { background-image: url(../img/layout/button_create_2017.png); }
a.button.action_tirebase_remove_filter { background-image: url(../img/layout/button_remove_2017.png); }
a.button.action_tirebase_reset_filter  { background-image: url(../img/layout/button_restore_2017.png); }

/* Small/half-size buttons */
a.button.small {
  min-width: 7px; /* min-width + padding = 20px */
  min-height: 8px;
  background: url(../img/layout/button_small_default.png) top left no-repeat;
  margin: 0 5px 0 0;
  padding: 12px 0 0 13px; /* height + padding = 20px */
}

a.button.small:focus, a.button.small:hover, a.button.small:active, a.button.small.active {
  background-position: left -20px;
}

a.button.small.action_download { background-image: url(../img/layout/button_small_download.png); }

/* Inline buttons in an image tag */
a.button_inline img {
  border: none;
  width: 16px;
  height: 16px;
  margin: 0 2px;
  background: url(../img/layout/button_inline_info.png) top left no-repeat;
}

a.button_inline img:focus, a.button_inline img:hover, a.button_inline img:active, a.button_inline img.active {
  background-position: left -32px;
}

/* Buttons inside the navigation*/
div.nav_buttons_2013 {
  margin: 15px 0;
  padding: 2px 0;
  background-color: #fff;
  border: 1px solid #000;
}

div.nav_buttons_2013 a {
  margin-left: 8px;
  width: 169px; /* width + padding = 200px */
  float: none;
}

div.nav a.button:link, div.nav a.button:visited {
  color: #ffa500;
}

div.nav a.button:focus, div.nav a.button:hover, div.nav a.button:active, div.nav a.button.active {
  text-decoration: underline;
}

/* Overlay buttons */
.overlay div.buttons {
  position: absolute;
  top: 120px;
  right: 0px;
  width: 40px;
  min-height: 120px;
}

a.ol_button {
  display: block;
  width: 40px;
  height: 40px;
  color: transparent;
  overflow: hidden;
  margin-bottom: 6px;
}

a.ol_button:focus, a.ol_button:hover, a.ol_button:active {
  background-position: left -40px;
}

.overlay .main.block_ol a.action_close {
  background-position: left -80px !important;
  cursor: wait;
}

a.ol_button.action_collect  { background-image: url(../img/layout/button_ol_collect.png); }
a.ol_button.action_delete   { background-image: url(../img/layout/button_ol_delete.png); }
a.ol_button.action_download { background-image: url(../img/layout/button_ol_download.png); }
a.ol_button.action_edit     { background-image: url(../img/layout/button_ol_edit.png); }
a.ol_button.action_send     { background-image: url(../img/layout/button_ol_send.png); }
a.ol_button.action_url      { background-image: url(../img/layout/button_ol_url.png); }
a.ol_button.action_video    { background-image: url(../img/layout/button_ol_video.png); }
a.ol_button.action_dev      { background-image: url(../img/layout/button_ol_dev.png); }

/***** Overlays *****/
.overlay .main {
  position: absolute;
  display: none;
  padding: 10px;
  min-width: 350px;
  max-width: 950px;
  min-height: 50px;
  background: url(../img/layout/bg_grey_tile.jpeg) #e0e0e0;
  border: 20px solid #fff;
  z-index: 210;
}

.overlay .back {
  display: none;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 200;
  width: 100%;
  height: 100%;
  background-color: #333;
  opacity: 0;
}

.overlay .main.block_ol {
  cursor: wait;
}

.overlay a.action_close {
  position: absolute;
  top: 10px;
  right: 5px;
  display: block;
  width: 30px;
  height: 30px;
  background: url(../img/layout/icon_close.png) no-repeat;
}

.overlay a.action_close:hover,
.overlay a.action_close:focus,
.overlay a.action_close:active {
  background-position: 0 -30px;
}

.overlay div.dyn h1 {
  margin: -10px -10px 10px -10px;
  background-color: #ffa500;
  padding: 8px 45px 0px 10px;
  min-height: 45px;
}

.overlay div.dyn h1 img {
  position: relative;
  top: 2px;
}

.overlay div.doc_details div.dyn h1 {
  margin: 0 0 10px 0;
}

table td.key {
  font-weight: bold;
  background-color: #EDEDED;
  color: #000000;
  padding: 2px 3px 2px 5px;
  border-left: 5px solid #CCCCCC;
  vertical-align: top;
}

table td.label {
  padding-right: 10px;
  text-align: right;
}

table td.value {
  background-color: #EDEDED;
  color: #000;
  padding: 1px 2px 1px 3px;
  vertical-align: top;
}

table td.button_inline {
  line-height: 2em;
}

.overlay div.static {
  width: 600px;
}

.overlay div.small {
  width: 500px;
}

.overlay div.medium {
  width: 750px;
}

.overlay div.fullsize {
  width: 950px;
}

.overlay div.flexi {
  max-width: 950px;
}

.overlay div.news {
  width: 600px;
}

.overlay div.ctb {
  width: 990px;
  max-width: 990px;
  padding: 10px;
}

.overlay div.ctb div.nav {
  float: left;
}

.overlay div.ctb div.headline {
  float: right;
  width: 720px;
}

.overlay div.ctb div.payload {
  float: right;
  width: 720px;
}

/*
.overlay div.doc_details: See below
*/

.overlay div.image {
  padding: 10px;
}

.overlay div.image table.image {
  width: 450px;
}

.overlay div.mp_replacement {
  width: 320px;
  height: 240px;
  background-color: #ccc;
}

.overlay div.images {
  float: left;
  padding: 25px 0 0 25px;
  width: 180px;
  background-color: #fff;
  border: 1px solid #ffa500;
}

.overlay div.images .imgthumbs .title {
  display: none;
}

.overlay div.edit, .overlay div.delete {
  float: right;
  width: 730px;
}

.overlay .imgthumbs {
  float: none;
}

.overlay div.container {
  width: 710px;
  margin-bottom: 15px;
}

.overlay div.head, .overlay div.content {
  padding: 3px 5px 3px 10px;
}

.overlay div.content {
  background-color: #efefef;
  border: 1px solid #ccc;
}

.overlay div.head {
  border: 1px solid #ffa500;
  background: url(../img/layout/ol_head_bg.gif) right -36px no-repeat #000;
  color: #fff;
}

.overlay div.head.opened {
  background-position: right 4px;
  color: #fff;
}

.overlay div.head h2 {
  margin: 0;
  padding: 0;
  color: #fff;
}

.overlay div.con_green h2 { background: url(../img/layout/icon_status_green.gif) 0 3px; }
.overlay div.con_red   h2 { background: url(../img/layout/icon_status_red.gif)   0 3px; }

.overlay div.con_green h2, .overlay div.con_red h2 {
  background-repeat: no-repeat;
  padding-left: 20px;
}

.overlay div.prevnext span,
.overlay div.prevnext a.ol_button {
  display: block;
  width: 23px;
  height: 66px;
}

.overlay div.prevnext a.ol_button:focus,
.overlay div.prevnext a.ol_button:hover,
 .overlay div.prevnext a.ol_button:active,
 .overlay div.prevnext a.ol_button.active {
  background-position: left -66px;
}

.overlay div.prevnext .prev {
  position: absolute;
  top: 250px;
  left: -50px;
  background-image: url(../img/layout/button_ol_prev.png);
}

.overlay div.prevnext .next {
  position: absolute;
  top: 250px;
  right: -50px;
  background-image: url(../img/layout/button_ol_next.png);
}

.overlay div.prevnext.thumbnail_selection .prev {
  top: 152px;
}

.overlay div.prevnext.thumbnail_selection .next {
  top: 152px;
}

/**
 * TODO: Kann weg? Wurde evtl. nur genutzt für <div class="head toggle closed">
.overlay .closed {
  background-position: right -40px !important;
}
*/

.overlay .dyn table td.lang {
  width: 45%;
}

.overlay .dyn table td.eq {
  width: 10%;
}

.overlay table.languages input[type=checkbox] {
  margin-right: 10px;
}

.overlay table th, .overlay td {
  vertical-align: top;
  text-align: left;
}

.filename {
  font-family: Courier, monospace;
}

img.imgleft  { margin: 4px 15px 10px 0; padding: 0; float: left; }
img.imgright { margin: 0 10px 0 10px;   padding: 0; float: right; }

table.tags tr th {
  padding: 2px 10px 3px 0;
}

.overlay li {
  margin-bottom: 10px;
  margin-left: 15px;
  padding-left: 5px;
  border-left: 3px solid #ffa500;
}

.overlay div.nav li {
  border: none;
}

/*** Dokumente, Details-Dialog ***/

.overlay div.doc_details {
  width: 632px;
  background: #fff;
  border: 0;
  padding: 0;
}

.overlay div.doc_details div.msg {
  position: relative;
  left: 100px;
  width: 582px;
  background-color: #fff;
}

.overlay div.doc_details div.tabs_area {
  position: relative;
  top: 8px;
  width: 592px;
  min-height: 181px;
}

/* TODO: Fonts in Overlays anpassen? */
.overlay h2 {
  font-size: 24px;
}

/* Tabs formatting */
div.tabs_area ul.head li {
  height: 28px;
  border: none;
  float: left;
  padding: 0;
  margin: 0 5px 0 0;
  font-weight: bold;
}

div.tabs_area ul.head li.icons {
  float: right;
  margin-top: 0px;
  margin-right: 0px;
  height: 28px;
  width: 160px;
  padding-top: 3px;
  background-color: #b3b3b3;
}

div.tabs_area ul.head li.icons img {
  padding-left: 10px;
}

div.tabs_area ul.head a {
  display: block;
  padding: 6px 15px 14px 15px;
  color: #fff;
  background: url(../img/layout/doc_details_tabs_bg.png) center bottom no-repeat #000;
  transition: all .5s ease-in-out 0s;
}

div.tabs_area ul.head a:focus,
div.tabs_area ul.head a:active,
div.tabs_area ul.head a:hover,
div.tabs_area ul.head a.active {
  color: #000;
  background-color: #ffa500;
  background-image: url(../img/layout/doc_details_tabs_bg_active.png);
  text-decoration: none;
}

div.tabs_area div.tabs div.tab {
  margin-top: 20px;
  margin-left: 10px;
}

div.tabs_area div.tabs div.tab td {
  vertical-align: middle;
}

div.tabs_area div.tabs div.tab table td.value {
  background-color: transparent;
  padding: 0;
}

div.tabs_area div.tabs div.description {
  height: 57px; /* ~3 lines */
}


/** ACTION BUTTON **/
.action a, .action span {
  padding: 0 0 0 20px;
  margin: 0 5px 4px 0;
  font-family: ContinentalStagSansLight;
  font-size: 14px;
  height: 16px;
  width: auto !important;
  background: #ccc no-repeat 0 0;
  border: none;
  display: block;
}

.action a.assign     { background: url(../img/layout/index_assign.png) no-repeat; }
.action a.assign_all { background: url(../img/layout/index_assign_to_all.png) no-repeat; }
.action a.remove     { background: url(../img/layout/index_remove.png) no-repeat; }
.action a.multiply   { background: url(../img/layout/index_multiply_category.png) no-repeat; }
.action a.edit_tag   { background: url(../img/layout/index_edit.png) no-repeat; }
.action a.create     { width: 42px; background: url(../img/layout/index_create.png) no-repeat; }
.action a:hover      { height:16px; margin-bottom: 4px; background-position: 0 -16px; }
.action span {
  background-color: #efefef;
  border-color: #ccc;
}

/** Thumbnail view **/
div.imgthumbs {
  width: 160px;
  height: 226px;
  float: left;
  margin: 0px 15px 20px 0;
  background-color: #fff;
}

div.imgthumbs, div.imgthumbs a {
  font-size: 12px;
}

div.imgthumbs.item {
  position: relative;
}

.overlay div.imgthumbs {
  width: 160px;
  height: 190px;
  float: left;
  margin: 0px 15px 20px 0;
}

.overlay table.news div.imgthumbs {
  width: 144px;
  height: 144px;
  margin: 0px 10px 15px 0;
}

div.imgthumbs div.icon {
  position: absolute;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
}

/* Top right, project rooms only */
div.imgthumbs div.icon.comments      { top: 5px;   left: 140px; background-image: url(../img/layout/doc_imgthumb_icon_comments_2017.png); }
/* Bottom left */
div.imgthumbs div.icon.locked        { top: 140px; left:   3px; background-image: url(../img/layout/doc_imgthumb_icon_locked_2017.png); }
/* Top right, common and collections only; <img> instead of background */
div.imgthumbs div.icon.mediacenter   { top: 5px;   left: 140px; }
/* Bottom right */
div.imgthumbs div.icon.status        { top: 140px; left: 140px; background-image: url(../img/layout/doc_imgthumb_icon_status_green.png); }
div.imgthumbs div.icon.status.yellow {                          background-image: url(../img/layout/doc_imgthumb_icon_status_yellow.png); }
div.imgthumbs div.icon.status.red    {                          background-image: url(../img/layout/doc_imgthumb_icon_status_red.png); }
/* Top left */
div.imgthumbs div.icon.video         { top: 5px;   left:   3px; background-image: url(../img/layout/doc_imgthumb_icon_video_2017.png); }
/* (TireBase) Top right, left side of MediaCenter status icon */
div.imgthumbs div.icon.tirebase_inherited_apac { top: 5px;   left: 105px; width:30px; height:11px; background-image: url(../img/layout/doc_imgthumb_icon_tirebase_inherited_apac.png); }
div.imgthumbs div.icon.tirebase_inherited_emea { top: 5px;   left: 105px; width:30px; height:11px; background-image: url(../img/layout/doc_imgthumb_icon_tirebase_inherited_emea.png); }

div.imgthumbs .thumb img {
  vertical-align: middle;
}

div.imgthumbs .title {
  margin: 2px 3px 5px 3px;
  width: 154px;
  height: 60px;
  line-height: 1.2em;
}

.time_until_removal_color_green {
  color: #000;
}

.time_until_removal_color_yellow {
  color: #ffa500;
}

.time_until_removal_color_red {
  color: #d00;
}

div.imgthumbs .title div.checkbox {
  float: left;
  margin-right: 3px;
  height: 100%;
}

div.imgthumbs .title div.checkbox input {
  margin: 2px 0 0 0;
  padding: 0;
}

div.imgthumbs .title div.label {
  position: relative;
  height: 100%;
  overflow: hidden;
  overflow-wrap: break-word;
}

div.imgthumbs .title div.label div.fade {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/layout/fade_title_bottom.png) bottom right no-repeat;
}

div.imgthumbs .thumb {
  width: 160px;
  height: 160px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  padding: 0;
  margin: 0;
}

div.imgthumbs div.no_access {
  background-color: red;
}

div.tirebase_inherited_emea { background-color: #ffe3af; }
div.tirebase_inherited_apac { background-color: #b4daff; }

div.imgthumbs div.doc_mediacenter_button {
  position: absolute;
  top: 0px;
  left: 106px;
  width: 54px;
  height: 23px;
}

/** List view, more info than thumb view **/
#imglist div.item {
  position: relative;
  min-height: 160px;
  margin-bottom: 30px;
  border-bottom: 2px solid #666;
}

#imglist div.icon.status {
  top: 5px;
  right: 0;
}

#imglist div.item div.cell.details {
  min-height: 160px;
}

#imglist div.item div.thumb {
  display: block;
}

#imglist div.imgthumbs {
  background-color: transparent;
  height: auto;
}

#imglist .checker {
  width: 15px;
  padding-top: 70px;
  height: 90px !important;
}

#imglist .details table td.key {
  text-align: right;
  background-color: transparent;
  padding: 0 6px 0 0;
  border-left: none;
  font-weight: normal;
}
#imglist .details table td.key:after {
    content: ' :';
}
#imglist .details table td.value {
  padding: 0;
  background-color: transparent;
  word-break: break-all;
}

#imglist .details table td.value label {
  font-weight: bold;
}

#imglist .details table td.value a {
  font-weight: normal;
}

#imglist .details table td.value em {
  color: #9e979d;
}

/*** Old suggest ***/
div.suggest_legacy {
  position: relative;
}

div.suggest_legacy table {
  position: absolute;
  top: 25px;
  left: 0px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-bottom: none;
  min-width: 300px;
  z-index: 15;
}

table.suggest_legacy td {
  padding: 3px;
  padding-right: 0px;
  background-color: #fff;
  border-bottom: 1px dotted #ccc;
  width: 400px;
}

table.suggest_legacy td.action {
  padding-left: 2px;
  padding-right: 2px;
  border-bottom: 1px dotted #ccc;
  text-align: right;
  width: 20px;
}

table.suggest_legacy tr:focus td, table.suggest_legacy tr:hover td, table.suggest_legacy tr.active td {
  background-color: #ccc;
}


/*** Suggest boxes that magically appear on keyboard events ***/
div.suggest_output {
  display: none; /* Will be made visible via JS */
  position: relative;
  top: -5px;
  background-color: #fff;
  z-index: 150;
  border: 1px solid #000;
  padding: 10px;
  min-width: 450px;
}

div.suggest_output .suggest {
  margin: 0 -10px;
}

div.suggest_output .suggest.first_child {
  margin-top: -10px;
}

div.suggest_output .suggest.last_child {
  margin-bottom: -10px;
}

div.suggest_output .suggest li a {
  color:black;
  text-decoration: none;
}

div.suggest_output .suggest li {
  border: none;
  margin: 0;
  padding: 3px;
  padding-right: 12px;
  background: url(../img/layout/icon_suggest_assign.png) top right no-repeat;
}

div.suggest_output .suggest li.suggest_hide {
  background-image: none;
}

div.suggest_output .suggest li.active {
  cursor: pointer;
}

div.suggest_output .suggest li.active {
  background-color: #e4e4e4;
  background-position: right -39px;
  border-color: #e4e4e4;
  outline: 1px solid #ffa500;
}

span.deactivated { color:red; font-style:italic; }

/* feedback form */
table.feedback td {
  background-color: #ccc;
}

table.feedback td.answer {
  width: 45px;
  text-align: center;
  background-color: #ccc;
}

/* table with gray td background to create grid-like look */
table.grid {
  border-spacing: 1px;
  background-color: #ffffff;
}

table.grid th, table.grid td {
  background-color: #e4e4e4;
  padding: 1px 2px 1px 4px;
}

table.grid.nowrap th,
table.grid.nowrap td,
th.nowrap,
td.nowrap,
div.nowrap {
  white-space: nowrap;
}

table .numeric, table .right {
  white-space: nowrap;
  text-align: right;
}

table .center {
  white-space: nowrap;
  text-align: center;
}

/* options table */
table.options tr.option td      { vertical-align: middle; font-weight: bold; }
table.options tr.description td { }

/*** Box container view ***/
div.box {
  width:   152px;
  height:  152px;
  float:   left;
  border:  1px solid #999;
  margin:  0 10px 10px 0px;
  padding: 5px;
}

div.box.col2 { width: 326px; }
div.box.col3 { width: 500px; }
div.box.col4 { width: 674px; }
div.box.col5 { width: 848px; }

div.box.row2 { height: 326px; }
div.box.row3 { height: 500px; }

div.box p { padding-top: 0; }

div.box.disabled { color:#bbb; }
div.box.disabled p { font-size: 14px; }

div.box:hover, div.box:focus, div.box:active {
  border-color: #ffa500;
}

div.box a.box_details {
  font-size: 14px;
  display: block;
  line-height: 100%;
  padding-left: 30px;
  height: 25px;
  background: url(../img/layout/box_details.png) top left no-repeat;
}

div.box a.box_details:hover, div.box a.box_details:focus, div.box a.box_details:active {
  background-position: 0 -50px;
}

div.box div.thumbnail {
  height: 125px;
  margin-bottom: 4px;
  overflow: hidden;
}

/*** general classes ***/
div.bottom {
  clear: both;
}

.right {
  float: right;
}

td.center {
  text-align: center;
}

div.description {
  position: relative;
  overflow: hidden;
}

div.description div.fade {
  position: absolute;
  bottom: 0;
  right: 0;
  background: url(../img/layout/fade_text_bottom.png) bottom right no-repeat;
  width: 100%;
  height: 14px;
}

tr.borderline td {
  border-bottom: 2px solid #ffa500;
}

div.percent_filled {
  border: 1px inset #ffa500;
  width: 300px;
  height: 10px;
  margin-top: 2px;
  margin-right: 5px;
}

div.sidebar div.percent_filled { width: 215px; }

div.percent_filled img {
  position: relative;
  top: -3px;
}

div.help_viewi {
  float: right;
}

#download_action {
  visibility: hidden;
}

select.next_to_button {
  float: left;
  margin-top: 10px;
  margin-right: 5px;
}

select.success, select.success option {
  background-color: #0c0;
  color: #fff;
}

select.error, select.error option {
  background-color: #c00;
  color: #fff;
}

/* Simple farbig hervorgehobene Bereiche zB. für Meldungen in Dialogen. */
p.notice_success { padding: 15px; margin: 5px 0px 5px 0px; background-color: #bbeda7; }
p.notice_info    { padding: 15px; margin: 5px 0px 5px 0px; background-color: #c0deff; }
p.notice_warning { padding: 15px; margin: 5px 0px 5px 0px; background-color: #ffef9d; }
p.notice_danger  { padding: 15px; margin: 5px 0px 5px 0px; background-color: #fdd4d4; }

/* Import-Sammlung: Bei Dokumenten ohne Titel den Dateinamen (farbig) anzeigen. */
span.doc_without_title {
  color: #0080ff;
}

/* Dokumente, Details-Dialog: Kategorien mit untergeordneten Attributen (Synonyme usw.) kann man anklicken
 * und ein Overlay mit allen Details oeffnen. */
.doc_categories_path a:link    { color: black; text-decoration: none; border-bottom: 1px dashed #777777; }
.doc_categories_path a:visited { color: black; text-decoration: none; border-bottom: 1px dashed #777777; }
.doc_categories_path a:focus   { color: black; text-decoration: none; border-bottom: 1px solid  #777777; }
.doc_categories_path a:active  { color: black; text-decoration: none; border-bottom: 1px solid  #777777; }
.doc_categories_path a:hover   { color: black; text-decoration: none; border-bottom: 1px solid  #777777; }

/* Message containers */
div.msg {
  padding: 3px;
  margin-top: 5px;
  margin-bottom: 5px;
  border: 2px solid #c60;
}

p.msg {
  padding: 3px;
  margin-top: 5px;
  margin-bottom: 5px;
  border: 2px solid #c60;
}

div.error {
  font-weight: bold;
  border-color: #c00;
}

div.notice {
  border-color: #ffa500;
}

div.success {
  border-color: #0c0;
}

/* Search help table */
table.searchhelp    { border: 0px solid #666; margin: 10px 0 10px 0; padding: 3px; }
table.searchhelp th { font-weight: bold; vertical-align: top; padding: 5px 15px 5px 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; }
table.searchhelp td { vertical-align: top; padding: 5px 15px 5px 5px; border-bottom: 1px solid #ccc; border-left: 1px solid #ccc; }

/* Forms and input elements in general */

input[type=text], input[type=password], input[type=submit], input[type=reset], select, textarea {
  border: 2px solid transparent;
  background-color: #fff;
  outline: none; /* Prevent Chrome/Webkit browsers from applying their custom styling */
}

input[type=text], input[type=password] {
  text-align: left;
}

input[type=submit] {
  background-color: #ffa500;
}

input[type=reset] {
  padding-right: 30px;
  background: url(../img/layout/icon_input_abort.png) right top no-repeat #ccc;
}

input.search {
  padding-right: 30px;
  background: url(../img/layout/icon_search.png) right top no-repeat #fff;
}

textarea {
  border-radius: 10px;
}

input[type=text]:hover,
input[type=text]:focus,
input[type=text]:active,
input[type=password]:hover,
input[type=password]:focus,
input[type=password]:active,
select:hover,
select:focus,
select:active,
textarea:hover,
textarea:focus,
textarea:active {
  border-color: #ffa500;
}

input[type=submit]:hover,
input[type=submit]:focus,
input[type=submit]:active,
input[type=reset]:hover,
input[type=reset]:focus,
input[type=reset]:active {
  background-color: #6e6e6e;
  color: #fff;
}

input[type=checkbox]:hover,
input[type=checkbox]:focus,
input[type=checkbox]:active,
input[type=radio]:hover,
input[type=radio]:focus,
input[type=radio]:active {
  outline: 2px solid #ffa500;
}

input[disabled] {
  background-color: #6e6e6e;
  color: #fff;
  cursor: not-allowed;
}

td.intro div {
  margin: 5px 0 0 0;
}

input.date {
  width: 75px;
}

/* Textfeld für Resourcen-URLs */
input.text_resource_url {
  width: 500px;
}

input.suggest {
  margin-right: 10px;
  padding-right: 20px;
}

/*** Import ***/
#importarea {
  margin: 0;
  padding: 0;
  border: 0;
}

#importarea td {
  margin: 0;
  padding: 10px;
  vertical-align: top;
  border: 1px solid #999;
  width: 50%;
}

#importarea td.progress {
  font-weight: bold;
}

/*** File uploader ***/
.upload_drag_n_drop {
  margin-top: 15px;
  width: 320px;
  min-height: 200px;
  text-align: center;
  border: 1px solid #333;
  background: #ccf url(../img/layout/comfortuploadbg_wide.jpeg) no-repeat top left;
}

.upload_drag_n_drop:focus, .upload_drag_n_drop:hover {
  color: #ffa500;
  border-color: #ffa500;
}

#importarea table.filelist             { width: 100%; }
#importarea table.filelist th          { text-align: left; }
#importarea table.filelist td.size     { text-align: right; }
#importarea table.filelist td.activity { text-align: center; }
#importarea table.filelist td.progress { text-align: right; }

#importarea table.filelist td {
  padding: 2px;
  border: none;
  border-bottom: 1px solid #666;
  height: 18px;
}

tr.upload_error td {
  color: red;
  text-decoration: line-through;
}

.runtime_html5 {
  display: none;
}

/*** News ***/
table.news img.media {
  margin: 0 8px 5px 0;
}

table.news td.author {
  color: #aaa;
  white-space: nowrap;
}

span.news_published     { color: #000000; }
span.news_not_published { color: #0000FF; }
span.news_archived      { color: #FF0000; }

div.overlay table.news div.preview {
  left: 0;
  height: 260px;
}

div.overlay table.news div.preview a.play_video {
  top: 80px;
}

/*** News-Box container ***/
div.news_switch {
  text-align: center;
  margin-bottom: 10px;
}

div.news_switch a.active {
  text-decoration: underline;
}

div.newsbox {
  width:      325px;
  min-height: 300px;
  float:      left;
  padding:    5px;
  margin:     0 15px 10px 0px;
}

div.newsbox h2.category {
  border-bottom: 2px solid #000;
  margin: 0 -5px !important;
  text-align: right;
}

div.newsbox div.author {
  color: #aaa;
  white-space: nowrap;
  text-align: right;
  margin-bottom: 5px;
}

div.newsbox p { padding-top: 0; }

/* Slideshow preview in news-list */
div.newsbox a.play_video {
  left: 100px;
  top: 60px; /* default; can be overwritten by JS */
}

/* Admin-News (in der Sidebar) */
div.sidebar table.news {
  border-collapse: collapse;
}

div.sidebar table.news td {
  color: #bbbbbb;
  line-height: 120%;
  padding: 0;
}

div.sidebar table.news td h3 {
  color: #dddddd;
}

#nav div.sidebar table.news a {
  color: #ffa500;
  white-space: nowrap;
}

/*** Projects ***/

table.project_home             { width: 100%; }
table.project_home td          { width: 50%; vertical-align: top; padding-bottom: 20px; }
table.project_home td span.grp { color: #888888; }

table.edit_project_users td           { vertical-align: middle; }
table.edit_project_users td.action    { padding-left: 30px; }
table.edit_project_users td.user_name { white-space: nowrap; }

table.edit_project_users td.user_name span.user_projectgroup {
  color: #aaaaaa;
  font-style: italic;
}

table.project_doc_versions               { padding-top: 10px; }
table.project_doc_versions td            { color: #888888; padding: 3px; }
table.project_doc_versions td span.value { color: #000000; }

table.project_doc_comments                      { width: 90%; }
table.project_doc_comments th                   { border-bottom: 1px solid black; }
table.project_doc_comments td                   { padding-bottom: 10px; max-width: 340px; overflow: auto; }
table.project_doc_comments td span.comment_info    { color: #888888; white-space: nowrap; }
table.project_doc_comments td span.comment_deleted { font-style: italic; }
table.project_doc_comments td span.comment_text    { }

textarea.comment { width: 325px; height: 250px; }

input.project_category_selection {
  font-weight: bold;
  color: #B96200;
  background-color: white;
  border: 0px;
  margin: 0px;
  padding: 0px;
}

input.project_category_selection:hover {
  color: #ffa500;
}

td.admincenter_projects_status_active   { color: green }
td.admincenter_projects_status_archived { color: #0080FF }

/* Content Nav, mainly used for projects */
div.content_nav li {
  height: 28px;
  padding-right: 8px;
  padding-top: 12px;
}

div.content_nav li.button {
  padding-top: 0;
}

div.content_nav li.button a.button {
  position: relative;
  top: -12px;
}

div.content_nav ul.right li {
  padding-right: 0;
  padding-left: 8px;
}

div.content_nav li.title {
  color: #9e979d;
}


/*** MedienCenter Login ***/
textarea.cmc_register_terms {
  font-family: Arial;
  background-color: #fff;
}

/*** Admincenter --> MediaCenter ***/

table.cmc_hosts th, table.cmc_hosts td {
  vertical-align: top;
  text-align: left;
}

table.cmc_hosts td.left  { width: 60%; }
table.cmc_hosts td.right { width: 40%; }

/*** Abonnierte Kategorien ***/

div.category_subscription_time {
  padding: 10px;
}

div.category_subscription_time div.time {
  font-weight: bold;
}

ul.category_subscription_time li {
  border-left: 0px;
  margin-bottom: 5px;
}

ul.category_subscription_time li label {
  font-weight: bold;
  padding-left: 5px;
}

ul.category_subscription_time li label span.time {
  font-weight: normal;
  color: #9e979d;
  padding-left: 5px;
}

/*** Event-Kalender ***/

table.list_normal td.date       { width: 145px; }
table.list_normal td.event_type { width:  96px; }
table.list_normal td.divisions  { width:  80px; }
table.list_normal td.title      { width: 236px; }
table.list_normal td.location   { width: 135px; }

table.list_extended td.begin      { width:  68px; }
table.list_extended td.end        { width:  68px; }
table.list_extended td.event_type { width: 100px; }
table.list_extended td.customer   { width:  66px; }
table.list_extended td.title      { width: 150px; }
table.list_extended td.location   { width:  80px; }
table.list_extended td.country    { width:  93px; }
table.list_extended td.region     { width:  86px; }
table.list_extended td.manager    { width: 125px; }
table.list_extended td.groups     { width:  80px; }
table.list_extended td.divisions  { width:  80px; }
table.list_extended td.notes      { width: 100px; }

td.no_approval a:link    { color:red; }
td.no_approval a:visited { color:red; }

/*** Dokumente, Details-Dialog, verknüpfte Dokumente ***/

table.bundled_docs { margin-left: 15px; }

table.bundled_docs td.header { border-bottom: 1px solid black; font-weight: bold; }
table.bundled_docs td.footer { border-top: 1px solid black; text-align:right; }

/*** Dokumente, Download-Dialog ***/

table.download {
  border-spacing: 0px;
}

table.download td {
  vertical-align: middle;
  padding: 0px 10px 0px 10px;
}

table.download tr.main_title td {
  background-color: #e6ebf7;
  padding: 10px 10px 0px 10px;
}

table.download tr.main_file td {
  background-color: #e6ebf7;
  padding: 2px 10px 10px 10px;
}

table.download tr.description td {
  padding-bottom: 8px;
}

table.download tr.file td {
  padding-bottom: 2px;
}

/*** (Video) Metadaten Tabelle ***/

table.metadata { width: 100%; }

table.metadata th {
  padding-top: 10px;
  border-bottom: 1px solid black;
}

table.metadata td.label {
  background-color: transparent;
  font-weight: bold;
  padding: 0px 5px 0px 0px;
}

table.metadata td.value {
  background-color: transparent;
  width: 100%;
  padding: 0px;
}

/*** Admincenter, Benutzerverwaltung, Suche ***/

table.user_search_filter td.label {
  font-weight: bold;
}

table.user_search_filter td.delim {
  padding-left: 20px;
}

table.user_search_filter td.last_name code, table.user_search_filter td.last_name a {
  padding: 0 2px;
  border: 1px solid #ccc;
  background-color: #ddd;
  font: 10pt 'Bitstream Vera Sans Mono','Courier',monospace;
  font-weight: bold;
}

table.user_search_filter td.last_name a {
  background-color: #eee;
}


/*** Verschiedenes ***/

img.datepicker {
  position: relative;
  top: 5px;
  cursor: pointer;
}

a.description {
  text-decoration: none;
  color: black;
}

/*** Solr debug ***/

div.solr_debug {
  background-color: white;
  white-space: nowrap;
  font-family: monospace;
}

table.solr_debug {
  margin: 10px 0px 10px 0px;
  border-spacing: 0px;
  background-color: white;
  border: 1px solid black;
}

table.solr_debug td, table.solr_debug th {
  font-family: monospace;
}

table.solr_debug td.field {
  font-weight: bold;
  text-align: right;
  vertical-align: top;
}

table.solr_debug td.field.left {
  text-align: left;
}

table.solr_debug td.value pre {
  margin: 0px;
}

table.solr_debug td.timing {
  text-align: right;
}

div.solr_debug td {
  vertical-align: top;
}

/*** filetype summary ***/

div.doc_summary {
  margin: 2px 0px 2px 0px;
}

div.doc_summary td {
  vertical-align: middle;
  padding: 0px;
}

div.doc_summary td.size {
  text-align: right;
}

div.doc_summary td.name, div.doc_summary td.date, div.doc_summary td.additional {
  padding-left: 5px;
}

div.filetype {
  border-left: 10px solid #808080;
  font-weight: bold;
  font-family: ContinentalStagSansLight;
  text-transform: uppercase;
  background-color: black;
  color: white;
  width: 65px;
  padding: 4px 0px 2px 5px;
  overflow: hidden;
}

table.grid td.filetype {
  padding: 0;
}

div.filetype_list {
  margin-bottom: 5px;
}

div.filetype_list div.filetype {
  float: left;
  margin-right: 2px;
  margin-bottom: 5px;
}

div.filetype.audio   { border-color: #ed1e79; }
div.filetype.video   { border-color: #8cc63f; }
div.filetype.bitmap  { border-color: #ff9900; }
div.filetype.vector  { border-color: #fcee21; }
div.filetype.archive { border-color: #93278f; }
div.filetype.office  { border-color: #0071bc; }
div.filetype.pdf     { border-color: #c1272d; }
div.filetype.text    { border-color: #79b6ff; }

a.filetype:link    { text-decoration: none; }
a.filetype:visited { text-decoration: none; }
a.filetype:hover   { text-decoration: none; }
a.filetype:active  { text-decoration: none; }
a.filetype:focus   { text-decoration: none; }

/*** Preview slideshows ***/
div.preview {
  position: relative;
  width: 300px;
  height: 300px;
  background-color: #fff;
}

div.overlay div.preview {
  width: 592px;
  height: 444px;
  margin-bottom: 20px;
}

div.overlay table.projects div.preview {
  left: 0;
  width: 100%;
}

div.overlay table.projects div.summary {
  margin-top: 10px;
}

div.preview_dummy {
  width: 592px;
  height: 444px;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

div.preview_slideshow {
  position: absolute;
  /* top and left will be dynamically set on the server-side */
}

div.preview_slideshow img {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

a.play_video {
  position: absolute;
  left: 250px;
  top: 170px;
  display: block;
  width: 100px;
  height: 100px;
  background: url(../img/layout/play_video.png) top left no-repeat;
  opacity: 0.5;
}

a.play_video:hover, a.play_video:focus, a.play_video:active {
  background-position: left -100px;
}

span.old_value { color: white;  background-color: rgb(255, 143, 0); }
span.new_value { color: white;  background-color: blue; }
span.red { color: red; }

/*** TireBase ***/
div.tirebase_filter {
  padding: 3px;
  margin-bottom:8px;
  background-color: #000;
  color: #fff;
}

div.tirebase_filter table.filter td {
  padding: 0px;
}

div.tirebase_filter table.filter td.selection {
  padding: 0px 20px 0px 0px;
}

div.tirebase_filter table.filter td.region_filter {
  padding-left: 5px;
  padding-right: 20px;
  font-weight: bold;
}

div.tirebase_filter table.filter td.region_filter div.disabled {
  color: #aaa;
}

div.tirebase_filter table.filter td.region_filter div.selected {
  color: white;
}

div.tirebase_filter table.filter td.region_filter div.clickable a:focus,
div.tirebase_filter table.filter td.region_filter div.clickable a:hover,
div.tirebase_filter table.filter td.region_filter div.clickable a:active,
div.tirebase_filter table.filter td.region_filter div.clickable a {
  color: #777;
  font-weight: bold;
  font-size: 16px;
}

div.tirebase_filter table.filter td span.hint {
  color: #999;
  font-size: 12px;
}

div.tirebase_filter_buttons {
  margin-bottom: 20px;
}

div.tirebase_family_text_block {
  border: 1px solid black;
  padding: 5px;
  margin-bottom: 20px;
}

div.tirebase_family_text_block div.title {
  border-bottom: 1px solid #ccc;
  font-weight: bold;
  font-size: 11pt;
}

div.tirebase_family_text_block div.title span.locale {
  font-family: monospace;
  font-size: 8pt;
  font-weight: normal;
  padding: 1px 3px;
  color: white;
  background-color: #bbb;
  vertical-align: top;
  border-radius: 5px;
}

div.box div.tirebase_family_text_block {
  font-size: 7pt;
  border: 0px;
  padding: 0px;
  margin-bottom: 3px;
}

div.box div.tirebase_family_text_block div.title {
  font-size: 7pt;
  border: 0px;
}

div.tirebase_family_text_block div.text {
  padding: 5px 0px 5px 0px;
}

div.box div.tirebase_family_text_block div.text {
  padding: 0px;
}

div.tirebase_family_text_block ol, div.tirebase_family_text_block ul {
  padding: 0px 0px 0px 20px;
  margin: 5px 0px 5px 0px;
}

div.tirebase_family_text_block ol li, div.tirebase_family_text_block ul li {
  border: 0px;
  padding: 0px;
  margin: 0px;
}

div.tirebase_family_text_block ol li { list-style-type: decimal; }
div.tirebase_family_text_block ul li { list-style-type: disc; }

a.badge {
  font-size: 8pt;
  font-weight: normal;
  padding: 1px 4px;
  color: white;
  background-color: #bbb;
  border-radius: 8px;
}

a.badge.red        { background-color: #FF0000; }
a.badge.green      { background-color: #149902; }
a.badge.yellow     { background-color: #ffa500; }
a.badge.lightgreen { background-color: #00FF00; color: black; }
a.badge.lightgray  { background-color: #C8C8C8; }
a.badge.import_ft1 { background-color: #999999; color: white; }
a.badge.import_ft2 { background-color: #999999; color: white; }
a.badge.import_ft3 { background-color: #999999; color: white; }

a.badge:link    { text-decoration: none; }
a.badge:visited { text-decoration: none; }
a.badge:hover   { text-decoration: none; }
a.badge:active  { text-decoration: none; }
a.badge:focus   { text-decoration: none; }

td.doc_types_per_market.grey   { background-color: #bfbfbf; }
td.doc_types_per_market.green  { background-color: #90ff4d; }
td.doc_types_per_market.yellow { background-color: #ffec15; }
td.doc_types_per_market.red    { background-color: #ff4343; }

table.grid .tirebase_black_border { border-left: 2px solid gray; padding-left: 0px; padding-right: 0px; }

table.grid td.central_language { background-color: #303030; }
table.grid th.central_language { background-color: #303030; color: white; }

a.tirebase_brand_info {
  padding: 2px 0 2px 22px;
  background: url(../img/layout/icon_expand.png) left 0px no-repeat;
}

a.tirebase_brand_info.expanded {
  background: url(../img/layout/icon_expand.png) left -39px no-repeat;
}

/*** Search Tabs  ***/
#search_tabs {
  margin-top: -20px;
  height: 51px;
  background-color: #fff;
}

#search_tabs a {
  margin: 0 -1px;
  position: relative;
  display: block;
  padding: 15px;
  color: #000;
  text-decoration: none;
  transition: all .5s ease-in-out 0s;
}

#search_tabs a:focus,
#search_tabs a:hover,
#search_tabs a:active,
#search_tabs a.active {
  background-color: #ffa500;
}

#search_tabs a::after {
  content: "";
  position: absolute;
  right: 0;
  width: 1px;
  height: 41.2%;
  top: 29.4%;
  background-color: #9c9d9d;
  transition: .5s;
}

#search_tabs li:last-child a::after {
  width: 0;
}

#search_tabs a:focus::after,
#search_tabs a:hover::after,
#search_tabs a:active::after,
#search_tabs a.active::after {
  background-color: #ffa500;
}


/*** Suchergebnisse  ***/
.searchresults-highlighting em {
  background-color: rgba(239, 187, 0, 0.25);
  border: 1px solid transparent;
  border-radius: 4px;
  border-width: 1px 3px 1px 3px;
  font-style: normal;
}

.searchresults.docs table.doc_summary td {
  text-align: left;
  vertical-align: middle;
  padding: 0px;
  font-size: 11pt;
}

.searchresults.docs table.doc_summary td.thumbnail {
  text-align: left;
  vertical-align: top;
  padding-right: 5px;
  min-width: 150px;
  min-height: 100px;
}

.searchresults.docs table.doc_summary td.title {
  width: 100%;
  font-size: 12pt;
  font-weight: bold;
}

.searchresults.docs table.doc_summary td.title a.badge {
  font-size: 10pt;
  padding-top: 2px;
  padding-bottom: 1px;
}

.searchresults.docs table.doc_summary td.type {
}

.searchresults.docs table.doc_summary td.size {
  text-align: right;
}

.searchresults.docs table.doc_summary td.name,
.searchresults.docs table.doc_summary td.date {
  padding-left: 5px;
}

.searchresults.docs table.doc_summary td.tags {
  padding-left: 5px;
  font-size: 10pt !important;
  color: #000 !important;
  font-weight: normal !important;
}

.searchresults.docs table.doc_summary td.tags a:link,
.searchresults.docs table.doc_summary td.tags a:visited,
.searchresults.docs table.doc_summary td.tags a:focus,
.searchresults.docs table.doc_summary td.tags a:active,
.searchresults.docs table.doc_summary td.tags a:hover,
.searchresults.docs table.doc_summary td.tags a.active {
  font-size: 10pt !important;
  color: #000 !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

.searchresults.docs table.doc_summary td.name {
  width: 100%;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  /*white-space: nowrap;*/
  word-break: break-word;
}

.searchresults.docs table.doc_summary td.description {
  font-size: 9pt;
}

.searchresults.docs table.doc_summary td.content {
  font-size: 8pt;
}

.searchresults.docs table.doc_summary td.generic_small {
  padding-left: 5px;
  font-size: 10pt;
}

.searchresults.docs table.doc_summary td.comment {
  padding-top: 10px;
  padding-left: 5px;
  font-size: 10pt;
}

.searchresults.docs table.doc_summary td.comment .comment_block {
  background-color: white;
  border-radius: 5px;
  padding: 5px;
}

.searchresults.docs table.doc_summary td.comment .comment_block .comment_header {
  font-weight: bold;
  border-bottom: 1px solid black;
  margin-bottom: 5px;
}

.searchresults.docs table.doc_summary td.comment .comment_block .comment_text {
}

.searchresults.docs div.doc_box_thumbnail div.doc_box_mode3_footer {
  position: absolute;
  bottom: 0px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  background: rgba(0, 0, 0, 0.5);
  color: white;
  font-size: 8pt;
}

.searchresults.docs div.doc_box_thumbnail div.doc_box_mode5_footer {
  position: absolute;
  bottom: 0px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  background: rgba(0, 0, 0, 0.5);
  color: white;
  font-size: 7pt;
}

.searchresults.docs div.doc_box_mode2 {
  border: 1px solid black;
}

.searchresults.docs div.doc_box_mode2 div.doc_box_thumbnail {
  float: left;
  margin-right: 5px;
}

.searchresults.docs div.doc_box_mode2 div.doc_box_content_div {
  vertical-align: top;
  overflow: hidden;
}

.searchresults.docs div.doc_box_mode2 div.doc_box_content_div div.doc_box_content_title {
  white-space: nowrap;
  margin-top: 3px;
}

.searchresults.docs div.doc_box_mode2 div.doc_box_content_div div.doc_box_content_description {
}

.searchresults.docs div.doc_box_mode2 div.doc_box_content_div div.doc_box_content_content {
  font-size: 7pt;
  margin-top: 5px;
}

.searchresults.docs div.doc_box_mode2 div.doc_box_mode2_doc_summary {
  overflow: hidden;
}

.searchresults.docs div.doc_box_mode4_preview {
  position: relative;
}

.main_search_header_mode_selection {
  float: left;
  margin-right: 50px;
}

.main_search_header_pager_and_sort {
  margin-top: 10px;
}

.main_search_pager {
  font-size: 14px;
  white-space: nowrap;
}

.main_search_sort {
  font-size: 14px;
  white-space: nowrap;
}

.main_search_sort_button {
  cursor: pointer;
  margin-right: 15px;
}

.main_search_option {
  cursor: pointer;
}

.main_search_option.selected {
  font-weight: bold;
}

.main_search_option.search_page {
  border: 1px solid #ccc;
  color: black;
  background-color: white;
  padding: 2px 4px 0px 4px;
}

.main_search_option.search_page.selected {
  color: white;
  background-color: black;
}

.main_search_mode_subselection {
  text-align: center;
  margin-top: 15px;
  margin-bottom: : 5px;
}

.main_search_mode_subselection .main_search_option {
  color: #B96200;
}

.main_search_mode_subselection .main_search_option.selected {
  text-decoration: underline;
}

.main_search_num_docs_found {
  font-size: 14px;
  font-style: italic;
}

.main_search_filters_row {
  font-size: 14px;
}

.main_search_filters_row .main_search_filter_label {
  font-weight: bold;
}

.main_search_filters_row .main_search_filter_selection {
  margin-right: 20px;
}

.main_search_filters_row .main_search_filter_selection select.main_search_filter {
  font-size: 14px;
  height: 20px;
  line-height: 20px;
}

.main_search_filters_row .main_search_filters_reset {
  height: 20px;
  line-height: 20px;
}

.masonry-grid-item75 {
  width:  75px;
  margin-bottom: 2px;
}

.masonry-grid-item150 {
  width: 150px;
  margin-bottom: 2px;
}

.masonry-grid-item450 {
  width: 450px;
  margin-bottom: 10px;
}

#viewi {
  position: absolute;
  top: 0;
  left: 1000px; /* Wird in JS noch auf rechten Rand angepasst */
  width: 450px;
  height: 349px;
  background: url(../img/layout/viewi_und_schnippi_animation_klein.gif);
  z-index: 5000;
}

#head.main #qseal img {
  width: 146px;
  height: 26px;
  margin-top: 10px;
}
#imglist div.item div.thumb img {
  display: block;
  max-width: 200px;
  max-height: 300px;
  padding-bottom: 10px;
}

.masonry-grid-item450 {
    width: 550px !important;
    margin-bottom: 20px !important;
}

div.imgthumbs .thumb{
  display: flex;
  align-items:center;
  justify-content: center;
}

div.imgthumbs a{
  width:100%;
}


div.preview_dummy
{
  display: flex;
  align-items:center;
  justify-content: center;


}

.preview_dummy > img
{

  height: auto !important;

}

*::-ms-backdrop, .payload table .minimise{ max-height:200px;}

.desc-text{
  font-size: 14px;
  padding-bottom: 1rem
}
.pagination{ 
  border-top: 1px solid #000000;
  margin: 10px 0px;
  padding-top: 10px;
}
.pagination.line-bottom{
  border-top: 0px solid #000000;
  border-bottom: 1px solid #000000;
  padding-top: 0px;
  padding-bottom: 10px;
}
.pagination ul{display:flex;}
.pagination ul li{
  border: 1px solid #ccc !important;
  color: black;
  background-color: white;
  padding: 2px 4px 0px 4px !important;
  margin:0px 2px;
  font-size:14px;
}
.pagination ul li a{
  font-size:14px;
}
.pagination ul li:first-child{padding-left:0px; background:transparent; border:0px;}
.pagination ul li.active{
  color: #ffffff;
  background-color: #000000;
}
