@charset "UTF-8";
@font-face {
  font-family: 'Effra';
  font-style: normal;
  font-weight: 400;
  src: 
        url('../defs/Effra_W_Rg.woff2') format('woff2'),
        url('../defs/Effra_W_Rg.woff') format('woff');
}
@font-face {
  font-family: 'Effra';
  font-style: bold;
  font-weight: 700;
  src: 
        url('../defs/Effra_W_Bd.woff2') format('woff2'),
        url('../defs/Effra_W_Bd.woff') format('woff');
}
@font-face {
  font-family: 'TT_Travels';
  font-style: bolder;
  font-weight: 900;
  src: 
        url('../defs/TT_Travels_Text_ExtraBold.woff2') format('woff2'),
        url('../defs/TT_Travels_Text_ExtraBold.woff') format('woff');
}

:root {
  --TOB-Petrol: #197278;
  --tob-petrol-90: #308085;
  --TOB-Grn: #00BB31;
  --tob-grn-10: #D1F0D8;
  --tob-grn-20: #A5E2B2;
}

retouroverlhtml, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, 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,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video , table, tr, td , * , .menuUnderl {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 18px;
  line-height: 24px;
  font-family: Effra;
  color: #3C3C3C;
  vertical-align: baseline; 
}
html, body {
  background-color: #ffffff;
  height: 100%;
  width: 100%; 
}

/* CONTENT */
 
hr {
  height: 1px;
  color: var(--tob-grn-10);
  background-color: var(--tob-grn-10);
  margin-top: 12px;
  margin-bottom: 12px;
}
ol, ul {
  list-style: none; 
}
a , a * {
  color: var(--TOB-Petrol);
  text-decoration: none;
}
#content a {
  text-decoration: underline;
}
a:hover {
  color: var(--TOB-Petrol);
}
.tobTable-a * {
  color: var(--TOB-Petrol);
}
h1 , h2 , h3 , .headerunderline , .headerunderlineoutput , .headerunderline_line {
  font-family: TT_Travels;
}
h1 , h2 {
  font-size: 32px;
  line-height: 40px;
  font-weight: bold;
  margin-bottom: 20px; 
  padding-top: 32px; 
  color: var(--TOB-Petrol);
}

h3 {
  font-size: 20px;
  margin-bottom: 10px; 
  font-family: Effra;
  text-transform: uppercase;
  color: var(--TOB-Petrol);
}

li, p {
  margin-bottom: 20px;
}
p.intro {
  font-size: 28px;
  line-height: 36px;
  padding: 24px 0 0 0;
}

#content li {
  list-style-image: url('/images/bg_spacer/bull.svg'); 
  padding-left: 5px;
  margin-left: 35px;
  margin-bottom: 10px;
}
#content ul {
  margin-bottom: 25px;
}
#content li li {
  list-style: disc;
  margin-top: 10px;
}
.tob-text-gf {
  display: grid;
  width: 100%;
  grid-template-columns: 175px 1fr;
  gap: 40px;
}
.tob-text-ta {
  display: grid;
  width: 100%;
  grid-template-columns: 2fr 1fr;
}
.tob-text-td {
  margin: auto 0; 
}
.tob-text-td + .right {
  text-align: right;
}
.bluebox {
  background: var(--tob-grn-10) url(/images/bg_spacer/inhbg.svg) center center / cover no-repeat;
  color: var(--TOB-Petrol);
  padding: 30px 60px 30px 60px;
  border-radius: 10px;
  text-align: center;
  margin: 50px 0;
}
.bluebox h2 , .bluebox h3 {
  text-align: center;
}
.bluebox * {
  color: var(--TOB-Petrol);
  padding-top: 0;
  margin-top: 0;
}
.bluebox img {
  border-radius: 8px;
}
.bluebox.dark {
  background: var(--TOB-Petrol) url(/images/bg_spacer/headerline_bg.svg) center center / cover no-repeat;
  color: white;
}
.bluebox.dark * {
  color: white;
}
.bluebox.dark h1 , .bluebox.dark h2 , .bluebox.dark h3 , .bluebox.dark p {
  max-width: 60%;
  text-align: center;
  margin: auto;
}
.inhaltsverz {
  background: var(--tob-grn-10) url(/images/bg_spacer/inhbg.svg) center center / cover no-repeat;
  padding: 10px 30px 20px 30px;
}
#inh_toggle {
  text-align: center;
  color: var(--TOB-Petrol);
}
#inh_list {
  /*display: none;*/
}
#content .inhaltsverz a {
  background: white;
  background-image: url('/images/bg_spacer/pluspetr.svg');
  background-position: right 20px top 50%;
  background-repeat: no-repeat;
  display: block;
  margin: 10px 30px;
  padding: 10px;
  padding-right: 50px;
  text-decoration: none;
}
.simpleDatepicker {
  border: 0;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important; 
}
#content img.infoicon {
  width: 27px!important;
  height: 27px!important;
}
.info {
  border: 1px solid var(--tob-grn-20);
  color: var(--TOB-Petrol);
  padding: 10px;
  text-align: center;
  margin: 25px 0;
  background: #E1F7E4;
  display: block; 
  border-radius: 16px;
}
.orderinfo {
  border: 1px solid #cccccc;
  border-radius: 16px;
  padding: 30px 50px;
  margin-top: 00px;
  margin-bottom: 30px;
  display: block; 
  text-align: center;
}
.orderinfo a {
  display: block;
}
.error {
  border: 1px solid #cd0a0a;
  color: #cd0a0a;
  padding: 10px;
  text-align: left;
  margin-top: 10px;
  margin-bottom: 10px;
  background: #FFE9E9;
  display: block; 
}
.nowidth {
  width: auto! important;
  overflow: hidden;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both; 
}
.logoutl {
  width: 105px;
  padding: 7px 5px;
  background-position: 90px center; 
}
.placeholder {
  color: var(--tob-petrol-90); 
}
.red {
  color: red; 
}
.bold {
  font-weight: bold; 
}
.wideWrapper.footer {
  background: var(--TOB-Petrol) url('/images/bg_spacer/footerbg.svg') no-repeat center top;
  padding-top: 30px;
  padding-bottom: 50px;
  margin-top: 100px;
}
.innerWrapper.footer {
  margin: auto;
  display: flex;
  justify-content: space-between;
  gap: 50px;
}
.footer *  {
  font-size: 1em;
  color: white;
}
.footer .contactblock {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  margin-top: 100px;
}
.footer .fcontact {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.footer .fcont a , .footer .phone > a {
  text-decoration: underline;
}
.footer .faddr , .footer .fcont {
  line-height: 30px;
}
.hotlineblock {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  gap: 33px;
}
.hotlineblock .phone {
  text-align: center;
  width: 415px;
  height: 122px;
  padding: 50px 0;
}
.hotlineblock .phone > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  justify-content: space-between;
}
.hotlineblock .phone a {
  font-size: 28px;
  font-family: TT_Travels;
}
.hotlineblock .phone {
  background: var(--tob-petrol-90);
  color: white;
}
.hotlineblock .phone:hover , .hotlineblock .phone:hover * {
  background: white;
  color: var(--TOB-Petrol);
}
.hotlineblock .phone .phonelink {
  display: inline-block;
}
.hotlineblock .phone:hover .phonelink {
  text-decoration: underline!important;
  text-decoration-thickness: 3px!important;
  text-underline-offset: 6px;
}
.hotlineblock .phone .img {
  background: url('/images/bg_spacer/phonewhite.svg') center no-repeat;
  height: 45px;
  width: 44px;
  padding-bottom: 20px;
}
.hotlineblock .phone:hover .img {
  background-image: url('/images/bg_spacer/phonegreen.svg');
}

.hotlineblock .phone > span , .hotlineblock .phone a {
  font-weight: bold;
}
.hotlineblock .phone span {
  margin-top: 10px;
}
.contentwrapper {
  margin: auto;
  margin-bottom: 40px;
  display: table;
  width: 800px;
  position: relative;
}
.bluebox .contentwrapper {
  margin-bottom: 0;
}
#content {
  width: 800px;
  display: table-cell;
  vertical-align: top;
}
.fr.tiny {
  position: relative;
}
#headerimg {
  width: 100%;
  height: 650px;
  position: relative;
  overflow: hidden;
} 
#headerimg img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  min-height: 200px;
}
#headerimggrey {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 11.17%, rgba(132, 132, 132, 0.316) 54.75%, rgba(60, 60, 60, 0.5) 74.16%, rgba(60, 60, 60, 0.5) 94.03%);
}
.chessImage {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-size: cover;
  background-repeat: no-repeat;
}
.chessImage img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}
#slogan {
  bottom: 40px;
  position: absolute;
  display: flex;
  width: 100%;
}
.headerline {
  height: 194px;
  flex-shrink: 0;	
  border-radius: 16px;
  background: var(--TOB-Petrol) url('/images/bg_spacer/headerline_bg.svg') center center / cover no-repeat; 
  margin-bottom: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.headerline h1 , #slogan h1 {
  z-index: 1;
  padding: 0 7px;
  display: block;
}
.headerline h1 span , div.fslogan * {
  font-size: 44px;
  line-height: 40px;
  font-weight: bold;
  color: white;
  font-family: TT_Travels;
}
div.fslogan * {
  font-size: 28px;
}
#slogan h1 , #slogan h1 span {
  font-size: 80px;
  line-height: 88px;
  color: white;
}
.headerunderline span , .fheaderunderline span {
  font-family: TT_Travels;
}
.headerunderline , .fheaderunderline, .headerunderlineoutput , .fheaderunderlineoutput {
  position: absolute;
  white-space: normal;
  display: block;
  font-family: TT_Travels;
}
.headerunderline , .fheaderunderline {
  visibility: hidden;
}
.headerunderlineoutput , .fheaderunderlineoutput {
  position: relative;
  z-index: 1;
}
.headerunderline_line {
  position: relative;
  display: inline-block;
}
.headerunderline_line::after {
  content: "";
  position: absolute;
  left: -0.25em;
  right: -0.25em;
  bottom: -10px;
  height: 25px;
  background: var(--TOB-Grn);
  border-radius: 6px;
  z-index: -1;
}
.headerline .headerunderlineoutput {
  text-align: center;
}
#slogan .headerunderline_line::after {
  bottom: -1px;
}
div.fslogan .headerunderline_line::after {
  bottom: 5px;
  border-radius: 3px;
  height: 10px;
}
.tabletshow , .mobileshow , .mobileevidenzemptycol {
  display: none;
}
.noshow {
  position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.form500 {
  width: 600px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-gap: 10px; 
}
.form500 * {
  margin: auto 0;
}
.form500 input[type="text"] {
  width: 300px;
}
.ageoverlay , .dsoverlay {
  background: black;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dsoverlay {
  z-index: 2147483647;
}
.ageblock , .dsblock {
  width: 800px;
  height: 600px;
  position: fixed;
  background: white;
  text-align: center;
}
.dsblock {
  overflow-y: scroll;
  overflow-x: hidden;
  text-align: left;
}
.ageconfirm {
  display: inline-block;
  padding: 10px;
  margin: 20px 50px;
  width: 200px;
  background: var(--TOB-Petrol);
  color: white;
  font-weight: bold;
}
.ageconfirm:hover {
  color: white;
  text-decoration: underline!important;
  text-decoration-thickness: 2px!important;
  text-underline-offset: 4px;
}
#dshide {
  display: inline-block;
  padding: 10px;
  margin: 20px 50px;
  width: 200px;
  background: var(--TOB-Petrol);
  color: white;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
}
div.breadcrumb , div#backcockpit {
  text-align: left;
  color: var(--TOB-Petrol);
}
div#backcockpit {
  margin-top: -10px;
  margin-bottom: 20px;
}
div.breadcrumb a , #backcockpit a {
  font-size: 0.8em;
  color: var(--TOB-Petrol) !important;
  text-decoration: none!important;
}
#backcockpit a {
  font-size: 1.1em;
  display: none;
}
.vcenter {
  align-self: center;
}
img.contentimage {
  max-width: 100%;
}

/* MENÜ */

.nav__mobile .nav__btn {
  display:block; 
  float: right;  
  width: 100%;
}
div.navblock {
  width: 44%;
  display: table-cell;
  vertical-align: middle;
}
div.navblock * {
  z-index: 50;
}
div.navblock img {
  max-width: 100%;
}
div.centered-logo {
  width: 12%;
  float: left;
}
.navbar {
  display: flex;
  justify-content: space-between; 
  align-items: center;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}
.navbar div.menu0:not(.ccentered-logo) {
  text-align: center;
}
#footmenu .subnav {
  float: left;*
  overflow: hidden;
}
#footmenu {
  display: none;
}
#footmenu2 {
  margin-top: 20px;	
  text-align: center;
  display: block;
}
div.subnav.footer {
  margin-right: 20px;
}
div.subnav.menu0 {
  height: 85px;
}
div.subnav.menu0 div.subnav.menu1 {
  height: 60px;
}
div.subnav.menu0 > div.menulink {
  font-weight: 700;
  margin-top: 20px;
  text-transform: uppercase;
}
div.subnav.menu0 > div.menulink::after {
  content: "";
  position: absolute;
  top: 70px;
  left: 0;
  width: 100%;
  height: 80px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}
div.subnav.menu0 > div.menulink:hover::after {
  opacity: 1;
  pointer-events: auto;
}

div.subnav.menu10 > div.menulink {
  margin-bottom: 20px;
}
div.subnav.menu12 > div.menulink {
  margin-top: 10px;
}
div.subnav.menu13 > div.menulink {
  margin-top: 7px;
  padding-left: 20px;
}
div.menu10 {
  margin-top: 15px;
  padding-bottom: 15px;
  border-bottom: solid 1px #666666;
}
div.subnav.menu11  {
  margin-top: 10px;
  padding-bottom: 10px;
}
div.subnav.menu12 , div.subnav.menu13 {
  margin-top: 0px;
  padding-bottom: 0px;
}
.visible {
  display: block !important;
}
div.menu10 , div.menu11 , div.menu12 , div.menu13 {
  position: relative;
}
div.subnav-content.menu11 , div.subnav-content.menu12 , div.subnav-content.menu13 {
  display: none;
  padding-top: 5px;
}
div.subnav-content.menu12 , div.subnav-content.menu13 {
  padding-top: 10px;
}
div.subnav-content.menu1 {
  text-align: center;
  width: 100%;
  left: 0;
  margin-top: 39px;
  border-top: solid 1px var(--TOB-Grn);
  border-bottom: solid 1px var(--TOB-Grn);
}
div.subnav-content.menu1.menulogin {
  border: none;
}
div.subnav-content.menu2 {
  position: relative;
  display: none;
  margin: auto;
  width: 0px;
}
div.subnav.menu2 {
  padding: 10px;
}
div.subnav.menu1.product {
  background: var(--tob-grn-10);
}
div.subnav.menu1.product a {
  font-weight: 700;
}
div.subnav.separatorline {
  border-top: solid 1px var(--tob-grn-20);
}
.moduleMenu > div.subnav.menu1 , .moduleMenu > div.subnav.menu2 , .moduleMenu > div.subnav.menu3 {
  display: block;
  padding: 10px 0;
  float: none;
}
.moduleMenu > div.subnav.menu1 {
  padding-left: 15px;
}
.moduleMenu > div.subnav.menu2 {
  padding-left: 25px;
}
.moduleMenu > div.subnav.menu3 {
  padding-left: 30px;
}
div.menuhighlight , div.menuhighlightlogin {
  position: relative;
  width: 0px;
  margin: auto;
  display:none;
  z-index: 60;
}
div.menuhighlight > div , div.menuhighlightlogin > div {
  background: url('/images/bg_spacer/menu_pfeil_gr.png');
  position: absolute;
  top: 20px;
  left: -10px;
  width: 19px;
  height: 11px;
}
div.subnav.menu0 > div.menuhighlight > div {
  top: 29px;
  background: url('/images/bg_spacer/menu_pfeil.png');
}
div.menuhighlightlogin > div {
  top: 29px;
  background: url('/images/bg_spacer/menu_pfeil_t.png');
}
#menu {
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 25px;
  padding-bottom: 10px;
  margin: auto;
  max-width: 1400px;
}
.mobile-nav {
  display:none;
  height: 75px;
  position: relative;
  width: 100%;
}
#mobile-logo {
  text-align: center;
}
.mobile-nav .menu-btn , .responsive-menu .menu-btn , #shoppingCart {
  right: 25px;
  position: absolute;
  display: inline;
  top: 15px;
}
#shoppingCart {
  left: 25px;	
}
.responsive-menu .menu-btn {
  z-index: 110;
  right: 35px;
  top: 40px;
}
.mobile-nav .menu-btn img {
  width: 30px;
  height: 30px;
}
#menuclose {
  float: left;
}
.responsive-menu {
  height: 0;
  overflow: hidden;
  border-left: 50px solid white;
  position: absolute;
  z-index: 100;
  background: white;
  top: -25px;
  right: -10px;
}
.responsive-menu > div {
  padding: 100px 25px 100px 0;
  display: none;
}
.responsive-menu-block {
  position: relative;
  width: 325px;
}
.expand {
  display: block !important;
  height: auto;
}
.expandslide {
  display: block !important;
  height: auto!important;
}
.open-menu-link{
  display: none;
  right: 5px;
  top: 1px;
  cursor: pointer;
  position: absolute;
  padding-top: 0px;
  padding-bottom: 0px;
}

.welcomeMenu {
  display: table;
  width: 100%;
  height: auto;
}
.specialMenu {
  display: inline-block;
}
.moduleMenuBar {
  width: 190px;
  display: table-cell;
  padding-right: 25px;
  vertical-align: top;
}
.moduleMenu {
  border: solid 1px var(--tob-grn-20);
  border-radius: 10px;
}
.pageMenuBlock {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 48px;
  margin: 48px 0;
}
.menuButton * {
  color: white;
  text-decoration: none;
}
#content .pageMenuBlock a {
  text-decoration: none;
}
#featuredMenuItems .menuButtonImage .menuButton {
  width: calc(80% - 40px);
  position: absolute;
  top: 125px;
  left: 10%;
}
.pageMenuBlock .menuButton , .pageLinkButtonSingle , #featuredMenuItems .menuButtonImage .menuButton {
  background: var(--tob-petrol-90);
  color: white;
  text-align: center;
  text-transform: uppercase;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 20px;
}
.pageMenuBlock .menuButton:hover , .pageMenuBlock .menuButton:hover .menuUnderl , .pageMenuBlock .menuButton:hover .menuUnderl * ,
.pageLinkButtonSingle:hover , .pageLinkButtonSingle:hover .menuUnderl , .pageLinkButtonSingle:hover .menuUnderl * ,
#featuredMenuItems .menuButtonImage .menuButton:hover , #featuredMenuItems .menuButtonImage .menuButton:hover .menuUnderl , #featuredMenuItems .menuButtonImage .menuButton:hover .menuUnderl * {
  color: white;
}
#chessBlock .menuButton .linktext {
  background: var(--tob-petrol-90);
  color: white;
  text-align: center;
  height: 250px;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
}
#chessBlock .menuButton .linktext:hover {
  color: white;
}
#chessBlock .menuButton {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
}
#chessBlock {
  margin: 40px 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px;
}
#chessBlock a {
  text-decoration: none;
}
.pageLinkButton , .pageLinkButtonSingle {
  display: inline-block;
  padding: 0px 50px;
  color: black!important;
  text-decoration: none!important;
  text-align: center;
}
#loginpagesubmenu {
  background: var(--tob-grn-10) url(/images/bg_spacer/inhbg.svg) center center / cover no-repeat;
  display: grid;
  grid-template-columns: 1fr 40px;
  gap: 20px;
  padding: 30px;
}
#loginpagesubmenu div , #loginpagesubmenu .level1 {
  grid-column-start: 1;
  grid-column-end: 3;
}
#loginpagesubmenu div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
#loginpagesubmenu div.hidden {
  display: none;
}
#loginpagesubmenu a , #loginpagesubmenu span.drop {
  display: block;
  background: white;
  padding: 10px;
  padding-left: 20px;
  text-decoration: none;
}
#loginpagesubmenu a.level2 {
  padding-left: 50px;
}
#loginpagesubmenu span.drop {
  padding-left: 12px;
  cursor: pointer;
}
#loginpagesubmenu * {
  color: var(--TOB-Petrol);
}
div.subnav.menu0:hover div.subnav-content.menu1 , div.subnav-content.menu1:hover , div.subnav.menu0:hover > div.menuhighlight , div.subnav.menu0:hover > div.menuhighlightlogin {
  display: block;
}
div.subnav.menu1:hover div.subnav-content.menu2 , div.subnav-content.menu2:hover , div.subnav.menu1:hover > div.menuhighlight {
  display: block;
}
.menushow , .menushow2 , .menushow3 {
  display: block!important;
}
.menuhide , .menuhide2 , .menuhide3 {
  display: none!important;
}
.subnav-table {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 30px;
  column-gap: 50px;
  padding: 30px 0 0 0;
}
#responsivemenu .subnav-table {
  margin-left: 20px;
}

/* SELECTS */

.prodselect {
  width: 68px;
}
.prodsel {
  white-space: nowrap;
}
.select2-selection__arrow b {
  display: none;
}
.select2-container {
  height: 46px;
  border-radius: 10px;
  width: 300px!important;
  border: solid 1px var(--TOB-Petrol);
}
.select2-dropdown {
  border: solid 1px var(--TOB-Petrol);
}
.select2-container .select2-selection--single ,
.select2-container--default .select2-selection--single .select2-selection__rendered ,
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--TOB-Petrol);
  margin-top: 8px;
  border: none;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  border: solid 1px var(--TOB-Petrol);
  width: 90%;
}
.select2-results__option[aria-selected] ,
.select2-results__option {
  margin: 0px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
 background-color: #e8eaeb;
 color: var(--TOB-Petrol);
}

span.ui-selectmenu-button.ui-widget {
  border-radius: 10px;
  border: solid 1px var(--TOB-Petrol);
  padding: 10px 25px;
}
.righttd span.ui-selectmenu-button.ui-widget ,
.lefttd span.ui-selectmenu-button.ui-widget ,
.belieferung-select span.ui-selectmenu-button.ui-widget ,
.rreasonsel span.ui-selectmenu-button.ui-widget { 
  height: 24px;
/*  margin-top: 4px !important; */
}
.doublesel span.ui-selectmenu-button.ui-widget ,
.beschreason span.ui-selectmenu-button.ui-widget {
  height: 24px;
}
.ui-selectmenu-button.ui-widget.ui-state-default.ui-corner-top,
.ui-selectmenu-button.ui-widget.ui-state-default.ui-corner-all.ui-state-focus,
.ui-selectmenu-button.ui-widget.ui-state-default.ui-corner-all.ui-state-hover,
.ui-selectmenu-button.ui-widget.ui-state-default.ui-corner-all ,
.belieferung-select span.ui-selectmenu-button.ui-widget ,
.rreasonsel span.ui-selectmenu-button.ui-widget ,
.righttd span.ui-selectmenu-button.ui-widget ,
.doublesel span.ui-selectmenu-button.ui-widget ,
.experThema span.ui-selectmenu-button.ui-widget ,
.rechnungsart-select span.ui-selectmenu-button.ui-widget ,
.begleitselect span.ui-selectmenu-button.ui-widget ,
#datetimeselect span.ui-selectmenu-button.ui-widget ,
.dhpck span.ui-selectmenu-button.ui-widget ,
.expertdiv span.ui-selectmenu-button.ui-widget ,
.unitsel span.ui-selectmenu-button.ui-widget ,
.amountsel span.ui-selectmenu-button.ui-widget ,
.reasonsel span.ui-selectmenu-button.ui-widget ,
.prodsel span.ui-selectmenu-button.ui-widget
{
  border: none;
  font-size: 1em;
  color: var(--TOB-Petrol); 
  height: 24px;
  padding: 10px;
/*  margin-left: 5px; */
  border: solid 1px var(--TOB-Petrol);
}
.ui-button {
  margin: 0;
  vertical-align: top;
}
.righttd span.ui-selectmenu-button.ui-widget ,
#content span.ui-selectmenu-button.ui-widget ,
#rreasonsel span.ui-selectmenu-button.ui-widget {
  max-width: 100%;
}
.ui-menu.ui-widget.ui-widget-content.ui-corner-bottom {
  background: #ffffff;
  border: 1px solid var(--TOB-Petrol);
  color: var(--TOB-Petrol);
}
.ui-menu-item.ui-state-focus {
  border: none !important;
  color: var(--TOB-Grn) !important;
  margin: 0 !important; 
}
.ui-selectmenu-button span.ui-selectmenu-text {
  padding: 0 40px 2px 5px !important;
/*  line-height: 1.5 !important;  */
  color: var(--TOB-Petrol);
}
.ui-menu-item {
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
}
.ui-menu-item > div {
  padding: 3px 1em 3px .4em;
}
.ui-menu-item .ui-state-focus ,
.ui-menu-item .ui-state-active ,
.ui-menu-item-wrapper .ui-state-active  
{
    color: var(--TOB-Grn) !important;
    margin: 0 !important;
    border: none !important;
}
.ui-menu-item-wrapper {
  color: var(--TOB-Petrol);
}
.ui-widget-header {
  background: var(--TOB-Petrol);
  border: none;
}
.ui-widget-header .ui-dialog-title {
  color: white;
}
.ui-button {
  background: white;
  border: var(--TOB-Petrol);
  border-radius: 10px;
  padding: 10px 20px;
}
.ui-selectmenu-menu .ui-menu {
  max-height: 200px; 
}
.ui-icon , .select2-container--default .select2-selection--single .select2-selection__arrow {
  background-image: url('/images/bg_spacer/select_pfeil.svg');
  background-repeat: no-repeat;
  width: 20px;
  margin-top: -4px;
}
.ui-icon-triangle-1-s {
  background-position-x: 0;
  background-position-y: 0;
}
.ui-selectmenu-button span.ui-icon {
  margin-top: -4px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  margin-top: 17px;
  margin-right: 7px;
}
#breadcrumbShoppingCart {
  display: flex;
  align-content: flex-end;
  gap: 20px;
  align-items: center;
}
#overl {
  width: 100%;
  height: 100%;
  opacity: 0.3;
  background-color: black;
  z-index: 90;
  position: fixed;
  display: none;
}
.overl {
  display: block!important;
}
.menulink a , .menuButton a , .menuButton span {
  font-size: 1.1em;
  font-weight: 700;
  margin: auto;
  text-decoration: none!important;
  line-height: 30px;
}
.moduleMenu .menulink a {
  font-size: 1em;
  font-weight: normal;
}
#chessBlock .menuButton span {
  font-size: 44px;
}
div.menu10 a , li.menu10 > a {
  font-size: 1.4em;/*!important;*/
}
div.menu11 > a , li.menu11 > a {
  font-size: 1.1em;
}
div.menu12 > a , li.menu12 > a {
  font-size: 1em;
}
li.active > a , div.active > a {
  border-bottom: solid 1px var(--TOB-Petrol);
  font-weight: 600;
}
#chessBlock .menuButton * {
  line-height: normal;
  text-decoration: none;
}
div.subnav:hover > div.menulink > a , div.subnav.active > div.menulink > a , #loginpagesubmenu a:hover .menuUnderl , #loginpagesubmenu span:hover .menuUnderl , .menuButtonImage .menuButton:hover >span > span {
/*  border-bottom: solid 2px var(--TOB-Petrol);*/
  text-decoration: underline!important;
  text-decoration-thickness: 3px!important;
  text-underline-offset: 6px;
}
#chessBlock .menuButton:hover > div > span > span {
  text-decoration: underline!important;
  text-decoration-thickness: 6px!important;
  text-underline-offset: 12px;
}
.pageMenuBlock .menuButton:hover >span > span , .menuButtonImage .menuButton:hover >span > span , .cockpitlink:hover > .cockpit-name > .menulink {
  color: white;
  text-decoration: underline!important;
  text-decoration-thickness: 2px!important;
  text-underline-offset: 4px;
}
div.footer .menulink a:hover {
  text-decoration: underline!important;
  text-decoration-thickness: 2px!important;
  text-underline-offset: 4px;
}
div.footer a:hover {
  color: white;
}

/* BUTTONS AND FORMS */

input , textarea , #psearchrow option , .logoutl , #loginsubmit {
  margin-left: 5px;
  margin-right: 5px;
  border: none;
  outline: none;
  background: white;
  padding-left: 5px;
  color: var(--TOB-Petrol);
  border: solid 1px var(--TOB-Petrol);
  border-radius: 10px;
/*  justify-content: center; 
  text-align: center;*/
  padding: 10px;
}
input[type=submit] , #loginsubmit {
  padding: 8px 22px ;
  justify-content: center; 
  text-align: center;
  cursor: pointer;
}
#searchrow input[type=submit] {
  background: var(--TOB-Petrol) url('/images/bg_spacer/search.png') center no-repeat;
  width: 70px;
}
td.withDefaultButton input.defaultButton {
  margin-top: 4px !important; 
}
#content a.defaultButton , #content a.defaultButtonLink , a.defaultButton , .shopWarenkorb , .defaultButton , .lightButton , a.lightButton , .kassaFUP .fileUpload span , .fileUpload span {
  border-radius: 10px;
  border: 1px solid var(--TOB-Petrol);
  background: var(--TOB-Petrol);
  padding: 8px 22px;
  cursor: pointer;
  margin-top: 10px;
  text-transform: uppercase;
  text-decoration: none!important;
  white-space: nowrap;
  color: white;
}
#content a.defaultButton:hover , #content a.defaultButtonLink:hover , a.defaultButton:hover , .shopWarenkorb:hover , .defaultButton:hover , .lightButton:hover , a.lightButton:hover , .kassaFUP .fileUpload span:hover , .fileUpload span:hover {
  text-decoration: underline!important;
  text-decoration-thickness: 2px!important;
  text-underline-offset: 4px;
}
.lightButton , a.lightButton{
  background: white;
  color: var(--TOB-Petrol);
}

.defaultButton.larger {
  min-width: 150px;
}
.defaultButtonLink , input.defaultButton , a.defaultButton{
  margin-bottom: 20px;
}
.shopWarenkorb.right {
  float: right; 
}
.cockpit {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 48px;
  margin: 48px 0;
  width: 100%;
}
.cockpitlinkwrapper {
  overflow: hidden; 
  background-color: var(--TOB-Petrol);
  width: 100%;
  height: 167px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}
.cockppitlink {
  display: flex;
  flex-direction: column;
}
.cockpitlink > .cockpit-name , .cockpitlink > .cockpit-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
#content .cockpit-icon > img {
  height: 45px !important;
  margin-bottom: 15px;
}
.cockpitlink > .cockpit-name > .menulink {
  white-space: normal;
  text-align: center;
  color: white;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.cockpitlinkwrapper:hover {
/*  background-color: var(--TOB-Grn); */
}
.cockpitlinkwrapper:hover > .cockpitlink > .cockpit-name > .menulink {
  color: white!important;
}
input.cb[type=checkbox] {
  border: 0 none;
  clip: rect(0px, 0px, 0px, 0px);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; 
}
input.cb[type=checkbox] + label.cb {
  background-image: url("/images/bg_spacer/check.png");
  background-position: 0 2px;
  background-repeat: no-repeat;
  cursor: pointer;
  display: inline-block;
  padding-left: 30px;
  min-height: 26px;
  vertical-align: middle; 
  color: var(--TOB-Petrol);
}
input.cb[type=checkbox]:checked + label.cb.disabled {
  background-image: url("/images/bg_spacer/ico-cb-dis.png");
}
label.cb.isChecked,
input.cb[type=checkbox]:checked + label.cb {
  background-image: url("/images/bg_spacer/check_yes.png");
}
span.cb {
  margin-left: 20px;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
input[type=text]:disabled , select:disabled , .ui-selectmenu-disabled , .ui-state-disabled
{
  opacity: 0.5 !important;
}
.breadcrumbrow {
  display: flex;
  justify-content: space-between; 
  margin-bottom: 10px;
}
#searchrow form {
  margin: 20px 0;
  display: flex;
  gap: 15px;
}
#featuredMenuItems {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 48px;
  margin: 48px 0;
}
#featuredMenuItems .menuButtonImage {
  position: relative;
  height: 400px;
  text-align: center;
  overflow: hidden;
}
#featuredMenuItems .menuButtonImage > img {
  object-fit: cover;
  width: 100% !important;
  height: 100% !important;
}
/* DOWNLOLAD UND LISTEN */

.dli.inv , .dli.dl {
  min-height: 43px;
  padding: 0 0 5px 0;
}
.dli a {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  width: 100%;
  margin-bottom: 10px;
  text-decoration: none!important;
}
.dli.inv.nodate a {
  grid-template-columns: 2fr 1fr;
}
.dli.dl a {
  grid-template-columns: 1fr 2fr;
}
.dli.dl span {
  display: inline-block;
  padding-top: 5px;
  color: var(--TOB-Petrol);
}
.dli.inv span {
  display: inline-block;
  border-bottom: solid 1px var(--tob-grn-20);
  padding-bottom: 5px;
  color: var(--TOB-Petrol);
}
.dli.dl span.col-a {
  border-bottom: solid 1px var(--tob-grn-20);
  grid-column-start: 1;
  grid-column-end: 4;
  padding-bottom: 5px;
  padding-top: 0px;
}
.dli .col-a {
  font-weight: bold;
  color: var(--TOB-Petrol);
}
.dli .col-e {
  text-align: right;
}
.dli input.cb[type="checkbox"] + label.cb {
  padding-left: 21px;
}
.dli:hover,
.dli.over,
.linkli.over {
  background-color: var(--tob-grn-10); 
}
.dlidl.inv {
  padding-left: 0px;
  margin-bottom: 1px;
  display: grid;
  grid-template-columns: 0.5fr 4fr 2fr 2fr 2fr 2fr;
  width: 100%;
}
.dlidl.inv span {
  border: 0;
  padding-top: 10px;
  margin-bottom: 0;
  padding-bottom: 0;
}
.dlidl.inv span.cb {
  margin-left: 0px;
  margin-right: 10px;
  padding-top: 5px;
  position: relative;
}
.dlidl {
  min-height: 32px;
  height: 32px;
}
.persData td {
  padding: 5px;
  padding-top: 25px; 
}
.persData td > div {
  float: left; 
}
.persData td > div p {
  margin: 0;
  padding: 0; 
}
.persData span.cb {
  float: right;
  padding: 2px; 
}
.persData input.cb[type="checkbox"]:checked + label.cb {
  background-image: url("/images/bg_spacer/check_yes.png");  
}
.persData input.cb[type="checkbox"] + label.cb {
  background-position: right 2px;
  padding-left: 5px;
  padding-right: 27px; 
}
.persData input.cb[type=checkbox] + label.cb.disabled {
  background-image: url("/images/bg_spacer/check.png");  
}
.persData input.cb[type="checkbox"] + label.cb {
  padding-left: 5px;
  padding-right: 27px; 
}
#changePassTable {
  display: grid;
  grid-template-columns: 250px 1fr;  
  padding: 5px;
  gap: 15px;
}
#changePassTable .fullrow {
  grid-column: 1 / -1;
}
#passInfo {
  position: relative;
}


/* POPUPS */
#changePwPopUp , #hardwarePopUp , #liquidPopUp , #retourPopUp {
  position: absolute;
  bottom: 20px;
  left: -260px;
  width: 320px;
  display: none;
  z-index: 10;
}
#hardwarePopUp , #liquidPopUp {
  top: -80px;
  left: 100px;
}
#changePwPopUp.open , #hardwarePopUp.open , #liquidPopUp.open , #retourPopUp.open {
  display:block;
}
#changePwPopUp #changePwInner .close , #hardwarePopUp #inner .close , #liquidPopUp #inner .close , #retourPopUp #retourInner .close{
  float: right;
  margin-top: -22px;
  margin-right: -22px;
  cursor: pointer;
  color: #00AC15;
  border: 1px solid #00AC15;
  border-radius: 30px;
  background: rgb(225, 247, 228);
  font-size: 1.1em;
  font-weight: bold;
  display: inline-block;
  line-height: 0px;
  padding: 11px 5px;
}
#changePwPopUp #changePwInner .close:hover , #hardwarePopUp #inner .close:hover , #liquidPopUp #inner .close:hover , #retourPopUp #retourInner .close:hover {
  color: var(--TOB-Petrol);
}

/* ORDERFORM LICENSOR */

.licT {
  width: 300px;
  margin-bottom: 20px; 
}
.licT td {
  vertical-align: middle;
  position: relative; 
}
.licT td + td input {
  float: right; 
}
.licT td + td select {
  position: absolute;
  right: 0;
  top: 0; 
}
.licT .invSelect {
  float: right;
  width: 230px !important;
  margin-left: 5px;
  padding-left: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  height: 25px;
  background: url(/images/bg_spacer/ico-ts-down-inv.png) right center no-repeat #e8eaeb;
  color: #000000; 
}
.licT .invSelect .invSelectInner {
  display: block;
  padding-top: 7px; 
}
.licPT span.cb, .licPT label.cb {
  background: transparent; 
}
.licPT label.cb {
  padding-left: 50px !important; 
}
.licPT span.cb {
  margin-left: 0 !important; 
}
.licPT td + td {
  text-align: right; 
}
.licT.statistik {
  width: 350px; 
}
.licT.statistik input[type=text] {
  width: 230px; 
}
.kassaFUP.licOrder {
  width: 300px;
  padding-top: 25px; 
}
.licOrder-a {
  padding-bottom: 25px; 
}
.licOrder-a .fr {
  width: 300px; 
}
.licOrder-a .fr span {
  float: left;
  display: block;
  padding-top: 7px; 
}
.licOrder-a .fr input[type=text] {
      float: right; 
}
.shop-table td.noBG:hover,
.shop-table td.noBG {
  background: #ffffff; 
}

/* RETOUREN */

#retRealForm .fr input[type=text] , #retRealForm .fr input[type=number] , #retRealForm .fr input[type=email] {
  width: 30px;
  margin: 3px;
}
#retRealForm .fr span {
  float: left;
}
#retRealForm .fr input.wider {
  width: 60px; 
  margin: 3px;
}
.retour .fr.pad {
  padding-top: 5px;
  padding-bottom: 5px; 
}
.retour .fr.pad span + span {
    font-weight: bold; 
}
.retour .fr > span {
  display: inline-block;
  white-space: nowrap;
  width: 140px; 
}
.retour span + input + span {
  margin-left: 20px; 
}
.retour span + input {
  margin-left: 0 !important; 
}
.retour #emailFirst, .retour #emailVerify {
  width: 330px; 
}
.retour .tobTable-b {
  margin-top: 40px; 
}
.retour .tobTable-b tr {
  background-color: #ffffff; 
}
.retour .tobTable-b td {
  vertical-align: middle;
  text-align: left;
  padding: 3px; 
}
.retour td.righttd {
  text-align: right; 
}
.retour td.centertd {
  text-align: center; 
}
.retour tr:first-child td {
  background: #ffffff;
  border-bottom: 1px solid #c3c3c3;
  padding-bottom: 4px;
  font-weight: bold;
  position: relative;
}
.retour tr:first-child td > span {
  text-transform: none; 
}
.retour tr:first-child + tr td {
  padding-top: 5px; 
}
.retour td > input[type=text]  , .retour td > input[type=number] , .retour td > input[type=email],
.reklamation td > input[type=text]  , .reklamation td > input[type=number] , .reklamation td > input[type=email]{
  height: 25px;
}
.retour td.w40 {
  width: 60px; 
}
.retour td.w45 {
  width: 95px; 
}
.retour td.w250 {
  width: 250px; 
}
.retour td.w200 {
  width: 200px; 
}
.retour td.w150 {
  width: 150px; 
}
.retour input[type=text].w230 , .retour input[type=number].w230 {
  width: 210px; 
}
.retour input[type=text].w130 , .retour input[type=number].w130 {
  max-width: 130px;
}
.retour input[type=text].w50 , .retour input[type=number].w50 {
  width: 70px; 
}
.retour input[type=text].w40 , .retour input[type=number].w40 {
  width: 55px; 
}
.retour span.cb {
  margin-top: 0px;
  margin-left: 0;
  width: auto; 
}
.retour .tobTable-b span.cb > label {
  padding-left: 30px !important; 
}
.retour .tobTable-b.reklamation {
  margin-top: 10px;
  width: 100%;
}
.rreason {
  width: 250px;
}
.beschreason , .reasonsel {
  width: 180px;
}
.retourentext , .rightcol3 .retourentext {
  width: 100% !important;
  height: 165px !important;
  margin: 0 !important;
  text-align: left;
}
.retourul {
  margin-left: 30px;
  margin-top: 10px;
  margin-bottom: 20px;
  list-style-position: outside;
}
.retourli {
  color: var(--TOB-Petrol); 
  margin-bottom: 0px;
}
.chosen-select {
  width: 220px;
}
.chosen-container-single .chosen-default {
  color: black!important;
}
select#belieferung , #kartonnummer {
  width: 156px !important;
}
#belieferung-button {
  top: 5px;
}
.karton , .prname {
  display: none;
}
.prname {
  margin-left: 5px; 
  color: var(--TOB-Petrol);
}
#beschupl {
  width: 100%;
  min-width: 200px;
  text-align: right;
  white-space: nowrap;
}
#beschupl .uploadFile {
  width: 80px;
}
.retour .white tr:nth-child(n) {
  background-color: #f4f4f4;
}
.retour .white td {
  vertical-align: top;
  border-bottom: 1px solid #ffffff;
  padding: 5px;
}
.blacklink {
  color: black;
}
.blacklink:hover {
  color: var(--TOB-Petrol);
}
.smaller {
  font-size: 0.9em;
}
.reklamthx {
  width: 90%;
  height: 100%;
  display: block;
}
input.formerror , .formerror > #belieferung-button , .formerror > #mig-button , .formerror > #mip-button , .formerror > .ui-selectmenu-button {
  outline: solid 1px red !important;
}
.select2-selection__clear {
  margin-right: -20px;
  color: var(--TOB-Petrol);
  height: 31px;
  right: 0 !important;
  top: 0px !important;
  width: 28px;
  position: absolute;
  opacity: 10;
  border: solid 1px red;
}
.retouroverl {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 5000;
  opacity: 0.7;
  background-color: black;
  border: solid 1px red;
  display: block;
}
.retouroverlinnerw {
  position: absolute;
  width: 100%;
  top: 100px; 
  z-index: 5550;
}
.retouroverlinner {
  width: 80%;
  max-width: 600px;
  background: white;
  padding: 30px;
  padding-bottom: 50px;
  margin: auto auto;
  border: solid 5px var(--TOB-Petrol);
}
.retouroverlinner , .retouroverlinner .retourli {
  color: black;
}
.hiddenrowliefer , .hiddenrowbesch {
  display: none;
}
.reklamplus {
  width: 19px;
  height: 19px;
  float: left;
  padding-top: 2px;
}
.reklamplustxt {
  height: 19px;
  color: white;
  width: 120px;
}
.reklampluswrapperliefer , .reklampluswrapperbesch {
  margin-top: 3px;
  display: inline-block;
  cursor: pointer;
}
ul.retourul , li.retourli {
  list-style-type: none;
}
.dl-link {
  clear: both;
  padding: 0 0 10px 10px;
  margin-bottom: 20px;
/*  background: url(/images/bg_spacer/dli.png) left top no-repeat #fff;  */
}
#retourinfo , #retourinfo2 {
  position: relative;
  left: 10px;
  height: 26px;
}
.retourgrid , .reklamgrid , .beschgrid {
  width: 100%;
  display: grid;
  grid-gap: 24px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  border-top: solid 1px var(--tob-grn-20); 
  padding-bottom: 24px;
  border-bottom: solid 1px var(--tob-grn-20); 
  margin-top: 24px;
}
.retourselect , .rreasonsel {
  grid-column: span 2;
}
.retourhdl {
  color: var(--TOB-Petrol);
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: right; 
  font-weight: bold;
}
.retourhdl.span2 {
  grid-column: span 2;
  text-align: left;
}
.beschgrid {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.reklamgrid div {
  padding-right: 15px;
}
.reklamgrid div input {
  width: 100%!important;
}

/* FORMULAR RECHNUNGEN UND ÄHNLICHES */

.invForm {
  display: block;
  border-bottom: 1px solid #c3c3c3;
  padding-bottom: 30px;
  margin-bottom: 30px;  
}
.invForm .fr {
  clear: both;
  height: 50px;
  margin-bottom: 10px;
  position: relative; 
}
.invForm .fr > span {
  display: block;
  float: left;
  width: 150px;
  line-height: 50px;
  height: 50px; 
  margin-left: 5px;
}
.invForm .fr select {
  left: 125px;
  top: 0;
  width: 157px; 
}
.invForm .fr input[type=text] , .invForm .fr input[type=search] , .invForm .fr input[type=number] , .invForm .fr input[type=email] , input.twoNumbersOnly {
  float: left;
  text-align: left;
  width: 30px; 
}
.invForm .fr input.wider , input.numbersOnly.wider {
  width: 60px; 
}
.invForm .fr input.renr {
  width: 150px; 
}
.invForm .fr input.pSearchString {
  width: 200px; 
}
.invForm .fr .ui-datepicker-trigger {
  margin-top: 18px; 
  margin-left: 10px;
}
.invForm .invSelect {
  width: 157px !important;
  margin-left: 5px;
  padding-left: 5px;
  height: 25px;
  color: #000000; 
}
.invForm .invSelect .invSelectInner {
  display: block;
  width: 100%;
  height: 100%; 
}
span.ui-datepicker-month , span.ui-datepicker-year {
  color: white;
}

/* KASSENFILE */
.kassaFUP {
  width: 450px; 
}
.kassaFUP .lbl {
  display: inline-block;
  padding-top: 10px; 
}
.kassaFUP #uploadFile {
  height: 26px;
  float: right; 
}
.kassaFUP .fileUpload , .fileUpload {
  float: right;
  position: relative;
  overflow: hidden;
  margin: 5px;
  margin-right: 0; 
}
.kassaFUP .fileUpload .upload , .fileUpload .upload {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
  font-size: 1.4em;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0); 
}
.contactForm tr td:first-child {
  padding-top: 10px;
  padding-right: 20px; 
}
.contactForm td {
  vertical-align: top; 
}
.contactForm td.req {
  position: relative; 
}
.contactForm span.req {
  position: absolute;
  top: 10px;
  right: -10px;
  color: #ff0000; 
}
.contactForm input[type=text],
.contactForm textarea {
  width: 350px !important; 
}
.contactForm textarea {
  margin-top: 5px; 
}
.disabledButton {
  background-color: #cccccc;
}


/* BESTELL UND LIEFERKALENDER */

.ordercol , .delcol {
  padding: 10px;
}
.ordercol {
  background: url('/images/bg_spacer/red.png');
}
.delcol {
  background: url('/images/bg_spacer/green.png');
}
input[type=text].reminderemail {
  display: inline;
  width: 100%;
}
.expertdiv {
  vertical-align: top;
  padding-left: 5px;
}
.cbbeforegridspan {
  grid-column-start: span 2;
}
table.kalender {
  width: 100%;
}
table.kalender tr {
  border: solid 1px #333333;
  border-collapse: collapse;
}
table.kalender td {
  padding: 2px;
  text-align: center;
  border: solid 1px #333333;
/*  font-size: 11px;*/
  line-height: 13px;
  border-collapse: collapse;
}
table.kalender td.order {
  background: url('/images/bg_spacer/red.png');
}
table.kalender td.del {
  background: url('/images/bg_spacer/green.png');
}
table.kalender td.del_ord {
  background: url('/images/bg_spacer/red_green.png');
}
table.kalender td.noborder , table.kalender tr.noborder {
  border: none;
  text-align: left;
}
.grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  margin: 5px 0;
}
span.termintxt , span.datenschutzlabel {
  display: inline-block;
  float: right; 
  max-width: 500px;
}

/* LOGIN */

div.login-bar {
  text-align: center;
/*  background: var(--TOB-Petrol) url(/images/bg_spacer/footerbg.svg) center top no-repeat; */
  background: var(--TOB-Petrol) url(/images/bg_spacer/loginbg.svg) center center / cover no-repeat;
}
div.login-table {
  display: table;
  margin: auto;
}
div.login-table span , div.login-table a {
  color: white;
}
div.login-table > div {
  display: table-cell;
  padding: 40px 20px;
  font-weight: bold;
}
div.login-table a , .loginForm {
  text-decoration: underline;
}
.loginC .fr {
  margin-top: 15px;
  width: 165px; 
}
.loginC .fr label {
  display: block;
  font-weight: bold;
  margin-bottom: 5px; 
}
.tiny.fr {
  clear: both;
  width: 290px; 
}
.tiny.fr input[type=text],
.tiny.fr input[type=password] {
  float: right; 
}
.tiny.fr .lbl {
  display: inline-block;
  padding-top: 10px;
  width: 120px; 
}
.tiny.fr span.cb {
  float: right; 
}
.rotateth {
  height: 50px;
  bottom: 0px;
  vertical-align: middle;
  -moz-transform: rotate(-90.0deg);
  -o-transform: rotate(-90.0deg);
  -webkit-transform: rotate(-90.0deg);
  filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=0.083);
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";
  transform: rotate(-90.0deg);
  white-space: nowrap;
}
.rotateth span{
  position: relative;
  display: inline-block;
}
.user td {
  vertical-align: middle;
}
.useredit {
  width: 100%;
}
.useredit span.cb {
  margin-left: 0px;
}
#loginForm {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
  /*background: var(--TOB-Petrol) url(/images/bg_spacer/footerbg.svg) top center no-repeat;*/
  background: var(--TOB-Petrol) url(/images/bg_spacer/loginbg.svg) center center / cover no-repeat;
  color: white;
  padding: 30px 40px 10px 40px;
  border-radius: 10px;
}
#loginForm p.error {
  grid-column-start: 1;
  grid-column-end: 4;
  text-align: center;
}
#loginForm div.login {
  text-transform: uppercase;
  font-weight: bold;
  padding-top: 15px;
  color: white;
}
#loginForm #loginforgot {
  text-align: center;
  font-weight: bold;
}
#loginForm #loginforgot a {
  color: white;
  text-decoration: underline;
}


/* LINKLIKST UND NEWS */

.linkli {
  clear: both;
  min-height: 100px;
  border-top: 1px solid var(--tob-grn-20);
  display: table;
  padding-top: 20px;
  padding-bottom: 20px; 
}
.linkli.over {
  background-color: var(--tob-grn-20); 
}
.linkli.news {
  border-top: none;
  width: 100%;
  border-bottom: 1px solid var(--tob-grn-20);
  display: block;
  padding-top: 20px;
  padding-bottom: 10px;
  min-height: 10px; 
}
.linkli.news span {
  display: block;
  width: 100%; 
}
.linkli.news .date {
  color: #000000;
}
.linkli.news .headline {
  padding-top: 5px;
  color: var(--TOB-Petrol);
  text-transform: uppercase; 
}
.monatsmappe h2 {
  display: block;
  cursor: pointer;
  background: url(/images/bg_spacer/ico-ts-down-dark.png) right 20px top 2px no-repeat #ffffff;
  border-bottom: 1px solid #c3c3c3;
  padding-bottom: 10px; 
}
.monatsmappe h2.open {
  border-bottom: none;
  padding-bottom: 0; 
}
.monatsmappe .hidden-downloads {
  display: none;
  padding-bottom: 10px; 
}

/* TABELLENSTRUKTUR */

.tobTable-a {
  width: 100%;
  margin-top: 20px; 
}
#content .tobTable-a a {
  text-decoration: none;
}
.tobTable-a td {
  vertical-align: middle;
  text-align: left;
  padding: 5px 2px; 
}
.tobTable-a td .righttd {
  text-align: right; 
}
.tobTable-a tr:hover td {
  background: var(--tob-grn-10); 
}
.tobTable-a tr:first-child td {
  background: #ffffff;
  padding: 2px 2px 4px 2px;
  font-weight: bold;
  text-transform: uppercase; 
}
.tobTable-a tr.noh:first-child td {
  background: #f4f4f4;
  border-bottom: 1px solid #ffffff;
  font-weight: normal;
  text-transform: none; 
}
.linklist {
  display: grid;
  grid-gap: 40px;
  grid-template-columns: 1fr 1fr;
  padding-top: 40px;
}
.linklist-element {
  display: grid;
  grid-gap: 15px;
  grid-template-columns: 1fr 1fr;
}
.linklist-element div.image {
  margin: auto;
}
.linklist-element div.link {
  margin: auto 0;
}
.linklist-element div img {
  max-width: 100%;
}

/* EVIDENZEN */

.invform {
  background: var(--tob-grn-10) url(/images/bg_spacer/inhbg.svg) center center / cover no-repeat;
}
.tobTable-a.evidenzen {
  display: grid;
  grid-template-columns: 100px 250px 80px 120px 1fr;
  grid-row-gap: 10px;
  padding: 10px;
  margin-top: 0;
}
.tobTable-a.evidenzen .fullrowborder {
  grid-column-start: 1;
  grid-column-end: 7;
  border-bottom: solid 1px var(--tob-grn-20);
}
.tobTable-a.evidenzen.multi {
  grid-template-columns: 100px 100px 250px 100px 150px 1fr;
}
.tobTable-a.evidenzen.firstrow {
  background: var(--tob-grn-10);
  padding-bottom: 10px;
  margin-top: 20px;
}
.tobTable-a.evidenzen.firstrow * {
  font-weight: bold;
}
.evidenzen .cole {
  justify-self: end;
}
.evidenzen .cole a {
  display: inline-block;
}
/* TRACKING UND SMS */
.tobTable-a.tracking {
  display: grid;
  grid-template-columns: 250px 100px 1fr;
  grid-row-gap: 10px;
  margin-top: 0;
}
.tobTable-a.tracking.firstrow {
  background: var(--tob-grn-10);
  padding-bottom: 10px;
  margin-top: 20px;
}
.tobTable-a.tracking.firstrow * {
  font-weight: bold;
}
.tobTable-a.tracking * {
  padding: 10px;
}
.tobTable-a.tracking .fullrowborder {
  grid-column-start: 1;
  grid-column-end: -1;
  border-bottom: solid 1px var(--tob-grn-20);
  padding: 0;
}
.smsaviso .fr.tiny { 
  width: 160px; 
}
.smsaviso .vm { 
  vertical-align: middle; 
}
.smsaviso span.cb { 
  float:none;
  margin:0; 
}

/* EVENTS */
th {
  text-align: left;
}
.begleitselect span {
  vertical-align: bottom;
}
.eventtable {
  width: 750px;
  margin:30px;
}
.eventtable td , .eventtable th {
  padding: 5px;
  border-bottom: 1px solid #cccccc;
}
.eventtable td.noborder {
  border-bottom: none;
}

/* PRODUKTE */

.katalogContentLeft {
  float: left;
  width: 420px; 
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.merkmalWert {
  margin-bottom: 20px; 
  margin-right: 10px;
}
.merkmalHdl {
  font-weight: bold;
  padding-bottom: 3px;
}
.shopInput {
  background: #ffffff;
  border: none;
  outline: none;
  padding: 5px;
  text-align: center;
  width: 25px; 
}
.shop-table td.right {
  text-align: right; 
}
.shop-table .tooltip.pp {
  border-bottom: 1px dashed #c3c3c3;
  position: relative; 
}
.shop-table tr.borderTop td {
  border-bottom: 1px solid #c3c3c3;
  height: 1px;
  padding: 0; 
}
.shop-table .price {
  padding-right: 10px; 
  text-align: right; 
  white-space: nowrap;
}
.katalogOverview {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 15px;
  grid-row-gap: 40px;
}
#katalogHdl {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--tob-grn-20);
  margin-bottom: 32px; 
}
.fr-d table {
  margin-top: 32px;
  padding-bottom: 32px;
  border-top: 1px solid var(--tob-grn-20);
  border-bottom: 1px solid var(--tob-grn-20);
  margin-bottom: 24px; 
}
.fr-d table th {
  padding-top: 32px;
}
.katalogOverview span {
  font-weight: bold;
  vertical-align: bottom;
}
.katalogOverview div {
  width: 100%;
  height: 200px;
  border: solid 1px #cecece;
  margin-bottom: 5px;
  position: relative;
}
.katalogOverview img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.tobLicens {
  font-weight: bold; 
}
a.proddetail {
  color: var(--TOB-Petrol);
  text-decoration: underline;
  text-decoration-thickness: 1px!important;
  text-underline-offset: 2px;
}
a.proddetail:hover {
  font-weight: bold;
  text-decoration-thickness: 2px!important;
}
#content a.proddetailkatalog {
  text-decoration: none;
}
a.proddetailkatalog span {
  font-weight: normal;
  color: black;
  border-bottom: 1px solid var(--tob-grn-20);
  letter-spacing: 0.021em;
}
a.proddetailkatalog:hover > span {
  font-weight: bold;
  border-bottom: 2px solid var(--tob-grn-20);
  letter-spacing: normal;
}
.reduceImg > img {
  width: 90%;
}
#bestChangeAmount {
  display: none;
}
#notbestellung {
  display: grid;
  grid-template-columns: 100px 40px 40px auto;
  grid-gap: 20px;
  margin: 10px 0;
  width: 100%;
}
.notbestellungdiv {
  display: flex;
  align-items: center;
}
.notbestellungdiv.infotext {
  color: var(--TOB-Petrol);
  text-decoration: underline;
  cursor: pointer;
}
.notbestellungdiv.infotext img {
  margin-right: 10px;
}
#notbestellunginfo {
  grid-column: span 4;
  display: none;
}
#notbestellunginfoimage {
  cursor: hand;
}
.orderbuttongrid {
  display: grid;
  justify-content: space-between;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-areas: "leeren vorlage schicken";
  grid-gap: 24px;
  margin-top: 24px;
}
.orderbuttongrid .schicken {
  text-align: right;
  grid-area: schicken;
}
.orderbuttongrid .vorlage {
  text-align: center;
  grid-area: vorlage;
}
.orderbuttongrid .leeren {
  grid-area: leeren;
}
.orderbuttons , .vorlagebuttons {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 24px;
}
.withvorlagebuttons { 
  width: 350px;
  text-align: right;
}
.vorlagebuttons a {
  margin-bottom: 0;
}
.flexbreak {
  flex-basis: 100%;
  height: 0;
}
#content a.nextorder , .nextorder b {
  color: var(--TOB-Petrol);
  font-size: 32px;
  line-height: 40px;
  font-weight: bold;
  font-family: TT_Travels;
  text-decoration: none;
}
#productrec {
  border: solid 1px #cccccc; 
  padding: 25px;
  margin-bottom: 20px;
/*  width: calc(100% - 50px); */
  border-radius: 16px;
}
#productrec h1 {
  color: var(--TOB-Petrol);
  margin-top: 0px;
}
#productrecimgtext {
  display: flex; 
  justify-content: space-between;
}
#productrecimg {
  max-width: 50%;
  text-align: right;
}
#productrectext {
  max-width: 50%;
}
#productrecimg img {
  max-width: 100%;
}
.shop-table a img {
  padding-top: 2px;
}
div#cart {
  background: url('/images/bg_spacer/cart.svg') no-repeat;
  width: 45px;
  height: 33px;
  text-align: center;
  margin-top: 2px;
}
div#cart span {
  display: block;
  padding-top: 10px;
  font-weight: bold;
  color: var(--TOB-Petrol);
}
div#cart span.filled {
  color: var(--TOB-Petrol);
}
#shopIndex #r2 #az , #shopIndex #r2 #az a {
  font-size: 0.95em !important;
  letter-spacing: 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#shopIndex {
  position: fixed;
  bottom: 0px;
  height: 120px;
  border-top: solid 1px var(--TOB-Petrol);
  background-color: white;
  padding: 10px;
  padding-bottom: 75px;
  color: var(--TOB-Petrol);
  left: 0px;
  width: 100%;
}
#shopIndex #r1 {
  text-align: center;
  position: relative;
  padding-top: 15px;
}
#shopIndex #r2 {
  text-align: center;
  position: relative;
  padding-top: 5px;
  white-space: nowrap;
}
#shopIndex .shopWarenkorb {
  float: none;
}
#shopIndex {
   display: none; 
}
.productSearch #close {
  display: none;
}
.slider {
  width: 355px;
  float: right;
}
#image-gallery li img {
  max-width: 100%;
}
.plusminus {
  padding: 0px 10px;
  font-size: 1.4em;
  font-weight: 700;
  margin: 0;
}
.tobTable-a td.warenkorbanzahl {
  text-align: center;
}
.nw {
  white-space: nowrap;
}

#banner img {
  width: 100%; 
  border-radius: 10px;
}


.ot-sdk-show-settings {
/*  background-color: red!important; */
}