/** assets.desktop.1842bf09.css generated 2025-12-01 14:06:19.000000 **/ /*#region assets/css/js/glidejs/css/glide.core.min.css*/ .glide{position:relative;width:100%;box-sizing:border-box}.glide *{box-sizing:inherit}.glide__track{overflow:hidden}.glide__slides{position:relative;width:100%;list-style:none;backface-visibility:hidden;transform-style:preserve-3d;touch-action:pan-Y;overflow:hidden;margin:0;padding:0;white-space:nowrap;display:flex;flex-wrap:nowrap;will-change:transform}.glide__slides--dragging{user-select:none}.glide__slide{width:100%;height:100%;flex-shrink:0;white-space:normal;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.glide__slide a{user-select:none;-webkit-user-drag:none;-moz-user-select:none;-ms-user-select:none}.glide__arrows{-webkit-touch-callout:none;user-select:none}.glide__bullets{-webkit-touch-callout:none;user-select:none}.glide--rtl{direction:rtl}/*# sourceMappingURL=glide.core.min.css.map */ /*#endregion assets/css/js/glidejs/css/glide.core.min.css*/ /*#region assets/css/js/glidejs/css/glide.theme.min.css*/ .glide__arrow{position:absolute;display:block;top:50%;z-index:2;color:#fff;text-transform:uppercase;padding:9px 12px;background-color:transparent;border:2px solid rgba(255,255,255,.5);border-radius:4px;box-shadow:0 .25em .5em 0 rgba(0,0,0,.1);text-shadow:0 .25em .5em rgba(0,0,0,.1);opacity:1;cursor:pointer;transition:opacity 150ms ease,border 300ms ease-in-out;transform:translateY(-50%);line-height:1}.glide__arrow:focus{outline:none}.glide__arrow:hover{border-color:#fff}.glide__arrow--left{left:2em}.glide__arrow--right{right:2em}.glide__arrow--disabled{opacity:.33}.glide__bullets{position:absolute;z-index:2;bottom:2em;left:50%;display:inline-flex;list-style:none;transform:translateX(-50%)}.glide__bullet{background-color:rgba(255,255,255,.5);width:9px;height:9px;padding:0;border-radius:50%;border:2px solid transparent;transition:all 300ms ease-in-out;cursor:pointer;line-height:0;box-shadow:0 .25em .5em 0 rgba(0,0,0,.1);margin:0 .25em}.glide__bullet:focus{outline:none}.glide__bullet:hover,.glide__bullet:focus{border:2px solid #fff;background-color:rgba(255,255,255,.5)}.glide__bullet--active{background-color:#fff}.glide--swipeable{cursor:grab;cursor:-moz-grab;cursor:-webkit-grab}.glide--dragging{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}/*# sourceMappingURL=glide.theme.min.css.map */ /*#endregion assets/css/js/glidejs/css/glide.theme.min.css*/ /*#region assets/css/styles.css*/ /* roboto-condensed-300 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: normal; font-weight: 300; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-300italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: italic; font-weight: 300; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-300italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-regular - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: normal; font-weight: 400; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: italic; font-weight: 400; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-700 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: normal; font-weight: 700; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-condensed-700italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto Condensed'; font-style: italic; font-weight: 700; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-condensed-v25-latin-700italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */ } /* roboto-300 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-300italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 300; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-regular - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 400; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-700 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 700; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-700italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 700; src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.eot'); /* IE9 Compat Modes */ src: url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('https://test.trailer2go.de/assets/css/../fonts/roboto-v30-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */ } :root { --color-blue-dark: #114d7e; --color-blue-light: #009ee1; --color-gray: #ededed; --color-font: #333333; } body, html { width: 100%; min-height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; scrollbar-width: thin; scrollbar-height: thin; scrollbar-color: var(--color-theme-black-25) #FFFFFF; } html { height: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -ms-text-size-adjust: 100%; overflow: auto; } body { display: block; position: relative; margin: 0px; padding: 0px; overflow: visible; background-color: #FFFFFF; box-sizing: border-box; background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; } body * { scrollbar-width: thin; scrollbar-height: thin; } ::-webkit-scrollbar { width: 5px; height: 5px; background: #FFFFFF; } ::-webkit-scrollbar-track { background: #ffffff; } ::-webkit-scrollbar-thumb { background: var(--color-theme-black-25); } .Hover ::-webkit-scrollbar-thumb:hover { background: var(--color-theme-black-50); } ::-webkit-scrollbar-button { width: 0; height: 0; display: none; } ::-webkit-scrollbar-corner { background: transparent; } body,h1,h2,h3,h4,a,p,ul,ol,div,font,textarea,label { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; font-weight: normal; color: #3d3d40; line-height: 18px; padding: 0px; margin: 0px; } body.Backend { background-image: url(https://test.trailer2go.de/assets/css/../images/backgrounds/backend.jpg); background-size: cover; background-attachment: fixed; background-repeat: no-repeat; background-position: center; } td,tr { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; font-weight: normal; color: #333333; line-height: 18px; margin: 0px; } p { display: block; text-align: left; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 16px; text-decoration: none; font-weight: normal; color: #333333; line-height: 22px; padding: 0px; margin-bottom: 10px; } ul, ol { display: block; text-align: left; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; font-weight: normal; color: #333333; line-height: 18px; margin: 10px 0px 10px 15px; padding: 0px 0px 0px 10px; } form, input { margin: 0px; } blockquote { display: block; margin: 0px 3%; } input[type="text"], input[type="email"], input[type="search"], input[type="password"] { -webkit-appearance: caret; -moz-appearance: caret; } input, textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border:none; border-radius: 0; width: auto; max-width: 100%; border: 1px solid #c7c7c7; padding: 6px 16px 6px 6px; background-color: white; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_dropdown.png); background-position: right; background-repeat: no-repeat; background-size: 20px; } select:hover { border: 1px solid var(--color-theme-dark); cursor: pointer; } select::-ms-expand { display: none; } /* graceful degradation for ie8 */ input[type='checkbox'], input[type='radio'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; font-size: 1em; width: 1px; height: 1px; float: left; margin-right: 10px; background: transparent; border: none; } input[type='checkbox']:checked, input[type='checkbox']:not(:checked), input[type='radio']:checked, input[type='radio']:not(:checked) { background: transparent; position: relative; visibility: hidden; margin: 0; padding: 0; } input[type='checkbox'] + label, input[type='radio'] + label { display: block; cursor: pointer; padding: 0px 0px 0px 25px; position: relative; } input[type='checkbox']:checked + label::before, input[type='checkbox']:not(:checked) + label::before, input[type='radio']:checked + label::before, input[type='radio']:not(:checked) + label::before { content:' '; display: inline-block; width: 14px; height: 14px; position: relative; top: 3px; border: 1px solid #c7c7c7; background: white; margin-right: 8px; margin-left: -25px; /*box-shadow: inset 0 1px 1px 0 rgba(0,0,0,.1);*/ } input[type='radio']:checked + label::before, input[type='radio']:not(:checked) + label::before { border-radius: 50%; } input[type='checkbox']:hover + label::before, input[type='radio']:hover + label::before { box-shadow: inset 0 0 0 3px white; border: 1px solid var(--color-theme-dark); } input[type='checkbox']:checked + label::before, input[type='radio']:checked + label::before { background: var(--color-theme-dark); box-shadow: inset 0 0 0 3px white; } /* graceful degradation for ie8 */ input[type='text'], input[type='email'], input[type='tel'], input[type='text'], input[type='date'], input[type='time'], input[type='password'], input[type='textarea'], textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; border: 1px solid #dedede; } input[type='text']:disabled, input[type='email']:disabled, input[type='tel']:disabled, input[type='date']:disabled, input[type='time']:disabled, input[type='password']:disabled, input[type='textarea']:disabled, select:disabled, textarea:disabled { border: 1px dashed #dedede; } input[type='text']:hover, input[type='email']:hover, input[type='tel']:hover, input[type='date']:hover, input[type='time']:hover, input[type='password']:hover, input[type='textarea']:hover, textarea:hover { border: 1px solid var(--color-theme-dark); } input[type='date'], input[type='time'] { cursor: pointer; -webkit-appearance: revert; -moz-appearance: revert; appearance: auto; } input[type='date']::-webkit-calendar-picker-indicator, input[type="time"]::-webkit-calendar-picker-indicator { -webkit-appearance: revert; -moz-appearance: revert; appearance: auto; background-position: right center; background-size: 20px auto; cursor: pointer; position: absolute; bottom: 0; left: 0; right: 0; top: 0; width: auto; height: auto; } .ui-timepicker-standard { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif !important; font-size: 13px !important; text-decoration: none !important; color: #333333 !important; padding: 0 !important; line-height: 18px; z-index: 99999 !important; box-sizing: border-box !important; max-width: 100%; min-width: 80px !important; } .ui-timepicker-standard, .ui-timepicker-standard * { -moz-transition: none; -ms-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } .ui-timepicker, .ui-timepicker-viewport { border: none !important; box-sizing: border-box !important; width: auto !important; padding: 5px 0 !important; } .ui-timepicker { padding: 5px !important; } .ui-timepicker-viewport { padding: 0 5px 0px 0px; list-style: none; } .ui-menu-item { margin: 0 0 0 0 !important; box-sizing: border-box !important; width: auto !important; max-width: 100%; } .Scrolling { font-size: 13px; text-decoration: none; font-weight : normal; color: #333333; line-height: 18px; } fieldset { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; font-weight : normal; color: #333333; line-height: 18px; padding: 0px 20px 20px 20px; margin-bottom: 20px; border: 1px solid #c7c7c7; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); text-align: left; } legend { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: var(--color-theme-dark); font-weight: bold; font-style: normal; line-height: 20px; padding: 0px 10px; margin: 0px; margin-bottom: 3px; text-align: left; } header, main, footer, a, li, ul, dl, dd, dt, img, input, textarea, select, button, nav { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } table .Top { padding-top: 6px; vertical-align: top; } table .Bottom { padding-bottom: 6px; vertical-align: bottom; } .NoPadding { padding: 0px !important; } .NoMargin { margin: 0px !important; } .Hidden { display: none !important; } .FloatLeft { float: left !important; } .FloatRight { float: right !important; } .TextLeft { text-align: left; } .TextRight { text-align: right; } .TextCenter { text-align: center; } .Clear { clear: both; width: 0px; height: 0px; float: none; margin: 0px !important; padding: 0px !important; } .Columns:after, .CheckboxList:after, .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .ie7 .Columns, .ie7 .CheckboxList, .ie7 .clearfix { zoom: 1; } /* IE7 */ .childs-left > * { float: left; margin-right: 10px !important; } .Columns { display: block; box-sizing: border-box; text-align: center; margin: 0px auto; } .Column50Left, .Column50Right { display: inline-block; float: left; width: 48%; margin: 0px 2% 0px 0px; text-align: left; box-sizing: border-box; } .Column50Right { margin: 0px 0px 0px 2%; } .Frontend .Column50Left, .Frontend .Column50Right { width: 48%; margin: 0px 2% 0px 0px; } .Frontend .Column50Right { margin: 0px 0px 0px 2%; } .BlockSingle, .BlockHalf, .BlockThird, .BlockQuarter { position: relative; display: inline-block; float: left; width: 96%; margin: 1.5%; padding: 1.5%; box-sizing: border-box; border-radius: 0; border: 1px solid #c7c7c7; cursor: pointer !important; -webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); } .BlockHalf { width: 47%; } .BlockThird { width: 30%; min-height: 100px; } .BlockQuarter { width: 22%; } .BlockSingle *, .BlockHalf *, .BlockThird *, .BlockQuarter * { display: block; } .BlockSingle p, .BlockHalf p, .BlockThird p, .BlockQuarter p { display: block; font-size: 13px; line-height: 18px; margin: 0px 0px 5px 0px; } .BlockSingle b, .BlockHalf b, .BlockThird b, .BlockQuarter b { margin: 0px 0px 5px 0px; text-align: left; } .BlockSingle span, .BlockHalf span, .BlockThird span, .BlockQuarter span { position: relative; margin: 15px 0px 0px 0px; padding: 15px 0px 0px 0px; /*margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; opacity: 0; height: 0;*/ text-align: left; } .BlockSingle .Selected span, .BlockHalf.Selected span, .BlockThird.Selected span, .BlockQuarter.Selected span { margin: 15px 0px 0px 0px; padding: 15px 0px 0px 0px; opacity: 1; height: auto; } .BlockSingle span:before, .BlockHalf span:before, .BlockThird span:before, .BlockQuarter span:before { position: absolute; top: 0px; left: 0; right: 0; content: ""; text-decoration: none; line-height: 1px !important; height: 1px !important; min-height: initial !important; font-size: 0px !important; background: none !important; background-image: none; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_glue_horz.png) !important; padding: 0px !important; margin: 0px !important; min-height: auto !important; } .BlockSingle .ChechkboxList, .BlockHalf .CheckboxList, .BlockThird .CheckboxList, .BlockQuarter .CheckboxList { padding: 5px 15px; } .BlockSingle a, .BlockHalf a, .BlockThird a, .BlockQuarter a { overflow-x: hidden; } .Inverted { filter:invert(100%); filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1'); -webkit-filter:invert(100%); -o-filter:invert(100%); -moz-filter:invert(100%); -ms-filter:invert(100%); } .Highlight { color: var(--color-theme-dark); font-weight: bold; } .NoDisplay { display: none; } .NoSpace { text-decoration: none; color: #e9e9e9; line-height: 0px; height: 0px; font-size: 0px; padding: 0px; margin: 0px; } .Space1 { text-decoration: none; color: #333333; line-height: 1px; font-size: 1px; height: 1px; padding: 0px; margin: 0px; } .Space { text-decoration: none; color: #333333; line-height: 2px; font-size: 2px; height: 2px; padding: 0px; margin: 0px; } .Space5 { text-decoration: none; color: #333333; line-height: 5px; font-size: 5px; height: 5px; padding: 0px; margin: 0px; } .Space10 { text-decoration: none; color: #333333; line-height: 10px; font-size: 10px; height: 10px; padding: 0px; margin: 0px; } .Space15 { text-decoration: none; color: #333333; line-height: 15px; font-size: 15px; height: 15px; padding: 0px; margin: 0px; } .Space20 { text-decoration: none; color: #333333; line-height: 20px; font-size: 20px; height: 20px; padding: 0px; margin: 0px; } .Space30 { text-decoration: none; color: #333333; line-height: 30px; font-size: 30px; height: 30px; padding: 0px; margin: 0px; } .Space40 { text-decoration: none; color: #333333; line-height: 40px; font-size: 40px; height: 40px; padding: 0px; margin: 0px; } .Space50 { text-decoration: none; color: #333333; line-height: 50px; font-size: 50px; height: 50px; padding: 0px; margin: 0px; } .Space60 { text-decoration: none; color: #333333; line-height: 60px; font-size: 60px; height: 60px; padding: 0px; margin: 0px; } .Line { text-decoration: none; line-height: 1px !important; height: 1px !important; min-height: initial !important; font-size: 0px !important; background: none !important; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_glue_horz.png) !important; padding: 0px !important; margin: 0px !important; min-height: auto !important; } .LineSolid { text-decoration: none; line-height: 1px !important; height: 1px !important; min-height: initial !important; font-size: 0px !important; background: none !important; background-color: #c5c5c5 !important; padding: 0px !important; margin: 0px !important; min-height: auto !important; } .LineVertikal { text-decoration: none; line-height: 1px; font-size: 1px; width: 1px; background: none !important; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_glue_vert.png) !important; padding: 0px; margin: 0px; min-height: auto !important; } .Border { display: block; overflow: hidden; margin: 0px; padding: 0px; background-color: #FFFFFF; border: 1px solid #c7c7c7; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.5); } .Display { display: block; } .Header { display: block; position: fixed; z-index: 50; top: 0px; left: 0px; right: 0px; height: auto; width: auto; margin: 0px; padding: 0px; background-color: #FFFFFF; overflow: visible; } .Titlebar { display: block; position: relative; z-index: 50; top: 0px; left: 0px; height: 80px; max-height: 80px; width: 100%; overflow: hidden; margin: 0px; padding: 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/blank.gif) no-repeat 30px center; background-size: auto 80%; } .Content { display: block; position: relative; top: 130px; left: 0px; bottom: 0px; right: 0px; width: auto; height: auto; /*overflow: auto;*/ z-index: 10; padding: 2% 2%; margin: 0px; text-align: left; } .Content.NoTitlebar { top: 40px; } .Content .Container { display: block; text-align: left; -webkit-transition: opacity 0s 0s ease-in-out, margin 0.3s linear; -moz-transition: opacity 0s 0s ease-in-out, margin 0.3s linear; -ms-transition: opacity 0s 0s ease-in-out, margin 0.3s linear; -o-transition: opacity 0s 0s ease-in-out, margin 0.3s linear; transition: opacity 0s 0s ease-in-out, margin 0.3s linear; } .Content .Sidebar { display: block; position: fixed; z-index: 6000; width: 340px; height: auto; min-height: 450px; top: 120px; bottom: 0px; left: -395px; text-align: left; overflow: auto; margin: 0px; padding: 2.7% 40px 30px 30px; cursor: pointer; /*background: rgba(50, 50, 50, 0.5) url(https://test.trailer2go.de/assets/css/../images/bg/bg_sidebar.png) no-repeat 100% 50%;*/ background: rgba(0,0,0,0.5) url(https://test.trailer2go.de/assets/css/../images/bg/bg_sidebar.png) no-repeat 100% 50%; -webkit-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); -webkit-transition: opacity 0.2s 0.3s ease-in-out, left 0.3s linear; -moz-transition: opacity 0.2s 0.3s ease-in-out, left 0.3s linear; -ms-transition: opacity 0.2s 0.3s ease-in-out, left 0.3s linear; -o-transition: opacity 0.2s 0.3s ease-in-out, left 0.3s linear; transition: opacity 0.2s 0.3s ease-in-out, left 0.3s linear; } .Content.NoSidebar { margin: 0px auto 30px auto; max-width: 1100px; position: relative; } .Content.ShowSidebar { margin: 0px 0px 0px 410px; max-width: initial; } .Content.ShowSidebar .Sidebar { left: 0px; -webkit-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -moz-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -ms-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -o-transition: opacity 0s 0s ease-in-out, left 0.3s linear; transition: opacity 0s 0s ease-in-out, left 0.3s linear; } .Content .Info { display: block; position: fixed; z-index: 6000; width: 0px; height: auto; min-height: 450px; top: 130px; bottom: 0px; right: 0px; text-align: left; overflow: hidden; margin: 2% 0% 2% 0%; padding: 0px; cursor: auto; background-color: #FFFFFF; border: 1px solid #c5c5c5; filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; -webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); -webkit-transition: opacity 0.2s 0.3s ease-in-out, margin 0.3s linear, width 0.3s linear; -moz-transition: opacity 0.2s 0.3s ease-in-out, margin 0.3s linear, width 0.3s linear; -ms-transition: opacity 0.2s 0.3s ease-in-out, margin 0.3s linear, width 0.3s linear; -o-transition: opacity 0.2s 0.3s ease-in-out, margin 0.3s linear, width 0.3s linear; transition: opacity 0.2s 0.3s ease-in-out, margin 0.3s linear, width 0.3s linear; } .Content.ShowInfo .Info { width: 66%; margin-right: 2%; z-index: 5000; -webkit-transition: opacity 0s 0s ease-in-out, margin 0.3s linear, width 0.3s linear; -moz-transition: opacity 0s 0s ease-in-out, margin 0.3s linear, width 0.3s linear; -ms-transition: opacity 0s 0s ease-in-out, margin 0.3s linear, width 0.3s linear; -o-transition: opacity 0s 0s ease-in-out, margin 0.3s linear, width 0.3s linear; transition: opacity 0s 0s ease-in-out, margin 0.3s linear, width 0.3s linear; } .Content.ShowInfo .Sidebar { -webkit-transition: opacity 0s 0s ease-in-out, left 0.3s 0.3s linear; -moz-transition: opacity 0s 0s ease-in-out, left 0.3s 0.3s linear; -ms-transition: opacity 0s 0s ease-in-out, left 0.3s 0.3s linear; -o-transition: opacity 0s 0s ease-in-out, left 0.3s 0.3s linear; transition: opacity 0s 0s ease-in-out, left 0.3s 0.3s linear; } .Content.ShowInfo .Sidebar:hover { left: 0px; /*background: rgba(7,51,112, 1) url(https://test.trailer2go.de/assets/css/../images/bg/bg_sidebar.png) no-repeat 100% 50%;*/ background: rgba(50,50,50, 0.9) url(https://test.trailer2go.de/assets/css/../images/bg/bg_sidebar.png) no-repeat 100% 50%; -webkit-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -moz-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -ms-transition: opacity 0s 0s ease-in-out, left 0.3s linear; -o-transition: opacity 0s 0s ease-in-out, left 0.3s linear; transition: opacity 0s 0s ease-in-out, left 0.3s linear; } .Content.ShowInfo .Container { margin: 0px 72% 0px 0px; } .Content.NoTitlebar .Sidebar, .Content.NoTitlebar .Info { top: 40px; } .Content .Info .InfoTitle { display: none; } .Button { display: inline-block; font-size: 13px; text-decoration: none; font-weight: bold; color: #333333; border: 1px solid #919090; line-height: 18px; padding: 8px 25px 8px 45px; cursor: pointer; outline: none; margin: 0px; text-align: center; background-color: #FFFFFF; background: transparent url(https://test.trailer2go.de/assets/css/../images/buttons/button.png) no-repeat left center; /*text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);*/ -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.3); } .Button:hover { text-decoration: none; color: var(--color-theme-dark); } .Button.Inline { padding: 5px 20px 5px 45px; } .ButtonSmall { font-size: 11px; text-decoration: none; font-weight: bold; color: #333333; border: 1px solid #919090; line-height: 13px; padding: 4px 15px 4px 35px; margin: 0px; cursor: pointer; outline: none; background-image: url(https://test.trailer2go.de/assets/css/../images/buttons/button.png); /*text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);*/ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.1); } .ButtonSmall:hover { color: var(--color-theme-dark); } .ButtonImage { font-size: 13px; text-decoration: none; font-weight: bold; line-height: 18px; margin: 5px 5px 0px 5px; color: #333333; cursor: pointer; } .ButtonBox, .ButtonBoxActive, .ButtonBoxInactive, .ButtonIcon, .ButtonIconActive, .ButtonIconInactive { display: inline-block; font-size: 13px; text-decoration: none; font-weight: bold; color: #333333; border: 1px solid var(--color-theme-light); line-height: 18px; padding: 7px; cursor: pointer; outline: none; margin: 0px; text-align: center; background-color: #FFFFFF; background: transparent url(https://test.trailer2go.de/assets/css/../images/buttons/button.png) no-repeat left center; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); } .ButtonIcon, .ButtonIconActive, .ButtonIconInactive { padding: 4px; } .ButtonBox:hover, .ButtonBoxActive:hover, .ButtonBoxInactive:hover, .ButtonIcon:hover, .ButtonIconActive:hover, .ButtonIconInactive:hover { text-decoration: none; color: var(--color-theme-dark); border: 1px solid var(--color-theme-dark); } .ButtonBoxActive, .ButtonBoxInactive, .ButtonIconActive, .ButtonIconInactive { color: var(--color-theme-dark); border: 1px solid var(--color-theme-dark); } .ButtonBoxInactive, .ButtonIconInactive { filter: alpha(opacity=40); -moz-opacity: 0.4; opacity: 0.4; } .ButtonBoxInactive:hover { filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; } .ButtonCalendar { display: inline-block; font-size: 13px; text-decoration: none; font-weight: bold; color: #333333; line-height: 18px; padding: 4px; cursor: pointer; outline: none; margin: 4px 0px 4px 7px; box-sizing: border-box; vertical-align: top; text-align: center; width: 20px; height: 20px; border: none; background: transparent url(https://test.trailer2go.de/assets/css/../images/actions/calendar.png) no-repeat center; -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); } .CheckboxContainer { display: inline-block; position: relative; clear: both; line-height: 24px; } .FixedCheckboxes .CheckboxContainer { width: 200px; margin: 0px 20px 0px 0px; } .CheckboxList { display: block; text-align: left; } .CheckboxList .CheckboxContainer { width: 48%; margin: 0px 2% 5px 0px; box-sizing: border-box; clear: none; float: left; } .CheckboxList.Onerow .CheckboxContainer { width: 100%; margin: 0px 0px 5px 0px; clear: both; float: none; } .CheckboxList.Oneline .CheckboxContainer { width: auto; margin: 0px 20px 5px 0px; line-height: 24px; } .Checkbox { display: inline-block; float: left; margin: 0px 10px 0px 0px; padding: 0px; width: 15px; height: 15px; cursor: pointer; } .BlockHalf .CheckboxList .CheckboxContainer, .BlockThird .CheckboxList .CheckboxContainer, .BlockQuarter .CheckboxList .CheckboxContainer { width: 100%; margin: 0px 0px 5px 0px; clear: both; float: none; } .Field, .FieldSmall, .FieldActive, .FieldInactive, .FieldSlider, .FieldColor, .FieldFilterInput, .FieldSearch { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #333333; padding: 6px; line-height: 18px; height: 30px; background-color: #FFFFFF; border: 1px solid #c7c7c7; max-width: 100%; box-sizing: border-box; } .Field::placeholder, .FieldSmall::placeholder, .FieldActive::placeholder, .FieldInactive::placeholder, .FieldSlider::placeholder, .FieldColor::placeholder, .FieldFilterInput::placeholder, .FieldSearch::placeholder { color: #999999; font-style: italic; } .FieldSmall { padding: 3px 6px; height: 24px; } .FieldInactive { color: #666666; font-style: italic; border-style: dashed !important; } .FieldActive { background: none; background-color: #e6e6e6; } .FieldLoginUser { background: transparent url(https://test.trailer2go.de/assets/css/../images/bg/bg_login_user.png) no-repeat 7px 50%; font-size: 13px; line-height: 18px; padding: 6px 6px 6px 30px !important; border-style: solid !important; } .FieldLoginPassword { background: transparent url(https://test.trailer2go.de/assets/css/../images/bg/bg_login_password.png) no-repeat 6px 50%; font-size: 13px; line-height: 18px; padding: 6px 6px 6px 30px !important; border-style: solid !important; } .FieldColor { cursor: pointer; } .FieldFile, .FieldFileIcon { cursor: pointer; top: 0; left: 0; display: block; position: relative; overflow: hidden; width: 240px; min-height: 32px; text-align: right; background: url(https://test.trailer2go.de/assets/css/../images/input/file.png) no-repeat right center; cursor: pointer; } .FieldFile:hover, .FieldFileIcon:hover { background: url(https://test.trailer2go.de/assets/css/../images/input/file_active.png) no-repeat right center; } .FieldFile.FileImagePreview, .FieldFile.FileImagePreview:hover { background: right top; } .FieldFile.FileImagePreview .FieldFileSelect { background: url(https://test.trailer2go.de/assets/css/../images/input/file.png) no-repeat right top; } .FieldFile.FileImagePreview:hover .FieldFileSelect { background: url(https://test.trailer2go.de/assets/css/../images/input/file_active.png) no-repeat right top; } .FieldFileIcon, .FieldFileIcon:hover { height: 30px; width: 30px; } .FieldFileInput, .FieldFileInputIcon { display: block; float: right; right: 0px; top: 0px; position: absolute; z-index: 1; border: none; padding: 0px; line-height: 18px; height: 30px; width: 240px; -moz-opacity: 0; opacity: 0; cursor: pointer; } .FieldFileInputIcon { padding: 0px; } .FieldFileText, .FieldFilePreview, .FieldFileSelect { display: block; left: 0px; top: 0px; position: absolute; z-index: 2; font-size: 13px; text-decoration: none; color: #333333; padding: 5px 6px; line-height: 18px; border: 1px solid #c7c7c7; background-color: #FFFFFF; width: 240px; pointer-events: none; -moz-opacity: 1; opacity: 1; } .FieldFilePreview, .FieldFileSelect { position: absolute; display: block; z-index: 10; width: 100%; height: 100%; box-sizing: border-box; } .FieldFileSelect { z-index: 20; margin: 2%; width: 96%; height: 96%; border: none; text-align: center; text-shadow: 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF, 0px 0px 10px #FFFFFF; } .FieldFilterContainer { position: relative; display: inline-block; z-index: 1; max-width: 100%; } .FieldFilterInput { font-size: 13px; text-decoration: none; color: #333333; padding: 6px; line-height: 18px; border: 1px solid #c7c7c7; background-color: #FFFFFF; max-width: 100%; } .FieldFilterText { position: relative; display: block; z-index: 10; } .FieldFilterList { position: absolute; top: 0px; left: 0px; width: 100%; height: 200px; overflow-y: auto; overflow-x: hidden; z-index: 500; display: none; margin: 0px; padding: 5px; border: 1px solid #c7c7c7; background-color: #FFFFFF; } .FieldExplorerPreview { display: block; float: left; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #333333; padding: 6px; line-height: 18px; border: 1px solid #c7c7c7; background-color: #f9f9f9; max-width: 75%; } .FieldExplorerPreview img { /*margin: -3px -3px -6px -3px;*/ margin: 0px 0px -4px 0px; max-width: 100%; } .FieldExplorerAction { display: block; float: left; } .FieldSearchAlphabet { font-size: 13px; font-weight: bold; text-decoration: none; color: #333333; border: 1px solid #c7c7c7; padding: 1px; margin: 2px 2px; float: left; display: block; width: 13px; text-align: center; } .Select, .SelectSmall, .SelectCheckboxes { position: relative; display: inline-block; font-size: 13px; text-decoration: none; line-height: 18px; font-weight: 300; height: 30px; color: #333333; padding: 6px 20px 6px 6px; border: 1px solid #c7c7c7; background-color: #FFFFFF; margin: 0px; cursor: pointer; vertical-align: middle; box-sizing: border-box; max-width: 100%; } .Frontend .Select, .Frontend .SelectSmall, .Frontend .SelectCheckboxes { height: auto; padding: 5px 20px 5px 10px; border: 1px solid #dedede; background-color: #ffffff; text-align: left; font-family: "Roboto Condensed", sans-serif; font-size: 16px; line-height: 22px; font-weight: normal; text-decoration: none; color: var(--color-font); } .SelectSmall { padding: 3px 20px 3px 6px; height: 24px; } .SelectCheckboxes { position: relative; width: auto; display: inline-block; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_dropdown.png); background-position: right; background-repeat: no-repeat; background-size: 20px; padding: 6px 25px 6px 6px; } .SelectCheckboxes:hover { border: 1px solid var(--color-theme-dark); cursor: pointer; } .SelectCheckboxes::-ms-expand { display: none; } .SelectCheckboxes ul { display: block; position: relative; z-index: 5100; padding: 0px; margin: 7px 0px 0px -7px; top: 0px; left: -2000px; width: auto; min-width: 420px; max-width: initial; max-height: 300px; overflow: auto; padding: 10px 15px; background-color: #FFFFFF; border: 1px solid #c7c7c7; -webkit-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.25); filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; -webkit-transition: opacity 0.2s 0.3s ease-in-out, left 0s linear 0.1s; -moz-transition: opacity 0.2s 0.3s ease-in-out, left 0s linear 0.1s; -ms-transition: opacity 0.2s 0.3s ease-in-out, left 0s linear 0.1s; -o-transition: opacity 0.2s 0.3s ease-in-out, left 0s linear 0.1s; transition: opacity 0.2s 0.3s ease-in-out, left 0s linear 0.1s; } .SelectCheckboxes:hover ul { left: 0px; filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; -webkit-transition: opacity 0s 0s ease-in-out, left 0s linear 0s; -moz-transition: opacity 0s 0s ease-in-out, left 0s linear 0s; -ms-transition: opacity 0s 0s ease-in-out, left 0s linear 0s; -o-transition: opacity 0s 0s ease-in-out, left 0s linear 0s; transition: opacity 0s 0s ease-in-out, left 0s linear 0s; } .SelectCheckboxes ul li { width: 180px; margin: 0px 20px 0px 0px; /*white-space: nowrap; overflow: hidden;*/ display: block; line-height: 24px; /*overflow-x: hidden; overflow-y: visible;*/ } .SelectCheckboxes ul li label { font-size: 13px; } .SelectAssigning { font-size: 13px; text-decoration: none; color: #333333; padding: 0px 3px 0px 3px; line-height: 18px; border: 1px solid #c7c7c7; background-color: #FFFFFF; margin: 0px; max-width: 100%; box-sizing: border-box; } .SelectBold { font-size: 13px; font-weight: bold; text-decoration: none; color: #333333; padding: 0px 20px 0px 3px; line-height: 18px; border: 1px solid #c7c7c7; background-color: #FFFFFF; margin: 0px; max-width: 100%; box-sizing: border-box; } .Fieldtextarea, .FieldtextareaInactive { font-size: 13px; text-decoration: none; color: #333333; line-height: 18px; padding: 6px; border: 1px solid #c7c7c7; background-color: #FFFFFF; max-width: 100%; box-sizing: border-box; } .FieldtextareaInactive { color: #666666; font-style: italic; } .FloatChilds * { float: left; margin-right: 5px; } A { text-decoration: none; color: #114d7e; font-weight: inherit; font-size: inherit; font-style: inherit; line-height: inherit; } A:hover { text-decoration: underline; color: #114d7e; opacity: 0.6; } .Information, .Error, .Warning, .Success { display: inline-block; font-size: 13px; text-decoration: none; color: #333333; font-weight: normal; line-height: 20px; box-sizing: border-box; padding: 20px 15% 20px 20px; width: 100%; border-left-width: 10px; border-left-style: solid; margin-bottom: 10px; text-align: left; } .Information { border-left-color: var(--color-theme-dark); background: var(--color-theme-dark-15); } .Error { border-left-color: #dc143c; background: rgba(220, 20, 60, 0.15); text-align: left; } .Error ul { margin-bottom: 0px; } .Error > div { font-weight: 500; font-size: 16px; margin-top: 10px; } .Error *, .Error div { color: #000000 !important; } .Warning { border-left-color: #ff8c03; background: rgba(255, 140, 0, 0.15); } .Success { border-left-color: #2e8b57; background: rgba(46, 139, 87, 0.15); } .Information p:last-child, .Error p:last-child, .Warning p:last-child, .Success p:last-child { margin-bottom: 0; } /* fieldset .Information { background-color: rgba(7, 5 , 112, 0.05); } fieldset .Error { background-color: rgba(220, 20, 60, 0.05); } fieldset .Warning { background-color: rgba(255, 140, 0, 0.05); } fieldset .Success { background-color: rgba(46, 139, 87, 0.05); } */ td .Information, .Box .Information, td .Error, .Box .Error, td .Warning, .Box .Warning, td .Success, .Box .Success { padding: 10px; box-sizing: border-box; width: 100%; } .Preloader { position: absolute; z-index: 99990; width: 100%; height: 100%; top: 0px; left: 0px; overflow:hidden; background-color: #333333; opacity: 0.5; display: none; } .LoadingRequest { background: #FFFFFF url(https://test.trailer2go.de/assets/css/../images/loading.svg) no-repeat center; min-width: 100%; min-height: 60px; font-size: 13px; text-decoration: none; color: #333333; font-weight: bold; line-height: 20px; padding: 0px 0px 60px 0px; } .Loading { position: fixed; z-index: 99999; width: 140px; height: auto; top: 50%; left: 50%; margin-top: -25px; margin-left: -100px; display: block; overflow: hidden; text-align: left; vertical-align: middle; background: #FFFFFF url(https://test.trailer2go.de/assets/css/../images/loading.svg) no-repeat 15px center; background-size: 40px auto; /*border: 1px solid #c7c7c7; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;*/ -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3); padding: 15px 15px 15px 80px; font-size: 20px; text-decoration: none; color: #333333; font-weight: 500; line-height: 30px; } .Actions { position: absolute; z-index: 99999; width: 1px; height: 1px; top: -99999px; left: -99999px; visibility: hidden; display: none; overflow: hidden; } .ErrorBackground, .MessageBackground, .ConfirmBackground { position: fixed; display: none; z-index: 9999; left: 0px; top: 0px; width: 100%; height: 100%; background-color: #666666; cursor: pointer; -webkit-opacity: 0.70; -moz-opacity: 0.70; opacity: 0.70; } .ErrorContainer, .MessageContainer, .ConfirmContainer { display: block; overflow: auto; position: fixed; z-index: 100; top: 0px; left: 0px; width: auto; max-width: 70%; height: auto; max-height: 70%; padding: 30px 30px; text-align: center; background-color: #FFFFFF; border: 1px solid #919090; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); } .ErrorContainer .Message, .MessageContainer .Message, .ConfirmContainer .Message { display: block; max-width: 400px; box-sizing: border-box; text-align: left; font-size: 13px; text-decoration: none; color: #e20202; font-weight: bold; line-height: 20px; } .ErrorContainer .Message *, .MessageContainer .Message *, .ConfirmContainer .Message * { display: block; position: relative; box-sizing: border-box; text-align: left; font-size: 13px; text-decoration: none; color: #e20202; font-weight: bold; line-height: 20px; list-style: none; } .ErrorContainer .Message li:before, .MessageContainer .Message li:before, .ConfirmContainer .Message li:before { content: ">"; display: inline-block; margin: 0px 0px 0px -15px; position: absolute; } .MessageContainer .Message, .ConfirmContainer .Message { color: #333333; } .ErrorContainer .Close, .MessageContainer .Close, .ConfirmContainer .Yes, .ConfirmContainer .No { display: inline-block; font-size: 13px; text-decoration: none; font-weight: bold; color: #333333; border: 1px solid #919090; line-height: 18px; padding: 8px 25px 8px 45px; cursor: pointer; outline: none; margin: 20px 5px 0px 5px; text-align: center; background-color: #FFFFFF; background: transparent url(https://test.trailer2go.de/assets/css/../images/buttons/button_accept.png) no-repeat left center; /*text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);*/ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); } .ConfirmContainer .No { background: transparent url(https://test.trailer2go.de/assets/css/../images/buttons/button_cancel.png) no-repeat left center; } .ErrorContainer .Close:hover, .MessageContainer .Close:hover, .ConfirmContainer .Yes:hover, .ConfirmContainer .No:hover { text-decoration: none; color: var(--color-theme-dark); } .Title { font-size: 26px; text-decoration: none; color: #000000; font-weight: bold; font-style : normal; line-height: 26px; padding: 0px; margin-top: 0px; margin-bottom: 10px; letter-spacing: 0.5px; } .Subtitle { font-size: 15px; text-decoration: none; color: var(--color-theme-dark); font-weight: bold; font-style : normal; line-height: 24px; padding: 0px; margin-top: 0px; margin-bottom: 10px; } .Textnormal { font-size: 15px; text-decoration: none; color: #333333; line-height: 24px; } .TextnormalWhite { font-size: 15px; text-decoration: none; color: #FFFFFF; line-height: 24px; } .Textbold { font-size: 15px; text-decoration: none; color: #333333; font-weight: bold; line-height: 24px; } .TextboldActive { font-size: 15px; text-decoration: none; color: var(--color-theme-dark); font-weight: bold; line-height: 24px; } .TextboldWhite { font-size: 15px; text-decoration: none; color: #FFFFFF; font-weight: bold; line-height: 24px; } .Textsmall { font-size: 13px; text-decoration: none; color: #333333; line-height: 17px; } .TextsmallBold { font-size: 13px; text-decoration: none; color: #333333; font-weight: bold; line-height: 17px; } .TextsmallBoldActive { font-size: 13px; text-decoration: none; color: var(--color-theme-dark); font-weight: bold; line-height: 17px; } .Backend .Textnormal, .Backend .TextnormalWhite, .Backend .Textbold, .Backend .TextboldActive, .Backend .TextboldWhite { font-size: 13px; line-height: 20px; } .Backend .Textsmall, .Backend .TextsmallBold, .Backend .TextsmallBoldActive { font-size: 11px; line-height: 16px; } .Backend .TextCutted200 .Textbold { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; } .Points { font-size: 13px; text-decoration: none; color: #333333; line-height: 18px; padding: 2px 0px; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_point.png); background-repeat: repeat-x; background-position: bottom; } .PointsText { display: inline; font-size: 13px; text-decoration: none; color: #333333; font-weight: normal; line-height: 18px; background-color: #FFFFFF; } .Sidebar .Title { color: #FFFFFF; font-weight: bold; font-size: 26px; line-height: 32px; letter-spacing: 0.5px; } .Sidebar .Title, .Sidebar .Subtitle, .Sidebar .Textbold, .Sidebar .Textnormal, .Sidebar label { color: #FFFFFF; } .Sidebar .Subtitle, .Sidebar .Subtitle.Line { font-size: 19px !important; font-weight: normal; color: #FFFFFF; line-height: 24px !important; margin: 0px 0px 10px 0px; } .Sidebar .Subtitle.Line { text-decoration: none; height: auto !important; background: none !important; margin: 0px -10px 15px -10px !important; padding: 7px 10px !important; border-bottom: 1px solid #FFFFFF; } .Sidebar .Search { display: block; clear: both; top: 0px; left: 0px; margin: 0px; padding: 0px; background: none; border-radius: 0px; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .Sidebar .Search .FieldSearch { display: inline-block; float: left; width: 250px; } .Sidebar .Search .ButtonImage { display: inline-block; float: left; margin: 6px 0px 6px 10px; } .Sidebar input[type='image'], .Sidebar .FieldFile, .Sidebar .FieldFileInput, .Sidebar .FieldFileText, .Sidebar img { filter:invert(100%); filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1'); -webkit-filter:invert(100%); -o-filter:invert(100%); -moz-filter:invert(100%); -ms-filter:invert(100%); } .SelectObject { font-size: 13px; text-decoration: none; color: #333333; font-weight: normal; padding: 2px 4px 2px 4px; line-height: 18px; cursor: pointer; box-sizing: border-box; } .SelectObjectActive { font-size: 13px; text-decoration: none; color: var(--color-theme-dark); font-weight: normal; padding: 2px 4px 2px 4px; line-height: 18px; cursor: pointer; box-sizing: border-box; } .Info { width: 20px; height: 20px; padding: 0px; margin: 2px 2px 2px 2px; border: none; text-decoration: none; outline: none; cursor: pointer; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } .Info:hover { filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; } .Content .Info .Subtitle { font-size: 13px !important; font-weight: bold; color: #333333; line-height: 20px !important; margin: 0px 0px 10px 0px; } .Duty { display: inline-block; margin: 0px 0px 0px 3px; color: red; font-weight: normal; font-size: 15px; line-height: inherit; } .MapToolbar { padding: 0px 1px 1px 0px; background-color: #e6e6e6; border: solid 1px #cccccc; width: 25px; height: 25px; line-height: 25px; float: left; margin: 0px; } .MapToolbarActive { padding: 1px 0px 0px 1px; background-color: #e5e5e5; border: solid 1px #d3d3d3; width: 25px; height: 25px; line-height: 25px; float: left; margin: 0px; } .RegisterSubDialogs { background-color: #FFFFFF; } #SubdialogRegisters .Register { border-color: var(--color-theme-dark); border-bottom: 0px; } #SubdialogRegisters .Register.Active { border-color: var(--color-theme-dark); border-bottom: 1px solid #FFFFFF; } .Toggle { display: block; position: relative; z-index: 5000; top: 0px; left: 0px; padding: 5px 10px; margin: 0px; background-color: #fbfbfb; border: 1px solid #cccccc; text-align: left; cursor: pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 13px; text-decoration: none; color: #000000; font-weight: bold; padding: 5px 10px; line-height: 18px; } .Toggle:hover { color: var(--color-theme-dark); text-decoration: none; background-color: transparent; } .Toggle .PullRight, .Toggle.Expanded .PullRight, .Toggle.Collapsed .PullRight { margin-right: 0px; margin-top: 6px; border-top: 0 dotted; border-bottom: 6px solid #000000; border-right: 6px solid transparent; border-left: 6px solid transparent; float: right !important; display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; font-size: 20px; } .Toggle.Collapsed .PullRight { border-bottom: 0 dotted; border-top: 6px solid #000000; } .Toggle:hover .PullRight, .Toggle.Expanded:hover .PullRight, .Toggle.Collapsed:hover .PullRight { border-bottom: 6px solid var(--color-theme-dark); } .Toggle.Collapsed:hover .PullRight { border-bottom: 0 dotted; border-top: 6px solid var(--color-theme-dark); } .Register, .Register.Active { display: block; float: left; font-size: 13px; text-decoration: none; color: #000000; font-weight: normal; padding: 5px 10px; line-height: 18px; margin: 0px 5px 0px 0px; white-space: nowrap; display: block; cursor: pointer; /*text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);*/ background-color: #fbfbfb; border: 1px solid #cccccc; border-bottom: 0px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; border-top-right-radius: 3px; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; } .Register:hover, .Register.Active { color: var(--color-theme-dark); text-decoration: none; margin-bottom: -1px; border-bottom: 1px solid #FFFFFF; background-color: transparent; filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; } .Register.Active { font-weight: bold; } .RegisterLine { display: block; clear: both; text-decoration: none; line-height: 1px; height: 1px; font-size: 0px; background-color: #cccccc; } .BoxContent .RegisterLine, .Info .RegisterLine { margin: 0px -20px; } .Info fieldset { display: inline-block; width: auto; } .BoxContent form .Column { display: inline-block; margin-right: 10px; width: 25%; } .BubbleContainer { display: none; position: absolute; top: 0px; left: 0px; width: auto; height: auto; color: #FFFFFF; background: #4C545A; padding: 5px 10px; z-index: 30000; -webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .BubbleContainer .Title { font-family: 'Roboto', sans-serif; display: block; font-size: 13px; font-style: normal; font-weight: normal; line-height: 18px; color: white; /*white-space: pre;*/ margin: 0px; padding: 0px; max-width: 300px; } .BubbleContainer .Tail { display: block; position: absolute; top: 100%; left: 50%; width: 0px; height: 0px; border: 5px solid transparent; border-top: 5px solid #4C545A; font-size: 0px; line-height: 0px; color: white; white-space: pre; padding: 0px; margin: 0 auto; margin-left: -5px; margin-top: 0px; } .FieldSliderContainer .SliderContainer { position: relative; top: 0px; left: 0px; height: 18px; border: 1px solid #c7c7c7; background-color: #FFFFFF; } .FieldSliderContainer .SliderHandle { position: absolute; top: 0px; left: 0px; cursor: pointer; width: 40px; height: 18px; background: #CC0000; color: #FFFFFF; font-size: 13px; text-decoration: none; padding: 0px 3px; line-height: 18px; text-align: center; } .FieldSliderContainer .SliderHandle .disabled { background: #898989; } .ColorPickerContainer { display: block; background: var(--color-theme-dark); z-index: 25000; font-size: 13px; text-decoration: none; font-weight: normal; color: #FFFFFF; line-height: 18px; -webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); } .ColorPickerContainer .FieldColorPicker .PadHs { background: transparent url(https://test.trailer2go.de/assets/css/../images/colorpicker/hs.png) no-repeat 0px 0px; } .ColorPickerContainer .FieldColorPicker .PadHv { background: transparent url(https://test.trailer2go.de/assets/css/../images/colorpicker/hv.png) no-repeat 0px 0px; } .ColorPickerContainer .FieldColorPicker .PadCross { background: transparent url(https://test.trailer2go.de/assets/css/../images/colorpicker/cross.png) no-repeat center; } .ColorPickerContainer .FieldColorPicker .Slider { background: transparent url(https://test.trailer2go.de/assets/css/../images/colorpicker/arrow.png) no-repeat center; } ul.TreeItem { display: block; position: relative; clear: both; list-style: none; margin: 0px 0px 5px 15px; padding: 0px; overflow: visible; background: none; } ul.TreeItem li { position: relative; display: table; width: 100%; overflow: visible; clear: both; list-style: none; margin: 2px 0px; padding: 0px 0px 0px 0px; } ul.TreeItem li:hover { background-color: #f8f8f8; cursor: pointer; } ul.TreeItem dl { position: absolute; top: 1px; left: 0px; display: block; width: 35px; height: 20px; clear: both; margin: 0px; padding: 0px 0px 0px 25px; background: transparent url(https://test.trailer2go.de/assets/css/../images/info/folder.png) no-repeat 0px -40px; /*background: none;*/ } ul.TreeItem dl.Opened { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/folder.png) no-repeat 0px -80px; } ul.TreeItem dl.Closed { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/folder.png) no-repeat 0px -60px; } ul.TreeItem dl.Empty { background: none; padding: 0px; } ul.TreeItem dl img, ul.TreeItem dl img.Opened, ul.TreeItem dl img.Closed ul.TreeItem dl img.Checked, ul.TreeItem dl img.Unchecked, ul.TreeItem dl img.CheckedInactive, ul.TreeItem dl img.UncheckedInactive { position: relative; top: 0px; left: 0px; display: block; float: left; margin: 0px; width: 35px; max-width: 35px; height: 20px; max-height: 20px; overflow: hidden; vertical-align: middle; border: none; } ul.TreeItem dl img.Opened { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/folder.png) no-repeat 50% -20px; } ul.TreeItem dl img.Closed { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/folder.png) no-repeat 50% 0px; } ul.TreeItem dl img.Empty { background: none; } ul.TreeItem dl img.Checked, ul.TreeItem dl img.Unchecked, ul.TreeItem dl img.CheckedInactive, ul.TreeItem dl img.UncheckedInactive { width: 20px; } ul.TreeItem dl img.Checked { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/checkbox.png) no-repeat 50% 0px; } ul.TreeItem dl img.Unchecked { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/checkbox.png) no-repeat 50% -20px; } ul.TreeItem dl img.CheckedInactive { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/checkbox.png) no-repeat 50% -40px; } ul.TreeItem dl img.UncheckedInactive { background: transparent url(https://test.trailer2go.de/assets/css/../images/info/checkbox.png) no-repeat 50% -60px; } ul.TreeItem div, ul.TreeItem dd, ul.TreeItem dd.Hidden { display: table; position: relative; z-index: 10; top: 0px; left: 0px; margin: 0px 0px 0px 65px; padding: 3px 0px; min-height: 18px; font-size: 13px; text-decoration: none; color: #333333; line-height: 18px; } ul.TreeItem dd.Hidden { font-style: italic; color: #CCCCCC; } ul.TreeItem li:hover div, ul.TreeItem li:hover dd { color: var(--color-theme-dark); } ul.TreeItem dt { display: block; position: relative; float: right; z-index: 50; margin: 0px 0px 0px 5px; padding: 0px; background: none; } ul.TreeItem li:hover dt { display: block; } ul.TreeItem dt.Display { display: block; } ul.TreeItem dt .Settings { position: relative; display: block; z-index: 5; float: left; width: 20px; height: 20px; margin: 0px; padding: 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/info/settings.png) no-repeat center; cursor: pointer; } ul.TreeItem dt .Settings .Menu { position: absolute; display: none; z-index: 10; right: 0px; bottom: 0px; top: auto; left: auto; margin: 0px 0px 20px 0px; padding: 10px; overflow: visible; background-color: green; cursor: auto; } ul.TreeItem dt .Settings:hover .Menu { display: block; } ul.TreeItem dt .Column, ul.TreeItem dt .Column.Last { display: inline-block; padding: 3px 0px; width: 60px; min-height: 18px; font-size: 13px; font-style: italic; text-decoration: none; color: #333333; line-height: 18px; text-align: center; border-right: 1px dashed #c7c7c7; } ul.TreeItem dt .Column.Last { border: none; } ul.TreeItem dt .Column.Glue { width: 20px; border: none; cursor: auto; } ul.TreeItem dt .Column .Checkbox, ul.TreeItem dt .Column.Last .Checkbox { margin: 0px; float: none; } ul.TreeItem .CheckboxContainer { margin: 0px 0px 0px 10px; } ul.Filter { display: inline-block; width: auto; height: auto; max-width: initial; margin: 0px 0px 10px 0px; float: none; padding: 10px 20px 0px 20px; text-align: left; list-style: none; border: 1px solid #c7c7c7; } .Filter li { display: list-item; float: left; width: auto; padding: 0px; margin: 0px 35px 10px 0px; list-style: none; text-align: -webkit-match-parent; } .Filter li.Last { margin: 0px 0px 10px 0px; } .Filter li.Label { font-size: 13px; font-weight: bold; text-decoration: none; color: #333333; line-height: 20px; padding: 6px 0px; margin: 0px 10px 10px 0px; } .LoadingRequest, .Box, .BoxContainer, .Register, .cke, .cke * { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } #BoxResultsSqlToolbox, #BoxContentLogging { display: block; overflow: auto; height: 300px; width: 100%; max-width: 1154px; box-sizing: border-box; } button.Close { display: block; position: absolute; top: 0px; right: 0px; font-size: 16px; text-decoration: none; color: #FFFFFF; font-weight: normal; font-style: normal; line-height: 16px; text-indent: -1000px; width: 30px; height: 30px; overflow: hidden; margin: -15px -15px 0px 0px; box-sizing: border-box; border-radius: 50%; border: 1px solid #c7c7c7; cursor: pointer !important; background: #FFFFFF url(https://test.trailer2go.de/assets/css/../images/actions/remove.png) no-repeat center; background-size: 60%; opacity: 1; } button.Close:hover { opacity: 0.6; } .Profileimage-List { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: flex-start; } .Profileimage, .Mediaimage, .Logoimage, .Trailerimage { display: block; position: relative; width: 150px; height: auto; max-height: 150px; padding: 2%; margin: 0px auto; background-color: white; border: 1px solid #c7c7c7; box-sizing: border-box; overflow: hidden; } .Profileimage img, .Mediaimage img, .Logoimage img, .Trailerimage img { display: block; position: relative; width: auto; height: auto; left: 50%; max-height: 100%; max-width: 100%; box-sizing: border-box; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .Mediaimage { width: 400px; height: auto; max-height: none; margin: 0px; } .Profileimage-List .Profileimage { margin: 0px 2% 2% 0px; padding: 0.5%; } .Logoimage, .Trailerimage { width: 100%; } .Trailerimage img { top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .Header .Profileimage, .BlockHalf .Profileimage, .BlockThird .Profileimage, .BlockQuarter .Profileimage { position: absolute; top: 0px; bottom: 0px; right: 0px; left: initial; height: 70px; width: 70px; margin: 5px; padding: 0px; border-radius: 50%; overflow: hidden; border: 1px solid #073370; } .Header .Profileimage { margin: 5px 20px; } .Header .Profileimage img, .BlockHalf .Profileimage img, .BlockThird .Profileimage img, .BlockQuarter .Profileimage img { box-sizing: border-box; border-radius: 50%; overflow: hidden; border: 2px solid #FFFFFF; } .BlockHalf .Profileimage, .BlockThird .Profileimage, .BlockQuarter .Profileimage { position: relative; float: left; margin: -2.5% 5% 0px 0px; border: 1px solid #c7c7c7; } .BlockHalf .Profileimage { margin: 0px 5% 0px 0px; } #MJUContent.Backend legend { background: var(--color-theme-light); border-radius: 5px; padding: 5px 15px; color: #000000; margin-bottom: 10px; font-size: 16px; line-height: 24px; } /* #MJUContent.Backend legend img { filter: invert(100%); }*/ #MJUContent.Backend fieldset { background: #FFFFFF; background: rgba(255,255,255,1); } #MJUContent.Backend .Columns fieldset { display: inline-block; width: 100%; box-sizing: border-box; } .Backend .Intended { display: block; width: auto; margin: 0px 5%; } #map .markerMapbox { background: transparent url("https://test.trailer2go.de/assets/css/../images/marker/marker_shadow.svg") no-repeat center; background-size: contain; width: 30px; height: 30px; cursor: pointer; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } #map * { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /*#endregion assets/css/styles.css*/ /*#region assets/css/navigation.css*/ .NavigationMobile { display: none; } .Navigation { display: block; position: relative; z-index: 5000; top: 0px; left: 0px; width: auto; min-height: 40px; margin: 0px; padding: 0px 0px 0px 10px; /* -moz-opacity: 0.90; opacity: 0.90; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=90); */ -webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.4); } .Navigation:hover { z-index: 15000; } .NavigationContainer { display: block; position: relative; } .Navigation ul { position: relative; display: block; float: left; z-index: 5000; height: 40px; margin: 0px; overflow: visible; white-space: nowrap; text-align: left; list-style: none; } .Navigation ul:hover { z-index: 15000; } .Navigation ul.Right { float: right; } .Navigation ul li, .Navigation ul li > span { font-size: 14px; text-decoration: none; font-weight : bold; color: #ffffff; line-height: 40px; } .Navigation ul li { display: block; position: relative; z-index: 5200; padding: 0px 10px; height: 40px; cursor: pointer; white-space: nowrap; text-align: left; list-style: none; } .Navigation ul li:hover, .Navigation ul li:hover > span { color: #666666; background-color: #FFFFFF; cursor: pointer; } .Navigation ul li.Sub { padding: 0px 25px 0px 10px; background: transparent url(https://test.trailer2go.de/assets/css/../images/bg/bg_navigation_mainmenu.png) no-repeat right center; } .Navigation ul li.Sub:hover { background: #FFFFFF url(https://test.trailer2go.de/assets/css/../images/bg/bg_navigation_mainmenu_over.png) no-repeat right center; } .Navigation ul li.Glue { display: block; float: left; width: 1px; height: 40px; overflow: hidden; background: transparent url(https://test.trailer2go.de/assets/css/../images/bg/bg_navigation_mainmenu_glue.png) no-repeat right center; } .Navigation ul.Submenu { display: none; position: absolute; z-index: 5300; float: none; margin: 0px; top: 40px; left: 0px; background-color: #FFFFFF; padding: 5px 15px 5px 15px; overflow: auto; white-space: nowrap; min-width: 100%; max-height: 315px; height: auto; list-style: none; -webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5); box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.5); } .Navigation ul.Submenu li.Line { display: block; margin: 5px -5px !important; padding: 0px !important; line-height: 1px !important; height: 1px !important; font-size: 1px !important; } .Navigation ul.Submenu li { display: block; font-size: 14px; text-decoration: none; font-weight: normal; color: #333333; padding: 2px 0px !important; line-height: 24px !important; height: 24px !important; white-space: nowrap; overflow: visible; cursor: pointer; vertical-align: middle; text-align: left; list-style: none; } .Navigation ul.Submenu li:hover { color: var(--color-theme-dark); cursor: pointer; } .Navigation ul.Submenu li img { display: inline-block; height: 24px; width: 24px; border: none; padding: 0px; margin: 0px 7px 0px 0px; } .Listmenu { display: block; font-size: 13px; text-decoration: none; font-weight: bold; color: #000000; padding: 0px; line-height: 16px; cursor: pointer; text-align: center; } .Listmenu:hover { color: var(--color-theme-dark); cursor: pointer; } .Listmenu img { display: block; position: relative; height: 60px; width: 60px; border: none; padding: 0px; margin: 5px auto; clear: both; text-align: center; } .Dashboard { display: block; clear: both; width: auto; text-align: center; } .Dashboard .Listmenu { display: inline-block; width: 145px; min-height: 90px; font-size: 14px; text-decoration: none; font-weight: normal; color: #333333; padding: 20px 20px; margin: 20px; line-height: 20px; cursor: pointer; text-align: center; vertical-align: middle; border: 1px solid #c7c7c7; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .Dashboard .Listmenu:hover { color: var(--color-theme-dark); cursor: pointer; } .Dashboard .Listmenu img { display: block; position: relative; height: 40px; width: 40px; border: none; padding: 0px; margin: 5px auto; clear: both; text-align: center; } /*#endregion assets/css/navigation.css*/ /*#region assets/css/box.css*/ .Box { display: block; position: absolute; overflow: visible; z-index: 100; top: 80px; left: 0px; width: 200px; height: 200px; background: url(https://test.trailer2go.de/assets/css/../images/transparent_100.png) repeat; } .BoxBackground { position: absolute; display: none; z-index: 9999; left: 0px; top: 0px; width: 100%; height: 100%; background-color: #666666; cursor: pointer; -webkit-opacity: 0.70; -moz-opacity: 0.70; opacity: 0.70; } .Box .BoxContainer { display: block; position: absolute; overflow: hidden; z-index: 100; top: 0px; left: 0px; width: 200px; height: 200px; -webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); } .Box .BoxHeader, .Info .BoxHeader { display: block; position: relative; overflow: hidden; width: auto; font-size: 15px; text-decoration: none; color: #FFFFFF; font-weight: normal; font-style: normal; line-height: 18px; margin: 0px; padding: 0px 50px 0px 15px; /* -moz-opacity: 0.90; opacity: 0.90; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=90); */ background-color: #114d7e; } .Box .BoxHeader div, .Info .BoxHeader div { display: block; position: relative; overflow: hidden; white-space: nowrap; min-height: 18px; font-size: 15px; text-decoration: none; color: #FFFFFF; font-weight: normal; font-style: normal; line-height: 18px; padding: 9px 0px; margin: 0px; } .Info .BoxHeader div { font-weight: bold; } .Box .BoxHeader .Icon { position: relative; top: 0px; left: 0px; display: block; float: left; height: 24px; overflow: hidden; vertical-align: middle; border: none; margin: 7px 10px 7px 0px; filter: invert(100%); -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); } .Box .BoxContent, .Info .BoxContent { display: block; position: absolute; overflow: auto; width: auto; top: 36px; left: 0px; right: 0px; bottom: 0px; font-size: 12px; text-decoration: none; color: #333333; font-weight: normal; font-style: normal; line-height: 16px; margin: 0px; padding: 20px 20px 20px 20px; background-color: #FFFFFF; } .Box .BoxActions, .Info .BoxActions { display: block; position: absolute; z-index: 100; top: 0px; right: 0px; height: 26px; margin: 6px; white-space: nowrap; } .Box .BoxActions div, .Info .BoxActions div { display: block; float: left; font-size: 16px; text-decoration: none; color: #FFFFFF; font-weight: normal; font-style: normal; line-height: 16px; margin: 0px 4px; padding: 0px; width: 24px; height: 24px; text-align: center; border: 1px var(--color-theme-light) solid; cursor: pointer; } .Box .BoxActions div:hover, .Info .BoxActions div:hover { border: 1px #FFFFFF solid; color: #FFFFFF; cursor: pointer; } .Box .BoxActions .BoxClose, .Info .BoxActions .BoxClose { background: transparent url(https://test.trailer2go.de/assets/css/../images/box/box_close.png) no-repeat center; } .Box .BoxActions .BoxMinimize { background: transparent url(https://test.trailer2go.de/assets/css/../images/box/box_minimize.png) no-repeat center; } .Box .BoxActions .BoxMaximize { background: transparent url(https://test.trailer2go.de/assets/css/../images/box/box_maximize.png) no-repeat center; } .Box .BoxActions .BoxTaskbar { background: transparent url(https://test.trailer2go.de/assets/css/../images/box/box_taskbar.png) no-repeat center; } /*#endregion assets/css/box.css*/ /*#region assets/css/list.css*/ .List, .Form, .ListNoBorder { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #333333; /*border: 1px solid #c5c5c5;*/ width: 100%; box-sizing: border-box; } .List { border: 1px solid #c5c5c5; } .List, .Form { -webkit-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 10px 0px rgba(0, 0, 0, 0.2); } .Form { display: block; width: auto; padding: 0px; margin-bottom: 20px; } .Form table { margin: 0px 20px; padding: 0px; text-align: left; } .Form .ListContent { margin: 20px; padding: 0px; text-align: left; } .ListNoBorder { border: none; } .ListHeader { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; text-align: left; font-size: 14px; text-decoration: none; color: #FFFFFF; font-weight: normal; font-style: normal; line-height: 18px; /*padding: 10px 15px;*/ padding: 10px 15px; margin: 0px; height: 38px; background: none; background-color: var(--color-theme-dark); } .List tfoot, .List tfoot tr, .ListNoBorder tfoot, .ListNoBorder tfoot tr { width: 100%; } .ListSort { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 14px; text-decoration: none; color: #FFFFFF; padding: 9px 10px; font-weight: bold; line-height: 18px; } A.ListSort { padding: 0px; } A.ListSort:link {} A.ListSort:visited {} A.ListSort:hover { text-decoration: none; color: var(--color-theme-light); } A.ListSort.Asc { padding: 5px 20px 5px 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/arrows/asc_white.png) no-repeat 100% 50%; } A.ListSort.Desc { padding: 5px 20px 5px 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/arrows/desc_white.png) no-repeat 100% 50%; } .ListNone { display: block; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; text-align: center; font-size: 13px; text-decoration: none; color: #333333; font-weight: bold; font-style: italic; line-height: 18px; padding: 0px; margin: 0px; } .ListSortAction { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #FFFFFF; padding: 0px 10px; font-weight: bold; line-height: 18px; white-space: nowrap; } .ListBody { background-color: #FFFFFF; cursor: pointer; } .ListBody:hover, .ListBodyActive { background-color: #dee6ed; } .ListBody.Selected { background-color: #cdd9e3; } .ListRow { margin: 0px; padding: 0px; } .ListRowActive { margin: 0px; padding: 0px; font-weight: bold; color: var(--color-theme-dark); background-color: #f8f8f8; } .ListContent { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 14px; text-decoration: none; color: #333333; line-height: 18px; padding: 1% 10px; } .ListContentAction { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 14px; text-decoration: none; color: #333333; line-height: 18px; padding: 0.5% 10px; white-space: nowrap; } .ListFooter { width: 100%; height: auto; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 11px; text-decoration: none; color: #333333; padding: 5px 10px !important; background: transparent url(https://test.trailer2go.de/assets/css/../images/bg/bg_list.png) repeat-x top center; } .ListFooter:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .ListPageing { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 12px !important; line-height: 20px !important; text-decoration: none; color: #333333; padding: 0px 0px; border: 0px; } .ListPageing.Count, .ListPageing.Rows, .ListPageing.Paging { display: inline-block; margin: 0px; padding: 0px; width: 25%; float: left; } .ListPageing.Rows { width: 50%; text-align: center; margin: 0px; } .ListPageing.Paging { text-align: right; float: right; } .ListPageing .ListButton { font-size: 12px !important; line-height: 13px !important; padding: 3px 10px 3px 10px !important; margin: 0px 0px 0px 10px; } .ListAction { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #333333; line-height: 18px; padding: 1% 0px; white-space: nowrap; display: block; margin: 10px 0px 0px 0px; } .ListAction img { float: left; margin: 0px 5px 0px 0px; } .ListAction.Top { margin: -10px 0px 10px 0px; } .Box .ListAction { padding: 2% 3% 2% 3%; margin: 0px 0px 0px 0px; } .ListSelected { display: block; float: left; font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 13px; text-decoration: none; color: #333333; line-height: 18px; padding: 4px 5px 0px 0px; } .ListButton { display: inline-block; font-size: 11px; text-decoration: none; font-weight: bold; color: #333333; border: 1px solid #919090; line-height: 13px; padding: 1px 10px 1px 10px; cursor: pointer; outline: none; margin: 0px; text-align: center; background-color: #FFFFFF; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3); } .ListButton:hover { text-decoration: none; color: var(--color-theme-dark); } .InfoActions { display: block; float: right; margin: 0px 0px 5px 20px; } .InfoListActions { display: block; margin: 20px 0px 0px 0px; } ul.List { display: block; position: relative; clear: both; list-style: none; margin: 0px; padding: 0px; overflow: visible; background: #FFFFFF; } ul.List .ListHeader, .Form .ListHeader { /*padding: 9px 10px;*/ padding: 9px 10px; margin: 0px; height: auto; background: none; background-color: #114d7e !important; } ul.List .ListHeader, .Form .ListHeader, ul.List .ListHeader a .Form .ListHeader a { text-align: left; font-size: 14px !important; text-decoration: none; color: #FFFFFF; font-weight: bold; font-style: normal; line-height: 18px !important; } ul.List h1, ul.List h2, ul.List h3, ul.List h4, ul.List a, ul.List p, ul.List ul, ul.List ol, ul.List div, ul.List dd, ul.List dt, ul.List span, ul.List font, ul.List textarea, ul.List label { margin: 0px; padding: 0px; font-size: 14px; line-height: 18px; } ul.List li { position: relative; display: block; width: auto; overflow: visible; clear: both; list-style: none; height: auto; min-height: 20px; margin: 0px; /*padding: 10px 10px 10px 15px;*/ padding: 1% 1% 1% 2%; box-sizing: border-box; } ul.List li:hover { background-color: #dee6ed; cursor: pointer; } ul.List li:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } ul.List li.Selected { background-color: #cdd9e3; } ul.List dt { color: var(--color-theme-dark); } ul.List dt, ul.List dd { display: block; width: auto; opacity: 1; } ul.List hr { display: inline; margin: 0 5px; padding: 0; height: inherit; line-height: inherit; font-size: inherit; font-family: inherit; font-weight: inherit; font-style: inherit; position: relative; overflow: hidden; background: none; border: none; text-align: center; } ul.List hr:before { content: "·"; display: inherit; } @media screen and (min-width: 1280px) { ul.List dt, ul.List dd { float: left; width: 42.5%; padding: 0px 2.5% 0px 0px; } ul.List hr { display: block; height: 0px; } ul.List hr:before { display: none; } } .Content.ShowInfo ul.List dt { float: none; width: auto; padding: 3px 0px; } .Content.ShowInfo ul.List dd { float: none; /*width: 0px; height: 0px; opacity: 0; overflow: hidden;*/ width: auto; padding: 0px; } .Content.ShowInfo ul.List hr { display: block; height: 0px; } .Content.ShowInfo ul.List hr:before { display: none; } .BoxContent .List dt { font-style: italic; } .BoxContent .List dt, .BoxContent .List dd { color: #333333 !important; width: 25% !important; float: left; margin: 0px 5% 0px 0px !important; overflow-x: hidden; } .BoxContent .List dd { width: 50% !important; margin: 0px !important; } ul.List .Pre, ul.List .Pre50 { display: block; float: left; width: 20px; height: 20px; margin: 0px 10px 0px 0px; } ul.List .Pre50 { width: 50px; } ul.List .WithPre{ padding: 0px 0px 0px 30px; } ul.List .WithPre50 { padding: 0px 0px 0px 60px; } ul.List dl { display: block; width: auto; margin: 0px; padding: 0px; box-sizing: border-box; } .Content.ShowInfo .ListNoInfo { overflow: hidden; opacity: 0; width: 0px; padding: 0px; } .Settings { position: relative; display: block; text-indent: -10000px; z-index: 5; float: right; width: 20px; height: 20px; margin: 0px; padding: 2px 0px 3px 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/info/settings.png) no-repeat center; pointer-events: visible; cursor: pointer; } .Settings, .Settings.Direct { display: inline-block; text-indent: 0; width: auto; height: auto; background: none; } .Settings img { margin: 2px; } .SettingsContainer { display: none; position: absolute; top: 0px; left: 0px; width: auto; height: auto; background: var(--color-theme-dark); padding: 10px 8px; z-index: 25000; -webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); } .SettingsContainer .Actions { display: block; font-size: 12px; text-decoration: none; font-weight: normal; color: #FFFFFF; line-height: 18px; } .SettingsContainer .Actions img { filter:invert(100%); filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1'); -webkit-filter:invert(100%); -o-filter:invert(100%); -moz-filter:invert(100%); -ms-filter:invert(100%); } .SettingsContainer .Tail { display: block; position: absolute; top: 100%; left: 50%; width: 0px; height: 0px; border: 5px solid transparent; border-top: 5px solid var(--color-theme-dark); font-size: 0px; line-height: 0px; color: white; white-space: pre; padding: 0px; margin: 0 auto; margin-left: -5px; margin-top: 0px; } .SettingsContainer .Actions { position: relative; display: block; visibility: visible; top: 0px; left: 0px; width: auto; height: auto; overflow: visible; } dl, dd, dt { text-align: left; font-size: 13px; text-decoration: none; color: #333333; font-weight: normal; font-style: normal; line-height: 18px; } dl.Numeration { display: block; padding: 0px; margin: 0px; width: 60%; height: auto; clear: both; } dl.Numeration dd, dl.Numeration dt { display: block; float: left; width: 40% !important; margin: 3px 20px 0px -5px !important; padding: 2px 5px; } dl.Numeration dd { padding: 2px 5px 2px 15px; } dl.Numeration dd:before { display: inline-block; content: "» "; width: 10px; margin: 0px 0px 0px -10px; } dl.Numeration dt:nth-of-type(even), dl.Numeration dd:nth-of-type(even) { background-color: #dee6ed; } dl.Numeration.Onerow dd, dl.Numeration.Onerow dt { float: none; width: 100% !important; } .Form .Content { display: block; position: relative; top: initial; left: initial; bottom: initial; right: initial; width: auto; height: auto; min-height: initial; padding: 10px 10px 10px 15px; margin: 0px; text-align: left; } .TwoColumns { display: block; width: auto; margin: 0px 0px 20px 20px; } .TwoColumns .List, .TwoColumns .Form { display: block; float: left; width: 50%; margin: 0px 00px 0px 10px; } .TwoColumns .List { margin: 0px 10px 0px -20px; } .status { display: inline-block !important; position: relative; border-radius: 50%; background-color: #00a9eb; box-sizing: border-box; float: none !important; padding: 0px !important; width: 20px !important; height: 20px !important; } .status::before { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 20px; height: 20px; border: 2px solid #00a9eb; border-radius: 50%; margin: -10px 0px 0px -10px; padding: 0px; box-sizing: border-box; } .Textnormal .status, .Textbold .status { margin: -5px 0px -5px 0px; } .status.submitted { border: 2px solid #00a9eb; background-color: #f0ca00; } .status.locked { border: 4px solid #b00000; background-color: #f0ca00; } .status.released { border: 2px solid #00a9eb; background-color: #008754; } .status.rejected { border: 2px solid #00a9eb; background-color: #cc0605; } /*#endregion assets/css/list.css*/ /*#region assets/css/calendar.css*/ .calendar-container .header { display: flex; align-items: center; margin: 0 0 20px 0px; } .calendar-container .header h4 { margin: 0; padding: 0; font-size: 21px; line-height: 26px; text-decoration: none; color: var(--color-blue-dark); font-style: normal; text-transform: uppercase; } .calendar-container .header .left, .calendar-container .header .center, .calendar-container .header .right { display: flex; flex: 0 0 20%; min-height: 1px; position: relative; text-align: center; white-space: nowrap; } .calendar-container .header .left { text-align: left; } .calendar-container .header .right { justify-content: end; text-align: right; } .calendar-container .header .center { display: block; flex: 1; } .calendar-container .header .btn { display: block; min-width: 18px; max-height: 16px; box-sizing: border-box; margin-bottom: 0; font-size: 16px; line-height: 18px; font-weight: 500; text-align: center; text-transform: uppercase; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; color: var(--color-blue-light); } .calendar-container .header .btn.last { margin-right: 10px; -o-transform: rotate(180deg); -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .calendar-container .header .btn.last.month, .calendar-container .header .btn.last.week { margin-right: 0; margin-left: 10px; -o-transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; transform: none; } .calendar-container .header .btn.last.week { margin-left: 0; } /*.calendar-container .header .btn.month, .calendar-container .header .btn.week { display: none; }*/ .calendar-container .header .btn.next { margin-left: 10px; } .calendar-container .header .btn:hover { opacity: 0.6; text-decoration: none; } .calendar-container .header .btn img { display: block; height: 100%; } .calendar .calendar-row { display: flex; justify-content: flex-start; margin-bottom: 0.5%; } .calendar .calendar-row .day, .calendar .calendar-row .weekday { flex: 1 1 0; flex-flow: column; display: flex; flex-direction: column; justify-content: space-between; box-sizing: border-box; min-height: 135px; margin-right: 0.5%; padding: 0px; border: 1px solid var(--color-blue-light); background-color: #FFFFFF; position: relative; } .weekly .calendar .calendar-row .day { min-height: 500px; } .calendar .calendar-row .day:last-child { margin-right: 0; } .calendar .calendar-row .day span.highlight { display: inline-block; position: absolute; right: 10px; bottom: 0px; text-align: right; font-size: 18px; line-height: 22px; font-weight: 700; color: var(--color-blue-dark); } .calendar .calendar-row .day.next-month span.highlight, .calendar .calendar-row .day.previous-month span.highlight { color: #d6ecf6; } .calendar .calendar-row .day:hover { box-shadow: 0 0 10px var(--color-blue-dark); text-decoration: none; } .calendar .calendar-row .day.today { background: var(--color-blue-dark); color: white; } .calendar .calendar-row .day.today *, .calendar .calendar-row .day.today span.highlight { color: white; } .calendar .calendar-row .day .item-container { padding: 3%; margin: 0px; overflow: auto; max-height: 135px; display: block; box-sizing: border-box; } .calendar .day .action { position: absolute; z-index: 500; top: -5px; right: -5px; text-indent: -10000px; width: 25px; height: 25px; border-radius: 50%; background-color: #FFFFFF; border: 1px solid var(--color-blue-light); } .calendar .day .action:hover { opacity: 1; } .calendar .day .action.add:before { content: '+'; display: inline-block; position: absolute; left: 50%; top: 50%; font-size: 24px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-blue-dark); line-height: 30px; text-indent: 0; margin: -16px 0px 0px -6px; opacity: 0.6; } .calendar .day .action.add:hover:before { opacity: 1; } .calendar .calendar-row .day .item-container .item { font-style: italic; font-size: 14px; line-height: 16px; margin-bottom: 5px; } .calendar .calendar-row .day .item-container .item + .item { border-top: dashed 1px #dddddd; padding-top: 5px; } .calendar .calendar-row .day .item-container .item a { font-size: 14px; line-height: 16px; font-style: normal; } .calendar-container.weekly .calendar .calendar-row, .calendar-container.weekly .calendar .calendar-row .day .item-container { height: 100%; } .calendar-container.weekly .calendar .calendar-row .day .item-container { max-height: none; } .CalHeaderRow, .CalRow { display: flex; align-items: center; position: relative; border-top: 1px solid #ffffff; background-color: var(--color-blue-light); } .CalRowData { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; min-height: 76px; padding: 2px 0px; border-left: 1px solid #ffffff; } .CalRow .CalRowData { /*background-image: url('https://test.trailer2go.de/assets/css/../images/icons/bg_grid_white.svg');*/ } .CalHeaderRow { margin: 0 0 10px 0; } .CalHeader, .CalCell { display: flex; position: relative; flex-shrink: 0; justify-content: center; align-items: center; box-sizing: border-box; padding: 5px 10px; background-color: var(--color-blue-light); color: #ffffff; } .CalHeaderRow .Trailer, .CalHeaderRow .CalHeader { padding: 20px 10px 5px 10px; } .CalHeaderRow .CalRowData { padding: 0px; } .CalCell.Trailer { justify-content: start; width: 150px; } .CalHeader.weekend { background-color: var(--color-blue-dark); } .CalHeader.today { background-color: #e14300; /*background-color: #e1009e;*/ } .CalCell { border: none; } .CalHeader + .CalHeader { border-left: 1px solid #ffffff; } .CalDetail { background-color: var(--color-blue-dark); color: #ffffff; margin: 2px; } .CalDetail a { display: block; width: 100%; height: 100%; } .CalDetail a:hover { text-decoration: none; background-color: #e1009e; opacity: 1; } .CalDetail .tooltip-content { height: 100px; padding: 5px 8px 5px 8px; background-color: #ffffff; } /*#endregion assets/css/calendar.css*/ /*#region assets/css/js/calendar/calendar.css*/ @import url("https://test.trailer2go.de/assets/css/js/calendar/jscal2.css"); .DynarchCalendar { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; background: #FFFFFF; border: 1px solid var(--color-theme-dark); -webkit-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.4); } .DynarchCalendar, .DynarchCalendar table, .DynarchCalendar-menu-year { font-family: "Roboto", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; } .DynarchCalendar-menu-year { width: 100%; border: 1px solid var(--color-theme-dark); } .DynarchCalendar-menu table td div { color: #000000; } .DynarchCalendar-title, .DynarchCalendar-title div { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; text-shadow: none; transition: none; } .DynarchCalendar-menu { background-color: #FFFFFF; } .DynarchCalendar-menu table td div.DynarchCalendar-menu-month { cursor: pointer; } .DynarchCalendar-menu-sep { border-top: 1px solid var(--color-theme-dark); } .DynarchCalendar-topBar, .DynarchCalendar-focused .DynarchCalendar-topBar { -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; background: #FFFFFF; border-bottom: 1px solid var(--color-theme-dark); } .DynarchCalendar-bottomBar, .DynarchCalendar-focused .DynarchCalendar-bottomBar { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; background: #FFFFFF; border-top: 1px solid var(--color-theme-dark); } .DynarchCalendar-bottomBar-today { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .DynarchCalendar-navBtn, .DynarchCalendar-navBtn div { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .DynarchCalendar-menu { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .DynarchCalendar-menu table td div { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .DynarchCalendar-hover-week, .DynarchCalendar-focused .DynarchCalendar-hover-week { background-color: var(--color-theme-light); } .DynarchCalendar-hover-date, .DynarchCalendar-day-othermonth.DynarchCalendar-hover-date { background-color: #FFFFFF; border: 1px solid var(--color-theme-dark); cursor: pointer; } .DynarchCalendar-day-today.DynarchCalendar-day-selected { background-color: #dddddd; } .DynarchCalendar-day-today { color: var(--color-theme-dark); } .DynarchCalendar-dayNames div { font-weight: bold; color: #000000; text-shadow: none; } .DynarchCalendar-weekNumber { -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; -ms-border-radius: 3px 0 0 3px; -o-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; } .DynarchCalendar-day { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .DynarchCalendar-day-disabled { -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .DynarchCalendar-tooltipCont { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; } .DynarchCalendar-time-hour, .DynarchCalendar-time-minute { -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; -ms-border-radius: 3px 0 0 3px; -o-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; } .DynarchCalendar-time-am { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } /*#endregion assets/css/js/calendar/calendar.css*/ /*#region assets/css/js/ui/jquery-ui.css*/ /*! jQuery UI - v1.13.0 - 2021-11-04 * http://jqueryui.com * Includes: draggable.css, core.css, resizable.css, selectable.css, sortable.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, progressbar.css, selectmenu.css, slider.css, spinner.css, tabs.css, tooltip.css, theme.css * To view and modify this theme, visit http://jqueryui.com/themeroller/?scope=&folderName=base&cornerRadiusShadow=8px&offsetLeftShadow=0px&offsetTopShadow=0px&thicknessShadow=5px&opacityShadow=30&bgImgOpacityShadow=0&bgTextureShadow=flat&bgColorShadow=666666&opacityOverlay=30&bgImgOpacityOverlay=0&bgTextureOverlay=flat&bgColorOverlay=aaaaaa&iconColorError=cc0000&fcError=5f3f3f&borderColorError=f1a899&bgTextureError=flat&bgColorError=fddfdf&iconColorHighlight=777620&fcHighlight=777620&borderColorHighlight=dad55e&bgTextureHighlight=flat&bgColorHighlight=fffa90&iconColorActive=ffffff&fcActive=ffffff&borderColorActive=003eff&bgTextureActive=flat&bgColorActive=007fff&iconColorHover=555555&fcHover=2b2b2b&borderColorHover=cccccc&bgTextureHover=flat&bgColorHover=00a9eb&iconColorDefault=777777&fcDefault=454545&borderColorDefault=c5c5c5&bgTextureDefault=flat&bgColorDefault=f6f6f6&iconColorContent=444444&fcContent=333333&borderColorContent=dddddd&bgTextureContent=flat&bgColorContent=ffffff&iconColorHeader=444444&fcHeader=333333&borderColorHeader=dddddd&bgTextureHeader=flat&bgColorHeader=e9e9e9&cornerRadius=3px&fwDefault=normal&fsDefault=1em&ffDefault=Arial%2CHelvetica%2Csans-serif * Copyright jQuery Foundation and other contributors; Licensed MIT */ .ui-draggable-handle { -ms-touch-action: none; touch-action: none; } /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; } .ui-helper-clearfix:after { clear: both; } .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; -ms-filter: "alpha(opacity=0)"; /* support: IE8 */ } .ui-front { z-index: 100; } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; pointer-events: none; } /* Icons ----------------------------------*/ .ui-icon { display: inline-block; vertical-align: middle; margin-top: -.25em; position: relative; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } .ui-widget-icon-block { left: 50%; margin-left: -8px; display: block; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; -ms-touch-action: none; touch-action: none; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px; } .ui-selectable { -ms-touch-action: none; touch-action: none; } .ui-selectable-helper { position: absolute; z-index: 100; border: 1px dotted black; } .ui-sortable-handle { -ms-touch-action: none; touch-action: none; } .ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 2px 0 0 0; padding: .5em .5em .5em .7em; font-size: 100%; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; } .ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default; } .ui-menu { list-style: none; padding: 0; margin: 0; display: block; outline: 0; } .ui-menu .ui-menu { position: absolute; } .ui-menu .ui-menu-item { margin: 0; cursor: pointer; /* support: IE10, see #8844 */ list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"); } .ui-menu .ui-menu-item-wrapper { position: relative; color: #FFF; padding: 0.5em 1em; } .ui-menu .ui-menu-divider { margin: 5px 0; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0; } .ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: -1px; } /* icon support */ .ui-menu-icons { position: relative; } .ui-menu-icons .ui-menu-item-wrapper { padding-left: 2em; } /* left-aligned */ .ui-menu .ui-icon { position: absolute; top: 0; bottom: 0; left: .2em; margin: auto 0; } /* right-aligned */ .ui-menu .ui-menu-icon { left: auto; right: 0; } .ui-button { padding: 0.5em 1em; display: inline-block; position: relative; line-height: normal; margin-right: .1em; cursor: pointer; vertical-align: middle; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* Support: IE <= 11 */ overflow: visible; } .ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none; } /* to make room for the icon, a width needs to be set here */ .ui-button-icon-only { width: 2em; box-sizing: border-box; text-indent: -9999px; white-space: nowrap; } /* no icon support for input elements */ input.ui-button.ui-button-icon-only { text-indent: 0; } /* button icon element(s) */ .ui-button-icon-only .ui-icon { position: absolute; top: 50%; left: 50%; margin-top: -8px; margin-left: -8px; } .ui-button.ui-icon-notext .ui-icon { padding: 0; width: 2.1em; height: 2.1em; text-indent: -9999px; white-space: nowrap; } input.ui-button.ui-icon-notext .ui-icon { width: auto; height: auto; text-indent: 0; white-space: normal; padding: .4em 1em; } /* workarounds */ /* Support: Firefox 5 - 40 */ input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner { border: 0; padding: 0; } .ui-controlgroup { vertical-align: middle; display: inline-block; } .ui-controlgroup > .ui-controlgroup-item { float: left; margin-left: 0; margin-right: 0; } .ui-controlgroup > .ui-controlgroup-item:focus, .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus { z-index: 9999; } .ui-controlgroup-vertical > .ui-controlgroup-item { display: block; float: none; width: 100%; margin-top: 0; margin-bottom: 0; text-align: left; } .ui-controlgroup-vertical .ui-controlgroup-item { box-sizing: border-box; } .ui-controlgroup .ui-controlgroup-label { padding: .4em 1em; } .ui-controlgroup .ui-controlgroup-label span { font-size: 80%; } .ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item { border-left: none; } .ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item { border-top: none; } .ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content { border-right: none; } .ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content { border-bottom: none; } /* Spinner specific style fixes */ .ui-controlgroup-vertical .ui-spinner-input { /* Support: IE8 only, Android < 4.4 only */ width: 75%; width: calc( 100% - 2.4em ); } .ui-controlgroup-vertical .ui-spinner .ui-spinner-up { border-top-style: solid; } .ui-checkboxradio-label .ui-icon-background { box-shadow: inset 1px 1px 1px #ccc; border-radius: .12em; border: none; } .ui-checkboxradio-radio-label .ui-icon-background { width: 16px; height: 16px; border-radius: 1em; overflow: visible; border: none; } .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon, .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon { background-image: none; width: 8px; height: 8px; border-width: 4px; border-style: solid; } .ui-checkboxradio-disabled { pointer-events: none; } .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } .ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 1.8em; height: 1.8em; } .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } .ui-datepicker .ui-datepicker-prev { left: 2px; } .ui-datepicker .ui-datepicker-next { right: 2px; } .ui-datepicker .ui-datepicker-prev-hover { left: 1px; } .ui-datepicker .ui-datepicker-next-hover { right: 1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; } .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%; } .ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; } /* with multiple calendars */ .ui-datepicker.ui-datepicker-multi { width: auto; } .ui-datepicker-multi .ui-datepicker-group { float: left; } .ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em; } .ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; } .ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; } .ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; } .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; } .ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; } .ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; } /* RTL support */ .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group { float: right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; } /* Icons */ .ui-datepicker .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em; } .ui-dialog { position: absolute; top: 0; left: 0; padding: .2em; outline: 0; } .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } .ui-dialog .ui-dialog-title { float: left; margin: .1em 0; white-space: nowrap; width: 90%; overflow: hidden; text-overflow: ellipsis; } .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 20px; margin: -10px 0 0 0; padding: 1px; height: 20px; } .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; } .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin-top: .5em; padding: .3em 1em .5em .4em; } .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } .ui-dialog .ui-resizable-n { height: 2px; top: 0; } .ui-dialog .ui-resizable-e { width: 2px; right: 0; } .ui-dialog .ui-resizable-s { height: 2px; bottom: 0; } .ui-dialog .ui-resizable-w { width: 2px; left: 0; } .ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw { width: 7px; height: 7px; } .ui-dialog .ui-resizable-se { right: 0; bottom: 0; } .ui-dialog .ui-resizable-sw { left: 0; bottom: 0; } .ui-dialog .ui-resizable-ne { right: 0; top: 0; } .ui-dialog .ui-resizable-nw { left: 0; top: 0; } .ui-draggable .ui-dialog-titlebar { cursor: move; } .ui-progressbar { height: 2em; text-align: left; overflow: hidden; } .ui-progressbar .ui-progressbar-value { margin: -1px; height: 100%; } .ui-progressbar .ui-progressbar-overlay { background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw=="); height: 100%; -ms-filter: "alpha(opacity=25)"; /* support: IE8 */ opacity: 0.25; } .ui-progressbar-indeterminate .ui-progressbar-value { background-image: none; } .ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; left: 0; display: none; z-index: 99999; -moz-transition: none; -ms-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } .ui-selectmenu-menu .ui-menu { overflow: auto; overflow-x: hidden; padding-bottom: 1px; } .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup { font-size: 1em; font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; height: auto; border: 0; } .ui-selectmenu-open { display: block; } .ui-selectmenu-text { display: block; margin-right: 20px; overflow: hidden; text-overflow: ellipsis; color: #FFF; } .ui-selectmenu-button.ui-button { text-align: left; white-space: nowrap; } .ui-selectmenu-icon.ui-icon { float: right; margin-top: 0; } .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: pointer; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } /* support: IE8 - See #6727 */ .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-horizontal { height: .8em; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } .ui-spinner { position: relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle; } .ui-spinner-input { border: none; background: none; color: inherit; padding: .222em 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 2em; } .ui-spinner-button { width: 1.6em; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0; } /* more specificity required here to override default borders */ .ui-spinner a.ui-spinner-button { border-top-style: none; border-bottom-style: none; border-right-style: none; } .ui-spinner-up { top: 0; } .ui-spinner-down { bottom: 0; } .ui-tabs { position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ padding: .2em; } .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom-width: 0; padding: 0; white-space: nowrap; } .ui-tabs .ui-tabs-nav .ui-tabs-anchor { float: left; padding: .5em 1em; text-decoration: none; } .ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px; } .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor { cursor: text; } .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor { cursor: pointer; } .ui-tabs .ui-tabs-panel { display: block; border-width: 0; background: none; } .ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; } body .ui-tooltip { border-width: 2px; } /* Component containers ----------------------------------*/ .ui-widget { font-weight: 300; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget.ui-widget-content { border: none; padding: 0 !important; margin: 0 0; } .ui-widget-content { border: none; color: #333333; } .ui-widget-content a { color: #333333; } .ui-widget-header { border: none; color: #333333; font-weight: bold; } .ui-widget-header a { color: #333333; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, /* We use html here because we need a greater specificity to make sure disabled works properly when clicked or hovered */ html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: none; background: none; font-weight: normal; color: #454545; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button { color: #454545; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: none; background: none; font-weight: normal; color: #2b2b2b; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited, a.ui-button:hover, a.ui-button:focus { color: #2b2b2b; text-decoration: none; } .ui-visual-focus { box-shadow: 0 0 3px 1px rgb(94, 158, 214); } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: none; background: none; font-weight: normal; color: #ffffff; } .ui-icon-background, .ui-state-active .ui-icon-background { border: none; background-color: #ffffff; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #ffffff; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #dad55e; background: #fffa90; color: #777620; } .ui-state-checked { border: 1px solid #dad55e; background: #fffa90; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #777620; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #f1a899; background: #fddfdf; color: #5f3f3f; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #5f3f3f; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #5f3f3f; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; -ms-filter: "alpha(opacity=70)"; /* support: IE8 */ font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; -ms-filter: "alpha(opacity=35)"; /* support: IE8 */ background-image: none; } .ui-state-disabled .ui-icon { -ms-filter: "alpha(opacity=35)"; /* support: IE8 - See #6059 */ } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { width: 20px; height: 25px; } .ui-icon, .ui-widget-content .ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/images/ui-icons_444444_256x240.png"); } .ui-widget-header .ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/images/ui-icons_444444_256x240.png"); } .ui-state-focus .ui-icon, .ui-button:focus .ui-icon { transform: rotate(180deg); background-position: center 0; } .ui-state-active .ui-icon, .ui-button:active .ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/images/ui-icons_ffffff_256x240.png"); } .ui-state-highlight .ui-icon, .ui-button .ui-state-highlight.ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/images/ui-icons_777620_256x240.png"); } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/images/ui-icons_cc0000_256x240.png"); } .ui-button .ui-icon { background-image: url("https://test.trailer2go.de/assets/css/js/ui/../../images/icons/chevron-down.svg"); background-position: center 0px; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } /* positioning */ /* Three classes needed to override `.ui-button:hover .ui-icon` */ .ui-icon-blank.ui-icon-blank.ui-icon-blank { background-image: none; } .ui-icon-caret-1-n { background-position: 0 0; } .ui-icon-caret-1-ne { background-position: -16px 0; } .ui-icon-caret-1-e { background-position: -32px 0; } .ui-icon-caret-1-se { background-position: -48px 0; } .ui-icon-caret-1-s { background-position: -65px 0; } .ui-icon-caret-1-sw { background-position: -80px 0; } .ui-icon-caret-1-w { background-position: -96px 0; } .ui-icon-caret-1-nw { background-position: -112px 0; } .ui-icon-caret-2-n-s { background-position: -128px 0; } .ui-icon-caret-2-e-w { background-position: -144px 0; } .ui-icon-triangle-1-n { background-position: 0 -16px; } .ui-icon-triangle-1-ne { background-position: -16px -16px; } .ui-icon-triangle-1-e { background-position: -32px -16px; } .ui-icon-triangle-1-se { background-position: -48px -16px; } .ui-icon-triangle-1-s { background-position: -65px -16px; } .ui-icon-triangle-1-sw { background-position: -80px -16px; } .ui-icon-triangle-1-w { background-position: -96px -16px; } .ui-icon-triangle-1-nw { background-position: -112px -16px; } .ui-icon-triangle-2-n-s { background-position: -128px -16px; } .ui-icon-triangle-2-e-w { background-position: -144px -16px; } .ui-icon-arrow-1-n { background-position: 0 -32px; } .ui-icon-arrow-1-ne { background-position: -16px -32px; } .ui-icon-arrow-1-e { background-position: -32px -32px; } .ui-icon-arrow-1-se { background-position: -48px -32px; } .ui-icon-arrow-1-s { background-position: -65px -32px; } .ui-icon-arrow-1-sw { background-position: -80px -32px; } .ui-icon-arrow-1-w { background-position: -96px -32px; } .ui-icon-arrow-1-nw { background-position: -112px -32px; } .ui-icon-arrow-2-n-s { background-position: -128px -32px; } .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } .ui-icon-arrow-2-e-w { background-position: -160px -32px; } .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } .ui-icon-arrowstop-1-n { background-position: -192px -32px; } .ui-icon-arrowstop-1-e { background-position: -208px -32px; } .ui-icon-arrowstop-1-s { background-position: -224px -32px; } .ui-icon-arrowstop-1-w { background-position: -240px -32px; } .ui-icon-arrowthick-1-n { background-position: 1px -48px; } .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } .ui-icon-arrowthick-1-e { background-position: -32px -48px; } .ui-icon-arrowthick-1-se { background-position: -48px -48px; } .ui-icon-arrowthick-1-s { background-position: -64px -48px; } .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } .ui-icon-arrowthick-1-w { background-position: -96px -48px; } .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } .ui-icon-arrow-4 { background-position: 0 -80px; } .ui-icon-arrow-4-diag { background-position: -16px -80px; } .ui-icon-extlink { background-position: -32px -80px; } .ui-icon-newwin { background-position: -48px -80px; } .ui-icon-refresh { background-position: -64px -80px; } .ui-icon-shuffle { background-position: -80px -80px; } .ui-icon-transfer-e-w { background-position: -96px -80px; } .ui-icon-transferthick-e-w { background-position: -112px -80px; } .ui-icon-folder-collapsed { background-position: 0 -96px; } .ui-icon-folder-open { background-position: -16px -96px; } .ui-icon-document { background-position: -32px -96px; } .ui-icon-document-b { background-position: -48px -96px; } .ui-icon-note { background-position: -64px -96px; } .ui-icon-mail-closed { background-position: -80px -96px; } .ui-icon-mail-open { background-position: -96px -96px; } .ui-icon-suitcase { background-position: -112px -96px; } .ui-icon-comment { background-position: -128px -96px; } .ui-icon-person { background-position: -144px -96px; } .ui-icon-print { background-position: -160px -96px; } .ui-icon-trash { background-position: -176px -96px; } .ui-icon-locked { background-position: -192px -96px; } .ui-icon-unlocked { background-position: -208px -96px; } .ui-icon-bookmark { background-position: -224px -96px; } .ui-icon-tag { background-position: -240px -96px; } .ui-icon-home { background-position: 0 -112px; } .ui-icon-flag { background-position: -16px -112px; } .ui-icon-calendar { background-position: -32px -112px; } .ui-icon-cart { background-position: -48px -112px; } .ui-icon-pencil { background-position: -64px -112px; } .ui-icon-clock { background-position: -80px -112px; } .ui-icon-disk { background-position: -96px -112px; } .ui-icon-calculator { background-position: -112px -112px; } .ui-icon-zoomin { background-position: -128px -112px; } .ui-icon-zoomout { background-position: -144px -112px; } .ui-icon-search { background-position: -160px -112px; } .ui-icon-wrench { background-position: -176px -112px; } .ui-icon-gear { background-position: -192px -112px; } .ui-icon-heart { background-position: -208px -112px; } .ui-icon-star { background-position: -224px -112px; } .ui-icon-link { background-position: -240px -112px; } .ui-icon-cancel { background-position: 0 -128px; } .ui-icon-plus { background-position: -16px -128px; } .ui-icon-plusthick { background-position: -32px -128px; } .ui-icon-minus { background-position: -48px -128px; } .ui-icon-minusthick { background-position: -64px -128px; } .ui-icon-close { background-position: -80px -128px; } .ui-icon-closethick { background-position: -96px -128px; } .ui-icon-key { background-position: -112px -128px; } .ui-icon-lightbulb { background-position: -128px -128px; } .ui-icon-scissors { background-position: -144px -128px; } .ui-icon-clipboard { background-position: -160px -128px; } .ui-icon-copy { background-position: -176px -128px; } .ui-icon-contact { background-position: -192px -128px; } .ui-icon-image { background-position: -208px -128px; } .ui-icon-video { background-position: -224px -128px; } .ui-icon-script { background-position: -240px -128px; } .ui-icon-alert { background-position: 0 -144px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-notice { background-position: -32px -144px; } .ui-icon-help { background-position: -48px -144px; } .ui-icon-check { background-position: -64px -144px; } .ui-icon-bullet { background-position: -80px -144px; } .ui-icon-radio-on { background-position: -96px -144px; } .ui-icon-radio-off { background-position: -112px -144px; } .ui-icon-pin-w { background-position: -128px -144px; } .ui-icon-pin-s { background-position: -144px -144px; } .ui-icon-play { background-position: 0 -160px; } .ui-icon-pause { background-position: -16px -160px; } .ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-start { background-position: -80px -160px; } /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ .ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-stop { background-position: -96px -160px; } .ui-icon-eject { background-position: -112px -160px; } .ui-icon-volume-off { background-position: -128px -160px; } .ui-icon-volume-on { background-position: -144px -160px; } .ui-icon-power { background-position: 0 -176px; } .ui-icon-signal-diag { background-position: -16px -176px; } .ui-icon-signal { background-position: -32px -176px; } .ui-icon-battery-0 { background-position: -48px -176px; } .ui-icon-battery-1 { background-position: -64px -176px; } .ui-icon-battery-2 { background-position: -80px -176px; } .ui-icon-battery-3 { background-position: -96px -176px; } .ui-icon-circle-plus { background-position: 0 -192px; } .ui-icon-circle-minus { background-position: -16px -192px; } .ui-icon-circle-close { background-position: -32px -192px; } .ui-icon-circle-triangle-e { background-position: -48px -192px; } .ui-icon-circle-triangle-s { background-position: -64px -192px; } .ui-icon-circle-triangle-w { background-position: -80px -192px; } .ui-icon-circle-triangle-n { background-position: -96px -192px; } .ui-icon-circle-arrow-e { background-position: -112px -192px; } .ui-icon-circle-arrow-s { background-position: -128px -192px; } .ui-icon-circle-arrow-w { background-position: -144px -192px; } .ui-icon-circle-arrow-n { background-position: -160px -192px; } .ui-icon-circle-zoomin { background-position: -176px -192px; } .ui-icon-circle-zoomout { background-position: -192px -192px; } .ui-icon-circle-check { background-position: -208px -192px; } .ui-icon-circlesmall-plus { background-position: 0 -208px; } .ui-icon-circlesmall-minus { background-position: -16px -208px; } .ui-icon-circlesmall-close { background-position: -32px -208px; } .ui-icon-squaresmall-plus { background-position: -48px -208px; } .ui-icon-squaresmall-minus { background-position: -64px -208px; } .ui-icon-squaresmall-close { background-position: -80px -208px; } .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } .ui-icon-grip-solid-vertical { background-position: -32px -224px; } .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } .ui-icon-grip-diagonal-se { background-position: -80px -224px; } /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 3px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 3px; } /* Overlays */ .ui-widget-overlay { background: #aaaaaa; opacity: .3; -ms-filter: Alpha(Opacity=30); /* support: IE8 */ } .ui-widget-shadow { -webkit-box-shadow: 0px 0px 5px #666666; box-shadow: 0px 0px 5px #666666; } /*#endregion assets/css/js/ui/jquery-ui.css*/ /*#region assets/css/js/countdown/css/jquery.countdown.css*/ /* jQuery Countdown styles 2.0.0. */ .is-countdown { border: 1px solid #ccc; background-color: #eee; } .countdown-rtl { direction: rtl; } .countdown-holding span { color: #888; } .countdown-row { clear: both; width: 100%; padding: 0px 2px; text-align: center; } .countdown-show1 .countdown-section { width: 98%; } .countdown-show2 .countdown-section { width: 48%; } .countdown-show3 .countdown-section { width: 32.5%; } .countdown-show4 .countdown-section { width: 24.5%; } .countdown-show5 .countdown-section { width: 19.5%; } .countdown-show6 .countdown-section { width: 16.25%; } .countdown-show7 .countdown-section { width: 14%; } .countdown-section { display: block; float: left; font-size: 75%; text-align: center; } .countdown-amount { font-size: 200%; } .countdown-period { display: block; } .countdown-descr { display: block; width: 100%; } /*#endregion assets/css/js/countdown/css/jquery.countdown.css*/ /*#region assets/css/js/timepicker/jquery.timepicker.min.css*/ .ui-timepicker-container{position:absolute;overflow:hidden;box-sizing:border-box}.ui-timepicker,.ui-timepicker-viewport{box-sizing:content-box;height:205px;display:block;margin:0}.ui-timepicker{list-style:none;padding:0 1px;text-align:center}.ui-timepicker-viewport{padding:0;overflow:auto;overflow-x:hidden}.ui-timepicker-standard{font-family:Verdana,Arial,sans-serif;font-size:1.1em;background-color:#FFF;border:1px solid #AAA;color:#222;margin:0;padding:2px}.ui-timepicker-standard a{border:1px solid transparent;color:#222;display:block;padding:.2em .4em;text-decoration:none}.ui-timepicker-standard .ui-state-hover{background-color:#DADADA;border:1px solid #999;font-weight:400;color:#212121}.ui-timepicker-standard .ui-menu-item{margin:0;padding:0}.ui-timepicker-corners,.ui-timepicker-corners .ui-corner-all{-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.ui-timepicker-hidden{display:none}.ui-timepicker-no-scrollbar .ui-timepicker{border:none}/*# sourceMappingURL=jquery.timepicker.min.css.map */ /*#endregion assets/css/js/timepicker/jquery.timepicker.min.css*/ /*#region assets/css/jquery.fancybox.css*/ body.compensate-for-scrollbar { overflow: hidden; } .fancybox-active { height: auto; } .fancybox-is-hidden { left: -9999px; margin: 0; position: absolute !important; top: -9999px; visibility: hidden; } .fancybox-container { -webkit-backface-visibility: hidden; height: 100%; left: 0; outline: none; position: fixed; -webkit-tap-highlight-color: transparent; top: 0; -ms-touch-action: manipulation; touch-action: manipulation; transform: translateZ(0); width: 100%; z-index: 99992; } .fancybox-container * { box-sizing: border-box; } .fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage { bottom: 0; left: 0; position: absolute; right: 0; top: 0; } .fancybox-outer { -webkit-overflow-scrolling: touch; overflow-y: auto; } .fancybox-bg { background: rgb(30, 30, 30); opacity: 0; transition-duration: inherit; transition-property: opacity; transition-timing-function: cubic-bezier(.47, 0, .74, .71); } .fancybox-is-open .fancybox-bg { opacity: .9; transition-timing-function: cubic-bezier(.22, .61, .36, 1); } .fancybox-infobar, .fancybox-toolbar, .fancybox-caption, .fancybox-navigation .fancybox-button { direction: ltr; opacity: 0; position: absolute; transition: opacity .25s ease, visibility 0s ease .25s; visibility: hidden; z-index: 99997; } .fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption, .fancybox-show-nav .fancybox-navigation .fancybox-button { opacity: 1; transition: opacity .25s ease 0s, visibility 0s ease 0s; visibility: visible; } .fancybox-infobar { color: #ccc; font-size: 13px; -webkit-font-smoothing: subpixel-antialiased; height: 44px; left: 0; line-height: 44px; min-width: 44px; mix-blend-mode: difference; padding: 0 10px; pointer-events: none; top: 0; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-toolbar { right: 0; top: 0; } .fancybox-stage { direction: ltr; overflow: visible; transform: translateZ(0); z-index: 99994; } /*.fancybox-is-open .fancybox-stage { overflow: hidden; }*/ .fancybox-slide { -webkit-backface-visibility: hidden; /* Using without prefix would break IE11 */ display: none; height: 100%; left: 0; outline: none; overflow: hidden; -webkit-overflow-scrolling: touch; padding: 44px; position: absolute; text-align: center; top: 0; transition-property: transform, opacity; white-space: normal; width: 100%; z-index: 99994; } .fancybox-slide::before { content: ''; display: inline-block; font-size: 0; height: 100%; vertical-align: middle; width: 0; } .fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next { display: block; } .fancybox-slide--image { overflow: hidden; padding: 44px 0; } .fancybox-slide--image::before { display: none; } .fancybox-slide--html { padding: 6px; } .fancybox-content { background: #fff; display: inline-block; margin: 0; max-width: 900px; max-height: 96%; overflow: auto; -webkit-overflow-scrolling: touch !important; padding: 4%; position: relative; text-align: left; vertical-align: middle; box-sizing: border-box; } .fancybox-active{ height: 100% !important; } .fancybox-slide--image .fancybox-content { animation-timing-function: cubic-bezier(.5, 0, .14, 1); -webkit-backface-visibility: hidden; background: transparent; background-repeat: no-repeat; background-size: 100% 100%; left: 0; max-width: none; overflow: visible; padding: 0; position: absolute; top: 0; -ms-transform-origin: top left; transform-origin: top left; transition-property: transform, opacity; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 99995; } .fancybox-can-zoomOut .fancybox-content { cursor: zoom-out; } .fancybox-can-zoomIn .fancybox-content { cursor: zoom-in; } .fancybox-can-swipe .fancybox-content, .fancybox-can-pan .fancybox-content { cursor: -webkit-grab; cursor: grab; pointer-events: all; } .fancybox-is-grabbing .fancybox-content { cursor: -webkit-grabbing; cursor: grabbing; } .fancybox-container [data-selectable='true'] { cursor: text; } .fancybox-image, .fancybox-spaceball { background: transparent; border: 0; height: 100%; left: 0; margin: 0; max-height: none; max-width: none; padding: 0; position: absolute; top: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 100%; } .fancybox-spaceball { z-index: 1; } .fancybox-slide--video .fancybox-content, .fancybox-slide--map .fancybox-content, .fancybox-slide--pdf .fancybox-content, .fancybox-slide--iframe .fancybox-content { height: 100%; overflow: visible; padding: 0; width: 100%; } .fancybox-slide--video .fancybox-content { background: #000; } .fancybox-slide--map .fancybox-content { background: #e5e3df; } .fancybox-slide--iframe .fancybox-content { background: #fff; } .fancybox-video, .fancybox-iframe { background: transparent; border: 0; display: block; height: 100%; margin: 0; overflow: hidden; padding: 0; width: 100%; } /* Fix iOS */ .fancybox-iframe { left: 0; position: absolute; top: 0; } .fancybox-error { background: #fff; cursor: default; max-width: 400px; padding: 40px; width: 100%; } .fancybox-error p { color: #444; font-size: 16px; line-height: 20px; margin: 0; padding: 0; } /* Buttons */ .fancybox-button { background: rgba(30, 30, 30, .6); border: 0; border-radius: 0; box-shadow: none; cursor: pointer; display: inline-block; height: 44px; margin: 0; padding: 10px; position: relative; transition: color .2s; vertical-align: top; visibility: inherit; width: 44px; } .fancybox-button, .fancybox-button:visited, .fancybox-button:link { color: #ccc; } .fancybox-button:hover { color: #fff; } .fancybox-button:focus { outline: none; } .fancybox-button.fancybox-focus { outline: 1px dotted; } .fancybox-button[disabled], .fancybox-button[disabled]:hover { color: #888; cursor: default; outline: none; } /* Fix IE11 */ .fancybox-button div { height: 100%; } .fancybox-button svg { display: block; height: 100%; overflow: visible; position: relative; width: 100%; } .fancybox-button svg path { fill: currentColor; stroke-width: 0; } .fancybox-button--play svg:nth-child(2), .fancybox-button--fsenter svg:nth-child(2) { display: none; } .fancybox-button--pause svg:nth-child(1), .fancybox-button--fsexit svg:nth-child(1) { display: none; } .fancybox-progress { background: #ff5268; height: 2px; left: 0; position: absolute; right: 0; top: 0; -ms-transform: scaleX(0); transform: scaleX(0); -ms-transform-origin: 0; transform-origin: 0; transition-property: transform; transition-timing-function: linear; z-index: 99998; } /* Close button on the top right corner of html content */ .fancybox-close-small { background: transparent; border: 0; border-radius: 0; color: #ccc; cursor: pointer; opacity: .8; padding: 8px; position: absolute; right: -12px; top: -44px; z-index: 401; } .fancybox-close-small:hover { color: #fff; opacity: 1; } .fancybox-slide--html .fancybox-close-small { color: currentColor; padding: 10px; right: 0; top: 0; } .fancybox-slide--image.fancybox-is-scaling .fancybox-content { overflow: hidden; } .fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small { display: none; } /* Navigation arrows */ .fancybox-navigation .fancybox-button { background-clip: content-box; height: 100px; opacity: 0; position: absolute; top: calc(50% - 50px); width: 70px; } .fancybox-navigation .fancybox-button div { padding: 7px; } .fancybox-navigation .fancybox-button--arrow_left { left: 0; left: env(safe-area-inset-left); padding: 31px 26px 31px 6px; } .fancybox-navigation .fancybox-button--arrow_right { padding: 31px 6px 31px 26px; right: 0; right: env(safe-area-inset-right); } /* Caption */ .fancybox-caption { background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .15) 65%, rgba(0, 0, 0, .075) 75.5%, rgba(0, 0, 0, .037) 82.85%, rgba(0, 0, 0, .019) 88%, rgba(0, 0, 0, 0) 100%); bottom: 0; color: #eee; font-size: 14px; font-weight: 400; left: 0; line-height: 1.5; padding: 75px 44px 25px 44px; pointer-events: none; right: 0; text-align: center; z-index: 99996; } @supports (padding: max(0px)) { .fancybox-caption { padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left)); } } .fancybox-caption--separate { margin-top: -50px; } .fancybox-caption__body { max-height: 50vh; overflow: auto; pointer-events: all; } .fancybox-caption a, .fancybox-caption a:link, .fancybox-caption a:visited { color: #ccc; text-decoration: none; } .fancybox-caption a:hover { color: #fff; text-decoration: underline; } /* Loading indicator */ .fancybox-loading { animation: fancybox-rotate 1s linear infinite; background: transparent; border: 4px solid #888; border-bottom-color: #fff; border-radius: 50%; height: 50px; left: 50%; margin: -25px 0 0 -25px; opacity: .7; padding: 0; position: absolute; top: 50%; width: 50px; z-index: 99999; } @keyframes fancybox-rotate { 100% { transform: rotate(360deg); } } /* Transition effects */ .fancybox-animated { transition-timing-function: cubic-bezier(0, 0, .25, 1); } /* transitionEffect: slide */ .fancybox-fx-slide.fancybox-slide--previous { opacity: 0; transform: translate3d(-100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--next { opacity: 0; transform: translate3d(100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--current { opacity: 1; transform: translate3d(0, 0, 0); } /* transitionEffect: fade */ .fancybox-fx-fade.fancybox-slide--previous, .fancybox-fx-fade.fancybox-slide--next { opacity: 0; transition-timing-function: cubic-bezier(.19, 1, .22, 1); } .fancybox-fx-fade.fancybox-slide--current { opacity: 1; } /* transitionEffect: zoom-in-out */ .fancybox-fx-zoom-in-out.fancybox-slide--previous { opacity: 0; transform: scale3d(1.5, 1.5, 1.5); } .fancybox-fx-zoom-in-out.fancybox-slide--next { opacity: 0; transform: scale3d(.5, .5, .5); } .fancybox-fx-zoom-in-out.fancybox-slide--current { opacity: 1; transform: scale3d(1, 1, 1); } /* transitionEffect: rotate */ .fancybox-fx-rotate.fancybox-slide--previous { opacity: 0; -ms-transform: rotate(-360deg); transform: rotate(-360deg); } .fancybox-fx-rotate.fancybox-slide--next { opacity: 0; -ms-transform: rotate(360deg); transform: rotate(360deg); } .fancybox-fx-rotate.fancybox-slide--current { opacity: 1; -ms-transform: rotate(0deg); transform: rotate(0deg); } /* transitionEffect: circular */ .fancybox-fx-circular.fancybox-slide--previous { opacity: 0; transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--next { opacity: 0; transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--current { opacity: 1; transform: scale3d(1, 1, 1) translate3d(0, 0, 0); } /* transitionEffect: tube */ .fancybox-fx-tube.fancybox-slide--previous { transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg); } .fancybox-fx-tube.fancybox-slide--next { transform: translate3d(100%, 0, 0) scale(.1) skew(10deg); } .fancybox-fx-tube.fancybox-slide--current { transform: translate3d(0, 0, 0) scale(1); } /* Styling for Small-Screen Devices */ @media all and (max-height: 576px) { .fancybox-slide { padding-left: 6px; padding-right: 6px; } .fancybox-slide--image { padding: 6px 0; } .fancybox-close-small { right: -6px; } .fancybox-slide--image .fancybox-close-small { background: #4e4e4e; color: #f2f4f6; height: 36px; opacity: 1; padding: 6px; right: 0; top: 0; width: 36px; } .fancybox-caption { padding-left: 12px; padding-right: 12px; } @supports (padding: max(0px)) { .fancybox-caption { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); } } } /* Share */ .fancybox-share { background: #f4f4f4; border-radius: 3px; max-width: 90%; padding: 30px; text-align: center; } .fancybox-share h1 { color: #222; font-size: 35px; font-weight: 700; margin: 0 0 20px 0; } .fancybox-share p { margin: 0; padding: 0; } .fancybox-share__button { border: 0; border-radius: 3px; display: inline-block; font-size: 14px; font-weight: 700; line-height: 40px; margin: 0 5px 10px 5px; min-width: 130px; padding: 0 15px; text-decoration: none; transition: all .2s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; } .fancybox-share__button:visited, .fancybox-share__button:link { color: #fff; } .fancybox-share__button:hover { text-decoration: none; } .fancybox-share__button--fb { background: #3b5998; } .fancybox-share__button--fb:hover { background: #344e86; } .fancybox-share__button--pt { background: #bd081d; } .fancybox-share__button--pt:hover { background: #aa0719; } .fancybox-share__button--tw { background: #1da1f2; } .fancybox-share__button--tw:hover { background: #0d95e8; } .fancybox-share__button svg { height: 25px; margin-right: 7px; position: relative; top: -1px; vertical-align: middle; width: 25px; } .fancybox-share__button svg path { fill: #fff; } .fancybox-share__input { background: transparent; border: 0; border-bottom: 1px solid #d7d7d7; border-radius: 0; color: #5d5b5b; font-size: 14px; margin: 10px 0 0 0; outline: none; padding: 10px 15px; width: 100%; } /* Thumbs */ .fancybox-thumbs { background: #ddd; bottom: 0; display: none; margin: 0; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; padding: 2px 2px 4px 2px; position: absolute; right: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); top: 0; width: 212px; z-index: 99995; } .fancybox-thumbs-x { overflow-x: auto; overflow-y: hidden; } .fancybox-show-thumbs .fancybox-thumbs { display: block; } .fancybox-show-thumbs .fancybox-inner { right: 212px; } .fancybox-thumbs__list { font-size: 0; height: 100%; list-style: none; margin: 0; overflow-x: hidden; overflow-y: auto; padding: 0; position: absolute; position: relative; white-space: nowrap; width: 100%; } .fancybox-thumbs-x .fancybox-thumbs__list { overflow: hidden; } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar { width: 7px; } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track { background: #fff; border-radius: 10px; box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 10px; } .fancybox-thumbs__list a { -webkit-backface-visibility: hidden; backface-visibility: hidden; background-color: rgba(0, 0, 0, .1); background-position: center center; background-repeat: no-repeat; background-size: cover; cursor: pointer; float: left; height: 75px; margin: 2px; max-height: calc(100% - 8px); max-width: calc(50% - 4px); outline: none; overflow: hidden; padding: 0; position: relative; -webkit-tap-highlight-color: transparent; width: 100px; } .fancybox-thumbs__list a::before { border: 6px solid #ff5268; bottom: 0; content: ''; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: all .2s cubic-bezier(.25, .46, .45, .94); z-index: 99991; } .fancybox-thumbs__list a:focus::before { opacity: .5; } .fancybox-thumbs__list a.fancybox-thumbs-active::before { opacity: 1; } /* Styling for Small-Screen Devices */ @media all and (max-width: 576px) { .fancybox-thumbs { width: 110px; } .fancybox-show-thumbs .fancybox-inner { right: 110px; } .fancybox-thumbs__list a { max-width: calc(100% - 10px); } } /*#endregion assets/css/jquery.fancybox.css*/ /*#region assets/css/cockpit.css*/ html, body { margin: 0; font-size: 14px; font-family: 'Roboto Condensed', 'Myriad Pro', Tahoma, Verdana, Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; font-stretch: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -ms-overflow-style: -ms-autohiding-scrollbar; scrollbar-color: var(--color-blue-dark) #ffffff; } body, h1, h2, h3, h4, a, p, ul, ol, div, font, textarea, label { font-family: 'Roboto Condensed', 'Myriad Pro', Tahoma, Verdana, Helvetica, Arial, sans-serif; font-size: 16px; text-decoration: none; font-weight: 400; color: var(--color-font); line-height: 22px; padding: 0px; margin: 0px; } ::-webkit-scrollbar-thumb { background: var(--color-blue-light); } A { text-decoration: none; color: #114d7e; font-weight: inherit; font-size: inherit; font-style: inherit; font-family: inherit; line-height: inherit; } ul, ol { display: block; font-family: "Roboto Condensed", sans-serif; font-size: 15px; text-decoration: none; font-weight: normal; color: #000000; line-height: 24px; margin: 10px 0px 10px 15px; padding: 0px 0px 0px 10px; } ul li, ol li { margin-bottom: 5px; } .Titel { display: block; margin: 0px 0px 5px 0px; font-size: 32px; line-height: 40px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-blue-dark); text-transform: uppercase; } .Untertitel { display: block; font-size: 24px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-font); line-height: 30px; margin: 0px 0px 5px 0px; } .Titelklein { display: block; font-size: 18px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-font); line-height: 24px; margin: 0px 0px 5px 0px; } .Textnormal { font-weight: 400; font-style: normal; font-size: 16px; text-decoration: none; color: var(--color-font); line-height: 22px; } .Textfett { font-weight: 700; font-style: normal; font-size: 16px; text-decoration: none; color: var(--color-font); line-height: 22px; } .Textklein { font-style: normal; font-weight: normal; font-size: 14px; text-decoration: none; color: var(--color-font); line-height: 20px; } .TextkleinFett { font-style: normal; font-weight: bold; font-size: 14px; text-decoration: none; color: var(--color-font); line-height: 20px; } .Mehr { display: inline-block; font-size: 16px; font-weight: 700; font-style: normal; text-decoration: none; color: var(--color-blue-dark); line-height: 22px; padding: 0px; margin: 10px 0px 0px 0px; text-decoration: none; cursor: pointer; text-align: left; white-space: nowrap; } .Download-Link { display: block; font-size: inherit; font-weight: bold; color: #446696; margin-top: 12px; line-height: inherit; text-decoration: none; } .Download-Link:before { content: ''; display: inline-block; width: 24px; height: 24px; background: transparent url("https://test.trailer2go.de/assets/css/../images/icons/download_grey.svg") no-repeat 7px 3px; background-size: 16px; float: left; margin-right: 8px; } .Download-Link:hover { color: #446696; text-decoration: underline; } .Verweis-Link { display: block; font-size: inherit; font-weight: bold; color: #446696; margin-top: 12px; line-height: inherit; text-decoration: none; } .Verweis-Link:hover { color: #446696; text-decoration: underline; } /*#endregion assets/css/cockpit.css*/ /*#region assets/css/portal.css*/ /*region general*/ body, html { min-height: 100%; width: 100%; } html { height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { position: relative; margin: 0; min-width: 320px; min-height: 100%; height: auto; background-color: #ebebeb; } header, main, footer, a, li, ul, img, input, nav, h1, h2, h3, h4, h5 { text-align: inherit; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .Background { position: fixed; z-index: 1; display: block; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; padding: 0; margin: 0; background: #FFFFFF url(https://test.trailer2go.de/assets/css/../images/blank.gif) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; } .LoginLogo { position: fixed; z-index: 10; display: block; width: 506px; height: 137px; right: 0; bottom: 0; padding: 0; margin: 10px 30px; text-decoration: none; background: transparent url(https://test.trailer2go.de/assets/css/../images/logo.svg) no-repeat center center; } A { color: var(--color-blue-light); } A.LoginLogo:hover { text-decoration: none; } .Error a { color: var(--color-blue-light) !important; } .LoginSidebar { position: fixed; z-index: 100; display: block; width: 270px; height: 100%; min-height: 450px; top: 0; bottom: 0; left: 0; text-align: center; padding: 0 65px 120px 65px; margin: 0; background: transparent url(https://test.trailer2go.de/assets/css/../images/logo.svg) repeat; } .LoginSidebar form { position: absolute; bottom: 120px; margin: 0 auto 120px auto; } .LoginSidebar input { background-color: #FFFFFF; } .LoginSidebar .Title { font-size: 24px; color: #FFFFFF; line-height: 32px; text-align: center; } .LoginSidebar .Textnormal { font-size: 14px; color: #FFFFFF; line-height: 18px; text-align: center; } .LoginSidebar .Error { /*text-shadow: 0 -1px #FFFFFF, 1px 0 #FFFFFF, 0 1px #FFFFFF, -1px 0 #FFFFFF;*/ /*text-shadow: 0 -1px 1px #FFFFFF, 0 1px 1px #666666;*/ text-shadow: 0 0 0.2em #FFFFFF, 0 0 0.2em #FFFFFF, 0 0 0.2em #FFFFFF; } img { border: none; } label { font-size: 16px; line-height: 22px; } /* == STANDARD ==*/ .Desktop { display: block !important; } .Mobil { display: none !important; } b, strong, .Textbold { font-weight: 600; } .ErrorContainer .Message, .ErrorContainer .Message *, .MessageContainer .Message, .MessageContainer .Message *, .ConfirmContainer .Message, .ConfirmContainer .Message * { font-weight: 500; font-size: 16px; line-height: 22px; } .ErrorContainer .Close, .MessageContainer .Close, .ConfirmContainer .Yes, .ConfirmContainer .No { font-size: 16px; } .soon:after { content: "Coming soon"; -moz-transform: rotate(10deg) !important; -ms-transform: rotate(10deg) !important; -o-transform: rotate(10deg) !important; -webkit-transform: rotate(10deg) !important; transform: rotate(10deg) !important; color: #B4140A; text-transform: uppercase; font-size: 12px; font-style: normal; font-weight: 500; line-height: 12px; text-align: center; display: inline-block !important; width: auto !important; max-width: 70px; height: auto !important; /* right: 0 !important; */ top: 50% !important; position: absolute !important; margin: -10px 0 0 -10px !important; background: none !important; } .navlink.soon { margin-right: 80px !important; } .navlink.soon:after, h3.soon:after, .soon:after { margin: -10px 0 0 5px !important; } article ul, article ol { font-size: inherit; line-height: inherit; color: var(--color-font); text-align: left; } .TextCenter { text-align: center !important; } .TextLeft { text-align: left !important; } .TextRight { text-align: right !important; } .TextRight { margin-right: 0px; } .nowrap { white-space: nowrap !important; } .fullwidth { width: 100% !important; } .flex-row { display: flex; justify-content: space-between; align-items: flex-start; } .flex-row.flex-start { justify-content: start; } .flex-row.flex-center { justify-content: center; } .flex-row.flex-end { justify-content: end; } .visible { display: block; } .hidden { display: none; } .table { display: table; } .flex-wrap { flex-wrap: wrap; } .flex-grow { flex-grow: 1; } .flex-stretch { align-items: stretch; } .col-10 { width: 10% !important; } .col-20 { width: 20% !important; } .col-25 { width: 25% !important; } .col-30 { width: 30% !important; } .col-33 { width: 33% !important; } .col-40 { width: 40% !important; } .col-50 { width: 50% !important; } .col-60 { width: 60% !important; } .col-70 { width: 70% !important; } .col-80 { width: 80% !important; } .col-90 { width: 90% !important; } .col-100 { width: 100% !important; } .table-row { display: table-row; } .table-cell { display: table-cell; } .More, .Station .More { display: block; font-weight: normal; font-style: normal; font-size: 14px; text-decoration: none; color: #1e405a; line-height: 20px; text-align: left; margin: 0 0 0 0; } .More::before, .Station .More::before { content: "> "; } span.clear { display: block; position: absolute; z-index: 100; top: 50%; right: 0; width: 24px; height: 34px; margin: -17px 0 0 0; opacity: 1; cursor: pointer; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/close_grey.svg') no-repeat center; background-size: 34px auto; } section { display: block; box-sizing: border-box; position: relative; z-index: 10; max-width: 1400px; overflow: visible; text-align: center; clear: both; padding: 0; margin: 0 auto; } #Content { margin: 0 auto; padding: 5% 3%; min-height: 450px; background-color: #ffffff; text-align: left; } .white { color: #ffffff; } .blue_dark { color: var(--color-blue-dark); } .blue_light { color: var(--color-blue-light); } .Download, .Telefon, .Verweis, .Anfahrt, .Email { display: block; overflow: visible; font-size: 16px; line-height: 26px; font-weight: 400; font-style: normal; text-decoration: none; vertical-align: middle; margin: 0; padding: 1px 0 1px 0; text-align: left; } .Download { padding: 3px 0 3px 35px; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/download_blue.svg') no-repeat 0 center; background-size: auto 25px; } .Verweis { padding: 3px 0 3px 35px; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/link_blue.svg') no-repeat 0 7px; background-size: auto 23px; } .Telefon, .phone { padding: 3px 0 3px 35px; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/phone_blue.svg') no-repeat 7px center; background-size: auto 25px; } .Email { padding: 3px 0 3px 35px; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/mail_blue.svg') no-repeat 0 center; background-size: 30px auto; } /*endregion*/ /*region header*/ header { position: fixed; z-index: 150; top: 0; left: 0; right: 0; display: block; text-align: center; width: 100%; height: 120px; clear: both; margin: 0; padding: 0; opacity: 1; background-color: #ffffff; -webkit-box-shadow: 0 0 5px 0 #999999; -moz-box-shadow: 0 0 5px 0 #999999; box-shadow: 0 0 5px 0 #999999; } header.Minimized { /*height: 80px !important;*/ border: 0; } header .Container { display: flex; align-items: center; box-sizing: border-box; max-width: initial; width: 100%; height: 100%; padding: 0; } header .Bar { display: block; width: 5%; height: 63px; background: transparent url(https://test.trailer2go.de/assets/css/../images/bar.png) no-repeat center; background-size: cover; z-index: 250; } header.Minimized .Bar { height: 60px; background-size: auto 60px; } header .logo { display: block; width: auto; height: 70px; margin: 25px 30px; padding: 0; text-align: right; z-index: 200; } header.Minimized .logo { margin: 10px 30px; width: auto; height: 60px; } header .logo:hover { -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); opacity: 1; } header .logo img { height: 100%; width: auto; } header #NavigationToggle { position: absolute; z-index: 150; display: none; padding: 0; background: none; width: 50px; height: 50px; cursor: pointer; } header #Navigation { display: block; flex: 1; margin: 0 1%; text-align: center; z-index: 100; } header #Navigation ul { display: flex; position: relative; padding: 0; margin: 0; text-align: left; list-style: none; } header #Navigation li { position: relative; display: list-item; float: left; height: 100%; padding: 0; margin: 0; list-style: none; text-align: -webkit-match-parent; } header #Navigation li.login { margin-left: auto; } header #Navigation li a, header #Navigation li a.Active { display: block; padding: 45px 20px; align-content: center; align-items: center; font-style: normal; font-weight: 300; font-size: 24px; line-height: 30px; text-decoration: none; text-transform: uppercase; color: var(--color-font); cursor: pointer; } header.Minimized #Navigation li a { padding-top: 24px; padding-bottom: 24px; } header #Navigation li a:hover, header #Navigation li a.Active, header #Navigation li a.Active:hover { text-decoration: none; color: var(--color-blue-dark); } header #Navigation li a .icon { position: relative; display: inline-block; float: left !important; vertical-align: bottom; height: 30px; width: 30px; margin: 0 10px 0 0; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/registration_blue_dark.svg') no-repeat center; background-size: contain; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } header #Navigation li a.Active .icon, header #Navigation li a:hover .icon { -ms-filter: none; -webkit-filter: grayscale(0); filter: none; } header #Navigation li.trailers a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/trailer_blue_dark.svg') no-repeat center; background-size: cover; } header #Navigation li.trailers.hapert a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/trailer_hapert_blue_dark.svg') no-repeat center; background-size: cover; } header #Navigation li.stations a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/locations_blue_dark.svg') no-repeat center; background-size: contain; } header #Navigation li.dashboard a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/dashboard_blue_dark.svg') no-repeat center; background-size: 20px auto; } header #Navigation li.login a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/login_blue.svg') no-repeat center; background-size: contain; } header #Navigation li.participate a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/registration_blue_dark.svg') no-repeat center; background-size: contain; } header #Navigation li.faq a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/info_blue_dark.svg') no-repeat center; background-size: contain; } header #Navigation li.time a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/24-7_blue_dark.svg') no-repeat center; background-size: contain; } header #Navigation li.idea a .icon { background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/idea_blue_dark.svg') no-repeat center; background-size: contain; } header .burgercontainer { display: inline-block; box-sizing: border-box; width: 30px; height: 40px; margin: 0px 10px 0 4%; padding: 14px 0px 0px 0px; } header #NavigationToggle .PullRight { display: block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%; cursor: pointer; background-size: 30px 30px; } header #Navigation.toggle-hidden { opacity: 0; visibility: hidden; } header.Minimized #Navigation.toggle-visible { margin: 0; } .Header .profile { box-sizing: border-box; max-width: 350px; overflow: hidden; } .Header .profile.logged { margin-left: auto; } header.logged .Mobile, header.logged ul li.login { display: none !important; } .Header .profile .Profileimage { position: relative; float: right; display: inline-block; margin: 5px 5px 5px 5px; border: 1px solid #c6c4c5; } .Header .profile .infos { text-align: right; position: relative; display: flex; align-items: center; margin: 0px 10px 0px 0px; align-content: center; justify-content: flex-end; } .Header .profile .user { display: block; max-width: 200px; overflow: hidden; padding: 6px 10px 4px 10px; margin: 5px 6px; background-color: #e6e6e6; font-family: 'Roboto Condensed', sans-serif; font-size: 14px; line-height: 18px; } .Header .profile a.button { display: inline-block; padding: 5px 10px; margin: 5px 10px 5px 10px; background-color: var(--color-blue-dark); font-size: 18px; line-height: 24px; font-weight: 300; text-transform: uppercase; color: #ffffff; cursor: pointer; } .Header .profile a.button span { font-size: inherit; line-height: inherit; } .Header .profile a:hover { text-decoration: none; } .Header .profile .icon { position: relative; display: inline-block; height: 30px; width: 30px; margin: 5px; padding: 5px; border: 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/blank.gif) no-repeat center; background-size: auto 90%; box-sizing: border-box; cursor: pointer; } .Header .profile .icon:hover { opacity: 0.5; } .Header .profile .icon.logout { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/logout_blue_dark.svg"); } .Header .profile .icon.settings { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/settings_blue_dark.svg"); } .Header .profile .icon.dashboard { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/dashboard_blue_dark.svg"); } header .language-selection { position: absolute; bottom: 5%; left: 50%; margin: 0; padding: 10px 15px 10px 0; list-style: none; transform: translateX(-50%); color: #FFF; } header .languageline { display: inline-block; width: 1px; height: 8px; vertical-align: bottom; color: #000; border: 0 none; background-color: #000; } header .language-selection li { display: inline; margin: 2px; text-transform: uppercase; } header .language-selection li a { font-size: 11px; line-height: 24px; padding: 8px 2px 8px 2px; text-transform: none; color: #000000; background-color: transparent; } .active_language { } header .language-selection li a.en { background-size: 30px 30px; } header .language-selection li a.de { background-size: 30px 30px; } header .language-selection li a:hover { text-decoration: none; opacity: 0.7; } #userinfo { margin: 70px 0 0 0; text-align: left; color: #ffffff; font-size: 16px !important; line-height: 20px; font-weight: 300; } #userinfo span { display: block; } .langposition { position: absolute; bottom: 5%; left: 10%; color: #FFF !important; } header .languageline { height: 12px; } #langopt-menu { background-color: var(--color-theme-red); overflow: hidden; } .ui-button .ui-icon { margin-top: 3px; margin-left: 5px; } /*endregion*/ /*region glider*/ .glide__track, .glide__slides { height: 100%; position: relative; z-index: 100; } .glide__arrows { display: block; position: absolute; z-index: 200; top: 50%; left: 0px; right: 0px; width: 100%; height: 0px; } .glide-home { position: absolute; top: 0; left: 0; overflow: visible; z-index: 999; } .glide-parent-height { height: 100%; } .glide__slide { position: relative; } .glide__slide .Icon247 { position: absolute; left: 4%; top: 4%; width: 70px; height: 70px; background-image: url("https://test.trailer2go.de/assets/css/../images/icons/24-7_blue_dark.svg"); background-size: contain; background-repeat: no-repeat; background-position: center center; } .glide__overlay, .glide__background { display: block; height: 100%; z-index: 10; overflow: hidden; text-align: left; margin: auto; } .glide__background { background-position: center; background-repeat: no-repeat; background-size: contain; } .glide__slide a { opacity: 1 !important; } .glider__title, .glider__subtitle { position: absolute; display: block; bottom: 72%; left: 10%; z-index: 100; max-width: 40%; padding: 5px 15px; -webkit-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -o-transform: rotate(-8deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); -moz-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; -webkit-transition: left 0.4s 0.4s ease-in-out, right 0.4s 0.4s ease-in-out, bottom 0.4s 0.8s ease-in-out, top 0.4s 0.8s ease-in-out; -moz-transition: left 0.4s 0.4s ease-in-out, right 0.4s 0.4s ease-in-out, bottom 0.4s 0.8s ease-in-out, top 0.4s 0.8s ease-in-out; -ms-transition: left 0.4s 0.4s ease-in-out, right 0.4s 0.4s ease-in-out, bottom 0.4s 0.8s ease-in-out, top 0.4s 0.8s ease-in-out; -o-transition: left 0.4s 0.4s ease-in-out, right 0.4s 0.4s ease-in-out, bottom 0.4s 0.8s ease-in-out, top 0.4s 0.8s ease-in-out; transition: left 0.4s 0.4s ease-in-out, right 0.4s 0.4s ease-in-out, bottom 0.4s 0.8s ease-in-out, top 0.4s 0.8s ease-in-out; } .glider__title { background-color: var(--color-blue-light); } .glider__subtitle { bottom: auto; background-color: var(--color-blue-dark); } .glide__slide.glide__slide--active .glider__title { left: 6%; } .glide__slide.glide__slide--active .glider__subtitle { top: 28%; } a.glider__title, a.glider__subtitle, a.glider__button { text-decoration: none; } .glider__title h1, .glider__subtitle h2, .glider__subtitle span { display: block; font-size: 36px; font-weight: normal; text-decoration: none; color: #FFFFFF; line-height: 40px; text-align: center; text-transform: uppercase; } .glide__arrow { position: absolute; width: 70px; height: 100px; border: none; display: block; overflow: hidden; left: 0px; margin: 0px 0px 0px 0px; margin-left: 0px; padding: 0px; cursor: pointer; z-index: 200; box-shadow: none; text-shadow: none; border-radius: 0; opacity: 0.5; transform: translateY(-50%); } .glide__arrow:hover { opacity: 1; } .home, .home *, .glide, .glide .glide__track, .glide .glide__slides, .glide .glide__slide, .glide .glide__background { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /*endregion*/ /*region side-navigation*/ #NavigationSide { position: fixed; z-index: 40; right: 10%; bottom: -7px; box-sizing: border-box; height: auto; margin: 0px 0px 0px 0px; padding: 0px; } #NavigationSide ul { display: flex; margin: 0px auto; padding: 0px 0px; list-style: none; text-align: center; } #NavigationSide li { position: relative; display: block; overflow: visible; margin: 0px 5px; padding: 0; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #NavigationSide li a.Button { position: relative; display: inline-block; width: 30px; height: 30px; margin: 0; padding: 10px; cursor: pointer; border-bottom: none; background-repeat: no-repeat; background-position: center; } #NavigationSide li:hover a.Button { -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1; box-shadow: unset; } /*endregion*/ /*region footer*/ .Footer { position: relative; display: block; width: auto; height: auto; padding: 3% 0px 3% 0px; margin: 0px auto; text-align: right; background-color: var(--color-blue-dark); z-index: 100; } .Footer .Container { display: block; box-sizing: border-box; max-width: 1400px; margin: 0px auto; text-align: right; } .Footer #NavigationFooter { display: inline-block; position: relative; width: auto; height: auto; padding: 0px; text-align: center; z-index: 200; } .Footer #NavigationFooter ul { display: block; padding: 0px; margin: 0px 0px; text-align: center; list-style: none; } .Footer #NavigationFooter li { position: relative; display: list-item; float: left; padding: 0px; margin: 0px 15px; list-style: none; text-align: -webkit-match-parent; } .Footer #NavigationFooter li a, .Footer #NavigationFooter li.Glue, .Footer #NavigationFooter li a.Active { display: block; margin: 0px; padding: 0px 0px; font-style: normal; font-weight: 300; text-decoration: none; color: #ffffff; font-size: 20px; line-height: 30px; text-transform: uppercase; } .Footer #NavigationFooter li a.Active { text-decoration: none; font-weight: 700; color: var(--color-blue-light); opacity: 0.75; } .Footer .SocialMedia { display: inline-block; float: left; } .Footer .SocialMedia a { display: inline-block; width: 40px; height: 40px; background-position: center; background-size: cover; background-color: transparent; background-repeat: no-repeat; overflow: hidden; text-indent: 1000px; white-space: nowrap; margin: -5px 10px 0 0; } .Footer .SocialMedia a:hover { text-decoration: none; opacity: 0.5; } .Footer .SocialMedia a.facebook { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/socialmedia/facebook.svg); } .Footer .SocialMedia a.instagram { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/socialmedia/instagram.svg); } /*endregion*/ /*region seomap*/ section.seomap { width: 95%; box-sizing: border-box; } section.seomap .container { display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: flex-start; align-items: stretch; max-width: 1280px; margin: 0px auto; padding: 3% 0px 3% 0px; box-sizing: border-box; } section.seomap .figure { display: block; box-sizing: border-box; width: 20%; height: 100px; background-image: url("https://test.trailer2go.de/assets/css/../images/icons/rent.svg"); background-repeat: no-repeat; background-size: contain; background-position: center top; } section.seomap .cities { display: block; box-sizing: border-box; width: 80%; margin: 0px; padding: 0px 0px 0px 4%; list-style: none; text-align: center; line-height: 18px; } section.seomap .cities li { display: inline-block; font-size: 14px; line-height: 18px; margin: 0px; } section.seomap .cities li a, section.seomap .cities li::after { display: inline-block; box-sizing: border-box; margin: 0px 10px; padding: 0px; font-style: normal; font-weight: 300; font-size: 14px; line-height: 20px; color: var(--color-font); text-decoration: none; } /*section.seomap .cities li::after { content: "|"; display: inline-block; font-size: 14px; line-height: 14px; margin: 0px 10px; }*/ section.seomap .cities li b { display: inline-block; width: 1px; height: 1px; text-indent: -1000px; overflow: hidden; } /*endregion*/ /*region home*/ .home { position: relative; width: 100%; z-index: 20; } .home #top { display: flex; position: relative; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center; align-items: center; background: #ffffff; } .home .left, .home .right { display: block; position: relative; width: 30%; background-color: #ffffff; z-index: 100; } .home .right::before { content: ''; display: block; padding-top: 43%; } .home .search, .home .trailers { display: block; position: relative; } .home .search { text-align: center; } .home .search .formSearch { float: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 90%; max-width: 430px; margin: 5% auto; padding: 0; z-index: 999; } .home .search .formSearch #Countries { text-align: left; } .home .search .formSearch .background { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: auto; margin-top: 10px; } .home .search .formSearch #trailer-placeholder { font-size: 24px; line-height: 28px; font-weight: 300; } .home .search .formSearch .info247 { position: relative; box-sizing: border-box; width: 100%; display: block; background-color: #daf0fa; padding: 10px 0px; margin: 15px 0px -5px 0px; text-align: center; } .home .search .formSearch .info247 img { position: relative; box-sizing: border-box; max-width: 100%; width: auto; height: 34px; margin: 0px auto; display: block; } .home .search .formSearch .info247:before { position: absolute; content: ""; box-sizing: border-box; top: 0px; right: 0px; width: 60px; height: 60px; display: inline-block; padding: 0px; margin: -30px -30px 0px 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/button_new.svg) no-repeat center; background-size: contain; -webkit-animation: bounce 2s infinite 5s; -o-animation: bounce 2s infinite 5s; animation: bounce 2s infinite 5s; } @keyframes bounce { 0%, 100%, 20%, 50%, 80% { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } 40% { -webkit-transform: translate(10px, -10px); -ms-transform: translate(10px, -10px); transform: translate(10px, -10px); } 60% { -webkit-transform: translate(5px, -5px); -ms-transform: translate(5px, -5px); transform: translate(5px, -5px); } } .home .search .formSearch .start-search { position: relative; box-sizing: border-box; width: 100%; float: left; min-width: 0px; max-width: 100%; margin: 5px 0px 5px 0px; } .home .search .formSearch .start-search .toggle { box-sizing: border-box; width: 100%; margin: 0px auto 0 auto; padding: 0.5em 45px 0.5em 0.7em; background-color: #ffffff; font-size: 24px; line-height: 28px; color: #a0a0a0; border: 1px solid #dedede; /*border-bottom: 1px solid var(--color-font);*/ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; z-index: 900; } .home .search .formSearch .start-search span.expander { display: block; position: absolute; top: 0; right: -1px; left: auto; width: 40px; height: 100%; margin: 0px 0px 0px 0px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pulldown_white.svg); background-color: var(--color-blue-dark); background-repeat: no-repeat; background-position: center center; background-size: 30px auto; opacity: 1; cursor: pointer; } .home .search .formSearch .toggle-content { position: absolute; overflow: hidden; width: 200%; height: 0; left: 0px; top: 100%; border: 5px solid #ffffff; -webkit-box-shadow: 1px 3px 10px rgb(0 0 0 / 20%); -moz-box-shadow: 1px 3px 10px rgba(0,0,0,0.2); box-shadow: 1px 3px 10px rgb(0 0 0 / 20%); z-index: 999; } .home .search .toggle-content.toggle-visible { padding: 15px 15px 10px 15px; height: auto; overflow: visible; } .home .search .formSearch .start-search .Textfett { font-size: 20px; line-height: 26px; } .home .search .formSearch .start-search .tooltip-container, .tooltip-container { float: left; width: 50%; display: inline-block; position: relative; height: auto; padding: 0px 10px 0px 0px; margin: 0px 0px 0px 0px; box-sizing: border-box; line-height: 0px; font-size: 0px; } .home .search .formSearch .start-search label { display: inline-block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: auto; max-width: 100%; margin: 0px 0px 0px 10px; padding: 0 0 0 25px; font-size: 18px; line-height: 26px; } .home .search .formSearch .start-search input[type='checkbox']:checked + label::before, .home .search .formSearch .start-search input[type='checkbox']:not(:checked) + label::before, .home .search .formSearch .start-search input[type='radio']:checked + label::before, .home .search .formSearch .start-search input[type='radio']:not(:checked) + label::before { top: 1px; } .home .search .formSearch .start-search .Feld { box-sizing: border-box; width: 100%; max-width: 100%; padding: 0.5em 45px 0.5em 0.7em; font-size: 24px; line-height: 28px; font-weight: 300; text-decoration: none; color: var(--color-font); border: 1px solid #dedede; /*border-bottom: 1px solid #dedede;*/ background-color: #ffffff; } .home .search .formSearch .start-search span.clear { top: 0; width: 40px; height: 100%; margin: 0px 0px 0px 0px; background-image: url('https://test.trailer2go.de/assets/css/../images/icons/close_white.svg'); background-color: var(--color-blue-dark); } .home .search .formSearch .start-search .More { float: right; font-size: 18px; line-height: 26px; margin: 10px 0px 0px 30px; cursor: pointer; } .home .search .formSearch .Button { width: 100%; margin: 5px 0 5px 0; padding: 12px 10px; background-color: var(--color-blue-dark); font-size: 24px; line-height: 28px; font-weight: 300; text-align: center; letter-spacing: 1px; color: #ffffff; } .home .trailers { height: 0; padding-bottom: 83.5%; margin: 0px 10%; } .home .trailers .glide__slide { display: block; position: relative; overflow: hidden; text-align: left; } .home .trailers .glide__slide a { display: block; height: 0; overflow: hidden; box-sizing: border-box; padding: 5% 10% 103% 10%; line-height: 13px; } .home .trailers .glide__slide img { display: block; width: 120%; max-width: 120%; height: auto; margin: 15% -10% 5% -10%; } .home .trailers .title-inline, .home .trailers .title-addon { display: block; font-size: 13px; line-height: 13px; text-transform: none; color: #58585a; } .home .trailers .title-inline { text-align: center; } .home .trailers .glide__arrow { width: 20px; height: 20px; box-shadow: none; } .home .trailers .glide__arrow--left { left: -10%; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/arrow_left.svg) no-repeat center; background-size: contain; } .trailers .glide__arrow--right { right: -10%; left: auto; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/arrow_right.svg) no-repeat center; background-size: contain; } .home .right { z-index: 50; width: 70%; } .home .boxes .box { width: 15%; aspect-ratio: 1; } .home .boxes .box a { display: flex; flex-direction: column; justify-content: stretch; align-items: stretch; width: 100%; height: 100%; } .home .boxes .box a:hover { opacity: 0.6; } .home .boxes .box .image { display: block; flex: 1; background-repeat: no-repeat; background-position: center; background-size: 50%; background-color: #ffffff; } .home .boxes .box .image.full { background-size: contain; } .home .boxes .box .title-inline { padding: 10px 10px 10px 10px; background-color: var(--color-blue-dark); font-size: 24px; line-height: 28px; font-weight: 300; color: #ffffff; text-transform: uppercase; min-height: 56px; display: flex; align-content: center; justify-content: center; align-items: center; } .home .Title, .home .Subtitle, .home .Untertitel { max-width: 600px; margin: 0px auto 20px auto; text-align: center; } /*endregion*/ /*region tooltip*/ .tooltip { position: relative; } .tooltip-content { position: absolute; display: none; bottom: -5px; left: 100%; height: 140px; width: 200px; z-index: 999; -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); margin-left: 15px; } .tooltip-content::before, .tooltip-content::after { content: ''; position: absolute; display: block; z-index: -9; right: 100%; -webkit-transform: translateX(50%) rotate(45deg); -moz-transform: translateX(50%) rotate(45deg); -ms-transform: translateX(50%) rotate(45deg); -o-transform: translateX(50%) rotate(45deg); transform: translateX(50%) rotate(45deg); bottom: 10px; height: 15px; width: 15px; background-color: #ffffff; -webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1); box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); } .tooltip-content::before { /*margin-right: -5px; margin-bottom: -2px;*/ margin-right: 0px; margin-bottom: 0px; /* height: 20px;*/ /* width: 20px;*/ box-shadow: none; z-index: 10; background-color: #FFFFFF; } .tooltip-content.infos::after { background-color: var(--color-blue-dark); } .tooltip-content .image, .tooltip-content .text { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 999; background-color: #ffffff; background-size: 90% auto; background-position: center; background-repeat: no-repeat; } .tooltip-content .text { padding: 2%; background-color: var(--color-blue-dark); color: #ffffff; font-size: 12px; line-height: 22px; font-weight: 300; } .tooltip-content .text * { color: #ffffff; } .tooltip:hover .tooltip-content { display: block; } /*endregion*/ /*region introtext*/ article.introtext { position: relative; padding: 0 0 0 0; margin: 0 0 4% 0; display: block; clear: both; } article.introtext.category { margin-bottom: 4%; } article.introtext .textcontent { position: absolute; top: -50px; width: 33%; height: calc(100% + 50px); box-sizing: border-box; padding: 4% 4% 4% 8%; z-index: 999; display: flex; flex-direction: column; align-content: flex-start; justify-content: flex-end; align-items: flex-start; } #MJUContent.No-Titleimage article.introtext .textcontent { top: 0; height: 100%; } article.introtext .textcontent.red { background: var(--color-theme-red); } article.introtext .textcontent * { color: #ffffff; text-align: left; font-size: 20px; line-height: 28px; } article.introtext .textcontent .Introtitle { margin: 0px 0px 20px 0px; font-size: 42px; line-height: 52px; font-weight: 600; } article.introtext .introtextcontainer { position: relative; width: 100%; height: 100%; box-sizing: border-box; padding: 6% 6.5% 4% 40%; } article.introtext.category .introtextcontainer { padding: 4% 6.5% 2% 40%; } article.introtext .introtextcontainer * { text-align: left; } article.introtext .introtextcontainer .Title { font-family: "Roboto Condensed", Times, Times New Roman, serif; font-weight: 500; } article.introtext .introtextcontainer .Subtitle { margin: 0 0 15px 0; } /*endregion*/ /*region shorttext*/ article.shorttext { display: block; padding: 0px 0px 2% 0px; margin: 0px auto; text-align: center; max-width: 850px; } article.shorttext .Title { color: var(--color-blue-dark); } /*endregion*/ /*region introbox*/ .introbox { display: block; width: 50%; max-width: 400px; padding: 0px 3%; margin: 0px auto; text-align: center; } /*endregion*/ /*region portal*/ a.Othermenu, a.OthermenuActive { font-size: 13px; font-weight: normal; text-decoration: none; color: #FFFFFF; line-height: 20px; display: block; text-align: center; margin: 0px; padding: 0px; white-space: initial; } .Seomap { display: block; max-width: 980px; margin: 0px auto; padding: 30px 30px 60px 30px; text-align: left; border-top: 1px solid #FFFFFF; } .Seomap ul { display: block; position: relative; float: left; width: auto; height: auto; padding: 0px; margin: 0px 60px 0px 0px; text-align: left; list-style: none; white-space: initial; } .Seomap li { position: relative; display: list-item; float: none; width: auto; padding: 0px; margin: 0px; background: none; list-style: none; text-align: -webkit-match-parent; white-space: initial; } a.Seomenu { font-size: 12px; font-weight: normal; text-decoration: none; color: #FFFFFF; line-height: 18px; display: block; text-align: left; margin: 0px; padding: 0px; } .Seomap li:hover a.Seomenu, a.Seomenu:hover { text-decoration: none; color: #e6007e; } .Search { display: block; position: relative; padding: 0px 0px 0px 10px; box-sizing: border-box; } .Search .Subtitle { float: left; margin: 0px 20px 0px 0px; line-height: 34px; } .Search .FieldSearch { width: 250px; float: left; margin: 0px 10px 5px 0px; } .Search > * { float: left; margin: 0px 10px 0px 0px; clear: none; } .Search > .CheckboxContainer, .Search > .ButtonImage { margin: 5px 10px 5px 10px; } .Search .FieldFilterContainer .FieldFilterClear { position: absolute; z-index: 100; top: 6px; right: 10px; } .Search .FieldFilterContainer .FieldFilterInput { padding: 6px 30px 6px 6px; } .BtLink { color: #FFFFFF; border: none; border-radius: 5px; background: none; background-color: #e6007e; font-size: 14px; font-weight: normal; line-height: 20px; padding: 8px 25px; text-transform: uppercase; -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75); box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75); } .blue { color: var(--color-blue-dark) !important; } .Container { display: block; position: relative; width: auto; max-width: 1400px; padding: 0px 20px; margin: 0px auto; overflow: visible; text-align: left; clear: both; } .ContainerPrint { position: relative; z-index: 50; top: 0px; left: 0px; display: block; width: 800px; height: 100%; clear: both; margin: -40px; padding: 40px; overflow: visible; background-color: #FFFFFF; } .Content { display: block; position: relative; left: auto; bottom: auto; right: auto; top: auto; margin: 0; padding: 0; overflow: visible; z-index: 20; } #MJUContent .portal > .content { width: 84%; margin: 0 auto; } #MJUContent .portal { position: relative; } .content.login { padding-top: 4%; } article + .content.login { padding-top: 0; } /*.Header .Container { text-align: left; max-width: 100%; height: 100%; } .Header #MJUNavigation, .Header .Titlebar { display: none; } .Header .rebate-firstorder { display: inline-block; position: absolute; z-index: 100; top: 50%; right: 350px; height: 125px; width: 125px; background-image: url(https://test.trailer2go.de/assets/css/../images/bg/bg_rebate_firstorder.svg); background-repeat: no-repeat; background-color: transparent; background-position: center; background-size: contain; box-sizing: border-box; -webkit-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); }*/ #SideNavigation { position: fixed; z-index: 1000; right: 0; top: 220px; height: auto; width: 45px; margin: 0px; padding: 0px; box-sizing: border-box; text-align: right; } #SideNavigation ul { display: block; padding: 0px; margin: 0px; text-align: center; list-style: none; } #SideNavigation ul li { display: block; height: 40px; position: relative; cursor: pointer; text-align: left; margin: 5px 10px 5px 0px; padding: 0; box-sizing: border-box; } #SideNavigation ul li a { display: block; position: absolute; top: 0px; right: 0px; left: 0px; height: 40px; white-space: nowrap; cursor: pointer; box-sizing: border-box; width: auto; text-align: left; opacity: unset; color: var(--color-dark); box-sizing: border-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #SideNavigation ul li:hover a { left: unset; } #SideNavigation .icon { display: inline-block !important; float: left !important; height: 40px !important; width: 40px !important; background-repeat: no-repeat; background-color: var(--color-dark); background-position: center; background-size: 50% auto; border-radius: 20px; border: none; pointer-events: all; margin: 0px !important; box-sizing: border-box; } #SideNavigation ul li:hover .icon { border: 4px solid #FFFFFF; } #SideNavigation .phone .icon { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/phone_white.svg); background-size: 50% auto; } #SideNavigation .contact .icon { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/contact_white.svg); background-size: 60% auto; } #SideNavigation .mail .icon { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/mail_white.svg); background-size: 50% auto; } #SideNavigation .text { display: inline-block; font-weight: 500; font-style: normal; font-size: 15px; line-height: 20px; text-decoration: none; color: inherit; padding: 10px 50px 10px 35px; margin: 0px 0px 0px -20px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #SideNavigation ul li:hover .text { background-color: var(--color-light); } .Container h3, h3, fieldset legend { display: block; font-size: 20px; line-height: 28px; font-weight: 600; margin: 0px 0 15px 0; padding: 0px; color: var(--color-blue-dark); } .Frontend .Subtitle, .Subtitle { display: block; font-size: 24px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-font); line-height: 30px; margin: 0px 0px 5px 0px; } .Frontend .Title + .Textnormal, .Frontend .Subtitle + .Textnormal { margin-top: 20px; } /*endregion*/ /*region fancybox*/ .fancybox-container, .fancybox-container * { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .fancybox-button { background: rgba(0, 0, 0, 1); } .fancybox-container .image { margin-bottom: 20px; } /* .fancybox-content { border: 1px solid #000000; } .fancybox-content .Title { margin: 0px auto 3% auto; } */ .fancybox-content .loginform { padding: 20px; } .fancybox-close-small { width: 50px; height: 50px; margin: 0px; padding: 0 !important; opacity: 1; display: block; background: rgba(0, 0, 0, 0); /* background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/close_black.svg) no-repeat center; */ background-size: contain; } .fancybox-bg { background: rgba(30, 30, 30, 0.75); } .fancybox-container fieldset legend { margin: 0px 0px 10px 0px; } .fancybox-infobar { color: #FFFFFF; } .fancybox-button, .fancybox-button > div, .fancybox-button:visited, .fancybox-button:visited > div, .fancybox-button:link, .fancybox-button:link > div { color: #FFFFFF; } .fancybox-container table, .fancybox-container td, .fancybox-container th, .fancybox-container p, .fancybox-container div, .fancybox-container li, .fancybox-container a, .fancybox-container dl, .fancybox-container dt, .fancybox-container dd, .fancybox-container label { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 16px; line-height: 24px; text-align: left; } .fancybox-container li::marker { font-size: 12px; line-height: 12px; } .fancybox-container .Error { padding-right: 20px; } .fancybox-container fieldset { padding: 0px 0px 3% 0px; } .fancybox-container .Button { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 18px; line-height: 22px; } .fancybox-container .Haupttitel { color: var(--color-dark); font-size: 32px; line-height: 42px; margin: 30px 0 20px 0; } .fancybox-container ul.Downloads, .fancybox-container ul.Links { display: block; width: 100%; margin: 15px 0px 0px 0; padding: 0px; list-style-type: none; list-style-image: none; } .fancybox-container .detailimage { float: right; width: auto; display: block; max-width: 50%; margin: 0px 0px 5% 5%; } .fancybox-container article.standard + .toggle { margin-top: 5%; } .fancybox-slide { text-align: center !important; } .box-content { max-width: 1080px !important; width: 96%; } .box-content.dashboard { background-color: var(--color-blue-dark); border: none; } .box-content.dashboard .Title { margin: 0 0 2% 0; text-align: left; color: #ffffff; } .box-content.dashboard .Button { background-color: var(--color-blue-light); } .box-content #images .image h3 { display: block; margin: 0 0 5px 0; font-weight: 500; } .box-content #images .image .Trailerimage { width: 100%; height: 120px; padding-bottom: 0; border-radius: 0; } #images .image .FieldFile, #images .image .FieldFileIcon { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/folder_blue_dark.svg); background-size: 25px auto; } #images .image .FieldFile:hover, #images .image .FieldFileIcon:hover { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/folder_open_blue_dark.svg); } #images .image .FieldFile input[type="text"], #images .image .FieldFileIcon input[type="text"] { height: 100%; } /*endregion*/ /*region overlay*/ .Overlay { margin: 40px; width: 96%; max-width: 900px !important; } .Content .Overlay, .Content .Overlay + .shorttext { max-width: 100% !important; margin: 40px; width: 96%; } .ContainerPrint .Overlay { width: auto; margin: 0px; padding: 40px; } .Overlay .More { display: block; width: 150px; font-weight: 700; font-style: normal; font-size: 16px; text-decoration: none; color: #1e405a; line-height: 22px; text-align: left; margin: 2px 0px 0px 0px; } .Overlay .More:hover { text-decoration: none; color: #8e9fac; } .Overlay .More:before { content: "> " } .Overlay .Headline { display: block; font-size: 16px; font-weight: 700; font-style: normal; text-decoration: none; color: var(--color-blue-dark); line-height: 22px; margin: 0px 0px 0px 0px; } .Overlay .Address, .Overlay .Opening{ display: block; float: left; width: 41%; margin: 0px 4% 0px 0px; } .Overlay .Servicepartner { display: block; clear: none; float: none; margin: 0 5% 0 0; } .Overlay .ServicePoint .text { width: 90%; } .Overlay .Booking247partner { clear: right; float: left; margin: 0px 5% 0px 0px; } .Overlay .Trailers { display: block; width: 100%; margin: 0px 0px 4% 0px; } .Overlay .TrailersSelect, .Overlay .DatesSelect, .Overlay .LocationsSelect { display: flex; width: auto; margin: 0px 0px 5% 0px; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: flex-start; } .Overlay .DatesSelect { margin: 0px; } .Overlay .Trailers .Trailer, .Overlay .TrailersSelect .Trailer, .Overlay .Trailers .Icon, .Overlay .TrailersSelect .Icon, .Overlay .DatesSelect .ReservationDate, .Overlay .Locations .Location, .Overlay .LocationsSelect .Location, .Overlay .Locations .Icon, .Overlay .LocationsSelect .Icon { display: inline-block; width: 17%; margin: 2% 3% 0px 0px; padding: 11% 0px 2% 0px; font-size: 14px; font-weight: 700; font-style: normal; text-decoration: none; color: var(--color-blue-dark); line-height: 20px; text-align: center; background: transparent url(https://test.trailer2go.de/assets/css/../images/blank.gif) no-repeat top center; background-size: contain; box-sizing: border-box; } .Overlay .TrailersSelect .Trailer, .Overlay .TrailersSelect .Icon, .Overlay .DatesSelect .ReservationDate, .Overlay .LocationsSelect .Location, .Overlay .LocationsSelect .Icon { width: 17%; padding: 13% 0px 2% 0px; text-align: center; cursor: pointer; } .Overlay .LocationsSelect .Location, .Overlay .LocationsSelect .Icon { width: 30%; } .Overlay .DatesSelect .ReservationDate { width: 23%; } .Overlay .Trailers .Trailer, .Overlay .TrailersSelect .Trailer, .Overlay .DatesSelect .ReservationDate, .Overlay .Locations .Location, .Overlay .LocationsSelect .Location { padding: 0; } .Overlay .Trailers .Trailer, .Overlay .TrailersSelect .Trailer, .Overlay .Locations .Location, .Overlay .LocationsSelect .Location { position: relative; } .Overlay .DatesSelect .ReservationDate { margin: 2% 2% 0px 0px; } .Overlay .Trailers .Trailer .Icon, .Overlay .TrailersSelect .Trailer .Icon, .Overlay .Locations .Location .Icon, .Overlay .LocationsSelect .Location .Icon { width: 100%; padding-top: 60%; } .Overlay .Locations .Location .Icon, .Overlay .LocationsSelect .Location .Icon { width: 100%; padding-top: 25%; } .Overlay .Trailers .Trailer label, .Overlay .TrailersSelect .Trailer label, .Overlay .Locations .Location label, .Overlay .LocationsSelect .Location label { padding: 0; text-align: center; font-size: 14px; line-height: 20px; } .Overlay .Trailers .Trailer .info, .Overlay .TrailersSelect .Trailer .info { position: absolute; top: 0; right: 0; width: 25px; height: 25px; margin: -5px -5px 0px 0px; background-color: rgba(255, 255, 255, 0.8); background-image: url("https://test.trailer2go.de/assets/css/../images/icons/info_blue_dark.svg"); background-repeat: no-repeat; background-size: contain; background-position: center center; border-radius: 50%; z-index: 200; } .Overlay .DatesSelect .ReservationDate label { padding: 5% 10%; text-align: center; font-size: 14px; line-height: 18px; color: #FFFFFF; background-color: var(--color-blue-light); border-radius: 5px; } .Overlay .Trailers .Trailer label:hover, .Overlay .TrailersSelect .Trailer label:hover, .Overlay .DatesSelect .ReservationDate label:hover, .calendar_views .calendar_view label:hover, .Overlay .Locations .Location label:hover, .Overlay .LocationsSelect .Location label:hover { opacity: 0.5; } .Overlay .Trailers .Trailer label::before, .Overlay .TrailersSelect .Trailer label::before, .Overlay .DatesSelect .ReservationDate label::before, .calendar_views .calendar_view label::before, .Overlay .Locations .Location label::before, .Overlay .LocationsSelect .Location label::before { visibility: hidden; display: none; width: 0; height: 0; } .Overlay .Trailers .Trailer input[type="radio"]:checked + label span, .Overlay .TrailersSelect .Trailer input[type="radio"]:checked + label span, .Overlay .DatesSelect .ReservationDate input[type="radio"]:checked + label, .Overlay .Locations .Location input[type="radio"]:checked + label span, .Overlay .LocationsSelect .Location input[type="radio"]:checked + label span { opacity: 0.5; position: relative; z-index: 50; } .Overlay .DatesSelect .ReservationDate input[type="radio"]:checked + label { /*background-color: #CCCCCC;*/ background-color: var(--color-theme-black-50); opacity: 1; } .Overlay .Trailers .Trailer input[type="radio"]:checked + label::before, .Overlay .TrailersSelect .Trailer input[type="radio"]:checked + label::before, .Overlay .DatesSelect .ReservationDate input[type="radio"]:checked + label::before, .calendar_views input[type="radio"]:checked + label::before, .Overlay .Locations .Location input[type="radio"]:checked + label::before, .Overlay .LocationsSelect .Location input[type="radio"]:checked + label::before { display: inline-block; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/check_blue.svg) no-repeat center; background-size: 50px auto; position: absolute; z-index: 100; bottom: 0px; right: 0; width: 100%; height: 100%; visibility: visible; border: none; box-shadow: none; margin: 0; } .Overlay .DatesSelect .ReservationDate input[type="radio"]:disabled + label { background-color: var(--color-blue-light); cursor: not-allowed; opacity: 0.4; position: relative; overflow: hidden; } .Overlay .DatesSelect .ReservationDate input[type="radio"]:disabled + label:before { content: " "; display: block; visibility: visible; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; width: 550px; height: 550px; border: none; background: none; transform: rotate(-29deg); border-top: 3px solid var(--color-dark); border-radius: 0; opacity: 1; } .Overlay .DatesSelect .ReservationDate input[type="radio"]:disabled:hover + label:before { background: none; box-shadow: none; } .Overlay .Trailers .Icon img, .Overlay .TrailersSelect .Icon img { display: inline-block; float: left; width: 100px; height: auto; max-height: 70px; margin: -25px 30px -25px 0px; } .Overlay .Contact { display: block; float: right; width: 51%; margin: 0px 4% 4% 0px; } .Overlay .Infos { display: block; float: right; width: 30%; margin: 0px 0px 3% 5%; } .Overlay .Images { display: block; margin: 0px 0px 20px 0px; } .Overlay .Offeror { display: block; margin: 0px 5px 20px 5px; } .Overlay .Offeror a, .Overlay .Address a { color: #1e405a; } .Overlay table { border-collapse: collapse; } .Overlay .Gallery { display: block; float: left; overflow: hidden; margin: 5px; width: 113px; height: auto; max-height: 84px; padding: 0px; background-color: #ffffff; border: 1px solid #999999; } .Overlay .Gallery:hover { text-decoration: none; } .Overlay .Gallery img, .Overlay .Gallery:hover img { display: block; width: 100%; height: auto; margin: 0px; text-decoration: none; } .Overlay .Gallery:hover img { -moz-opacity: 0.7; opacity: 0.7; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0.7)"; } .Overlay .Gallery.First { display: block; float: none; width: auto; height: auto; max-height: initial; margin-top: 0px; } .Overlay .Header { display: block; position: relative; margin: -40px -40px 20px -40px; padding: 0px; width: auto; height: 100px; background: none; clear: both; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .Overlay .Header .Bar { display: block; position: absolute; z-index: 250; top: 20px; right: 50%; width: 50%; height: 63px; margin: 0px 310px 0px 0px; overflow: hidden; background: transparent url(https://test.trailer2go.de/assets/css/../images/bar.png) repeat-x center; background-size: auto 63px; } .Overlay .Header .Slogan { display: inline-block; position: absolute; z-index: 250; top: 57px; right: 50%; width: auto; height: 20px; margin: 0px 100px 0px 0px; font-size: 18px; font-weight: 700; font-style: normal; text-decoration: none; color: var(--color-blue-dark); line-height: 20px; letter-spacing: 0.3px; margin: 0px 145px 0px 0px; } .Overlay .Header .Logo { display: block; position: absolute; z-index: 200; top: 0px; left: auto; right: 0px; bottom: 0px; text-align: right; height: auto; width: 142px; margin: 20px 30px; padding: 0px; } .round-button { position: relative; display: inline-block; margin: 5px 10px 30px 10px; padding: 0; height: 40px; width: 40px; background-color: var(--color-blue-light); background-image: url('https://test.trailer2go.de/assets/css/../images/icons/request_white.svg'); background-repeat: no-repeat; background-position: center center; background-size: 80% auto; border-radius: 50%; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; cursor: pointer; } .round-button .title, .round-button .text { position: absolute; top: 100%; padding: 5px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; } .round-button.phone { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/phone_white.svg'); } .round-button.email { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/mail_white.svg'); background-size: 24px auto; } .round-button.request { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/request_white.svg'); } .round-button.purchase { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/basket_white.svg'); background-size: 24px auto; } .round-button.booking { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/24-7_white.svg'); background-size: 30px auto; } .round-button.route { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/route_white.svg'); } .round-button.web { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/web_white.svg'); } .round-button.print { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/print_white.svg'); } .round-button:hover { background-color: var(--color-blue-dark); } .Overlay .round-button.Desktop { display: inline-block !important; } .Overlay .Openings table, .Overlay .Openings td, .Overlay .Openings th, .Overlay .Openings p, .Overlay .Openings div, .Overlay .Openings li, .Overlay .Openings a, .Overlay .Openings label { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-size: 16px; line-height: 22px; text-align: left; } .Overlay .images { display: flex; flex-wrap: wrap; margin: -5px -5px -5px -5px; } .Overlay .images .image { width: 40%; aspect-ratio: 1.5; margin: 0px 1% 1% 0px; border: 1px solid #dedede; background-repeat: no-repeat; background-size: cover; background-position: center center; } /*endregion*/ /*region loader*/ .loader_container { position: relative; width: 200px; height: 200px; margin: 0 auto; } .loader_container .loader { width: 100%; height: 100%; border: 16px solid #f3f3f3; border-top: 16px solid var(--color-blue-dark); border-radius: 50%; animation: spin 2s linear infinite; box-sizing: border-box; } .loader_container .text { display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 20px; } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .lds-ring { display: inline-block; position: relative; width: 100%; height: 100%; } .lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 100%; height: 100%; border: 14px solid var(--color-blue-dark); border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: var(--color-blue-dark) transparent transparent transparent; } .lds-ring div:nth-child(1) { animation-delay: -0.45s; } .lds-ring div:nth-child(2) { animation-delay: -0.3s; } .lds-ring div:nth-child(3) { animation-delay: -0.15s; } @keyframes lds-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /*endregion*/ /*region container*/ .Container .side .orange { width: 100%; height: 50%; background-color: #f28e43; position: relative; } .Container .side .orange .logo { position: absolute; width: 70%; height: 50%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-image: url(https://test.trailer2go.de/assets/css/../images/title.svg); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; } .Container nav { margin: 0; vertical-align: top; display: inline-block; list-style: none; } .Container ul.menu { margin: 20px 0px 0px 0px; padding: 0; display: inline-block; list-style: none; box-sizing: border-box; } .Container ul.menu li { display: inline-block; position: relative; box-sizing: border-box; margin: 0px 20px 0px 0px; } .Container ul.menu li a { display: inline-block; text-align: center; font-family: 'Roboto Condensed', sans-serif; font-weight: 500; font-size: 14px; line-height: 20px; text-transform: uppercase; text-decoration: none; color: var(--color-dark); height: auto; margin: 0px; padding: 5px 10px; opacity: 1; box-sizing: border-box; } .Container ul.menu li ul.submenu { display: none; position: absolute; top: 100%; left: 0px; text-align: left; width: 250px; overflow: visible; margin: 0px 0px 0px 10px; padding: 0px; } .Container ul.menu li ul.submenu li { display: block; margin: 4px 0px 0px 0px; } .Container ul.menu li:hover ul.submenu { display: block; } .Container ul.menu ul.submenu a { color: #ffffff; width: 100%; display: block; position: relative; background-color: var(--color-dark); margin: 0; height: auto; line-height: 20px; text-align: left; vertical-align: middle; border-bottom: 1px solid #073370; padding: 15px 0; } .Container ul.menu ul.submenu a:last-of-type { border-bottom: 0; } .Container ul.menu ul.submenu a img { height: 20px; margin: 0 10px 0 25px; position: relative; top: -1px; vertical-align: middle; display: inline-block; } .Container ul.menu img { height: 30px; width: 30px; margin: 0 auto 5px auto; display: block; } .Container ul.menu a:hover, .Container ul.menu a:active, .Container ul.menu a.active { font-weight: 400; color: #FFFFFF; background-color: var(--color-dark); } .Container .four-columns { width: 100%; height: auto !important; display: flex; flex-wrap: wrap; } .Container .four-columns h2 { height: auto !important; } .Container.portal .content { width: 100%; /*padding: 20px 30px 20px 30px;*/ padding: 3%; box-sizing: border-box; } .Container.portal, .Container.login { padding: 0px; position: relative; } .Container, .Container h4, .Container p, .Container ul, .Container ol, .Container div, .Container font, .Container label { color: #000000; } .Container h1, .Container h2, .Frontend .Title, .Title { display: block; margin: 0px 0px 5px 0px; font-size: 32px; line-height: 40px; font-weight: normal; font-style: normal; text-decoration: none; color: var(--color-blue-dark); text-transform: uppercase; } .Container.privacy h2, .Container.imprint h2 { margin-bottom: 0; padding-top: 1em; } .Container.privacy h3, .Container.imprint h3 { margin-bottom: 0; padding-top: 0.5em; } .Container.privacy ul, .Container.imprint ul { font-size: 16px; line-height: 20px; padding-left: 20px; } .Container.privacy a, .Container.imprint a { color: #456594; } .Container.privacy a:hover, .Container.imprint a:hover { opacity: 0.6; } .Container.login form h3 { margin-top: 20px; margin-bottom: 10px; } .Container.login .two-columns { float: left; width: 50%; box-sizing: border-box; } .Container.login .two-columns:first-child { padding-right: 10%; } .Container.login input[type='text'], .Container.login input[type='textarea'] { width: 100%; margin-bottom: 10px; padding: 5px; background-color: #00a9eb; color: #686868; border: 1px solid #f2f2f2; } .Container.login input[type='submit'] { float: right; padding: 8px 0px; width: 170px; text-transform: uppercase; font-size: 12px; background-color: #456594; color: #ffffff; border: 1px solid #8798b2; margin-bottom: 10px; } .Container .content.Logos { min-height: inherit; margin: 4% 0 0 0; padding: 0; } .Container .glide--logos { margin: 0px auto 0px auto; height: 150px; padding: 0px 6%; box-sizing: border-box; width: 85%; } .Container .glide--logos .glide__wrapper { height: 130px !important; } .Container .glide--logos .glide__arrows { max-width: 800px; height: 0px; margin-top: -17px; } .Container .glide--logos .glide__background, .Container .glide--logos .link { background-size: contain; background-position: center; margin: 10px 30px; width: auto !important; height: 125px !important; position: absolute; z-index: 100; top: 0px; right: 0px; bottom: 0px; left: 0px; } .Container .glide--logos .link { cursor: pointer; z-index: 150; } .Container .glide--logos .glide__arrow { background-size: 25px 35px !important; width: 25px; height: 35px; opacity: 0.2; margin: 0px; } .Container .glide--logos .glide__arrow.prev { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pull_left_grey.svg) !important; } .Container .glide--logos .glide__arrow.next { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pull_right_grey.svg) !important; } .Container .glide--logos .glide__slide { height: 130px !important; box-sizing: border-box; width: 10%; } .Container li { margin-bottom: 0.5em; } .Container .content.map { padding: 0; } .Container .OrganizationsList .organization, .Container .PersonsList .organization { display: block; vertical-align: middle; width: 100%; margin: 3% 0; padding: 0; font-weight: normal; font-style: normal; font-size: 14pt; line-height: 20px; text-decoration: none; color: #58585a; } .Container .OrganizationsList .organization h3, .Container .PersonsList .organization h3{ font-size: 16px; line-height: 22px; font-weight: 500; margin: 0px 0px 5px 0px; } .Container .OrganizationsList .organization h4, .Container .PersonsList .organization h4 { font-weight: 500; } .Container .OrganizationsList .organization .text { display: none; } .Container .OrganizationsList .organization h4, .Container .OrganizationsList .organization .text { margin: 0px 0px 0px 25px; } .Container .OrganizationsList .organization .text, .Container .PersonsList .organization .text, .Container .OrganizationsList .organization a, .Container .PersonsList .organization a, .Container .OrganizationsList .organization .text div, .Container .PersonsList .organization .text div { font-size: 13px; line-height: 18px; } .Container .OrganizationsList .organization a, .Container .PersonsList .organization a { text-decoration: underline; display: block; } .Container .PersonsList .organization a { margin: -5px 0px 10px 0px; } .Container .OrganizationsList .organization h3.legend { padding: 0px 0px 0px 25px; background-position: left top; margin: 0px 0px 0px 0px; } .Container .paging { display: flex; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: center; align-items: center; position: relative; text-align: center; list-style: none; margin-left: 0 !important; margin-right: 0 !important; } .Container .paging form { display: inline-block; box-sizing: border-box; width: auto; } .Container .paging > li { display: inline-block; box-sizing: border-box; min-width: 35px; padding: 0px; line-height: 30px; font-size: 16px; font-weight: 700; text-align: center; margin-left: -1px; border: 1px solid #999999; background-color: #FFFFFF; } .Container .paging a { color: #000000; min-width: 35px; margin: 0px; padding: 0px 10px; line-height: 30px; font-size: 16px; font-weight: 700; text-align: center; display: inline-block; box-sizing: border-box; text-decoration: none; } .Container .paging li:hover { background-color: var(--color-dark); } .Container .paging a:hover { text-decoration: none; color: #ffffff; } .Container .paging li.Current { color: #ffffff; background-color: var(--color-dark); } /*endregion*/ /*region content layout*/ .Columns:after { visibility: hidden; display: block; font-size: 0px; content: " "; clear: both; height: 0px; } .ie7 .Columns { zoom: 1; } /* IE7 */ .Col50 { position: relative; display: inline-block; float: left; box-sizing: border-box; margin: 0px; padding: 0px; width: 50%; vertical-align: top; background-color: #efefef; padding: 2% 3%; } .Col50.Left, .Col50.Right { width: 48%; } .Col50.Left { margin: 0px 2% 2% 0px; } .Col50.Right { margin: 0px 0px 2% 2%; } .Flex { display: flex; flex-wrap: wrap; flex-direction: row; align-content: flex-start; justify-content: flex-start; align-items: normal; } .NoFloat { float: none !important; } .NoMargins { margin: 0px !important; } .NoPaddings { padding: 0px !important; } .MarginBottom10 { margin-bottom: 10px; } .MarginBottom { margin-bottom: 1.5%; } .MarginBottomDouble { margin-bottom: 3%; } .MarginCentered { display: inline-block; margin: 0px auto; } .Outside { left: 100% !important; } .person { display: inline-block; font-size: 10px; width: 22%; height: auto; box-sizing: border-box; font-family: 'Roboto Condensed'; font-weight: 500; vertical-align: top; position: relative; padding-bottom: 20px; margin: 0px 4% 4% 0px; } .four-columns .person:nth-child(4n + 0) { margin: 0px 0px 4% 0px; } .person img { width: 100%; padding-bottom: 4pt; } .person p { padding-top: 2pt; text-align: left; } .person .place { font-size: 13px; line-height: 120%; margin-bottom: 10px; } .person .position { color: #f18e43; font-size: 13px; line-height: 120%; font-style: italic; position: relative; margin-bottom: 10px; display: block; } .person .mail-icon { float: right; display: inline-block; width: 30px; } .person .mail-icon:hover { opacity: 0.7; } .person hr { position: absolute; width: 100%; bottom: 0; border: 2px solid rgba(109,104,104,0.5); clear: both; margin-bottom: 16px; box-sizing: border-box; } /*endregion*/ /*region login*/ .login { max-width: 1000px; margin: 0 auto; } .login .loginform { background-color: #ffffff; max-width: 500px; text-align: center; padding: 50px; margin: 0px auto 0 auto; } .login .loginform .floating-label { margin-bottom: 10px; } /* .login .loginform input[type='text'], .login .loginform input[type='password'] { width: 100%; margin-bottom: 10px; padding: 7px 15px; color: var(--color-blue-dark); border: 1px solid #dedede; } .login .loginform input[type='text']::placeholder, .login .loginform input[type='password']::placeholder { color: #999999; font-style: italic; }*/ .login .loginform input[type='submit'], .login .loginform input[type='button'], .login .loginform .Button { min-width: 240px; text-align: center; font-size: 18px; line-height: 22px; padding: 10px 0px; } /*endregion*/ /*region dashboard*/ #dashboard { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 2% 2% 2% 2%; } .dashboard > .flex-row { align-items: stretch; gap: 20px; } .dashboard .grid-item { align-items: stretch; box-sizing: border-box; min-height: 280px; padding: 1vw 1vw 1vw 1vw; background-color: #ffffff; } .dashboard #profile .flex-row { align-items: center; } .dashboard #services { grid-column: 2 / 4; } .dashboard .grid-item.white { background-color: #ffffff; } .dashboard .grid-item.gray { background-color: var(--color-gray); } .dashboard .grid-item.blue { background-color: var(--color-blue-dark); } .dashboard .grid-item.blue * { color: #ffffff !important; } .dashboard .grid-item .title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; padding: 10px 13px 10px 13px; background-color: var(--color-blue-light); } .dashboard .grid-item h3 { display: flex; align-items: center; box-sizing: border-box; margin: 0 0 0 0; -ms-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; -o-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); transform: rotate(-180deg); font-size: 21px; line-height: 25px; font-weight: 500; color: #ffffff; text-transform: uppercase; letter-spacing: 2px; } .dashboard .grid-item h3 img { display: inline-block; -o-transform: rotate(90deg); -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); } .dashboard .grid-item h4 { text-align: center; font-size: 18px; line-height: 22px; text-transform: uppercase; color: var(--color-blue-dark); } .dashboard.tenant .grid-item h4 { font-size: 22px; line-height: 26px; } .dashboard .grid-item.blue h4 { color: #ffffff; } .dashboard .grid-item .content { position: relative; justify-content: space-evenly; align-content: center; flex: 1; gap: 1vw; } .dashboard .grid-item .content.top { align-content: normal; } .dashboard .grid-item .content a.image { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; max-width: 150px; width: 47%; text-align: center; } .dashboard #services .content a.image { width: 23%; } .dashboard .grid-item .content a.image .background { width: 100px; height: 60px; background-repeat: no-repeat; background-size: auto 75%; background-position: center bottom; } .dashboard .grid-item .content a.image span { font-size: 16px; line-height: 22px; text-transform: uppercase; color: var(--color-app-light); } .dashboard .grid-item .content a.image span.count, .toggle h2 .count { position: absolute; right: -15px; top: -15px; display: flex; justify-content: center; align-items: center; box-sizing: content-box; min-width: 20px; aspect-ratio: 1; padding: 5px; background-color: darkred; border-radius: 50%; color: #ffffff; font-size: 16px; line-height: 16px; -o-transform: rotate(10deg); -ms-transform: rotate(10deg); -moz-transform: rotate(10deg); -webkit-transform: rotate(10deg); transform: rotate(10deg); } .dashboard .grid-item.reservations .content, .dashboard .grid-item.trailers .content { display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; } .dashboard .grid-item.reservations .content > .More, .dashboard .grid-item.trailers .content > .More { text-align: center; font-size: 18px; line-height: 22px; color: var(--color-blue-dark); } .dashboard .grid-item.reservations .content > .More::before, .dashboard .grid-item.trailers .content > .More::before { content: '» '; color: var(--color-blue-dark); } .dashboard .grid-item.trailers .content > .More, .dashboard .grid-item.trailers .content > .More::before { color: #ffffff; } .dashboard .grid-item .trailer { display: flex; /*justify-content: space-between; align-items: stretch;*/ align-content: flex-start; justify-content: flex-start; align-items: flex-start; gap: 10px; margin: 2% 2%; width: 46%; box-sizing: border-box; } .dashboard .grid-item .trailer .image { box-sizing: border-box; width: 40%; max-width: 150px; height: 0px; padding: 0px 0px 20% 0px; display: flex; margin: 0px; border: 1px solid var(--color-blue-light); background-color: #ffffff; background-repeat: no-repeat; background-size: cover; background-position: center center; } .dashboard .grid-item .trailer .info { display: block; } .dashboard .grid-item .trailer .name { margin: 0 0 5px 0; font-size: 16px; line-height: 20px; text-transform: uppercase; color: var(--color-blue-dark); } .dashboard .grid-item .trailer .Address { font-size: 13px; line-height: 18px; } .dashboard .grid-item .trailer .date { font-size: 14px; line-height: 20px; color: var(--color-blue-dark) } .dashboard .grid-item .trailer .tenant { font-size: 14px; line-height: 15px; color: var(--color-blue-dark) } .dashboard .grid-item.trailers .trailer .name, .dashboard .grid-item.trailers .trailer .date, .dashboard .grid-item.trailers .trailer .tenant { color: #ffffff; } .dashboard .grid-item .trailer .More { margin: 5px 0 0 0; font-size: 12px; line-height: 14px; font-weight: 700; color: var(--color-blue-light); } .dashboard .grid-item .trailer .More::before { content: '» '; font-size: 16px; color: var(--color-blue-light); } .dashboard:not(.grid) .content { padding: 3% 3% 3% 3%; background-color: #d6ecf6; } .dashboard #reservations.grid-item .trailer { width: 95%; gap: 20px; } .dashboard #reservations.grid-item .trailer:nth-child(4), .dashboard #reservations.grid-item .trailer:nth-child(5) { display: none; } .dashboard #trailers.grid-item .trailer .image { padding: 0px 0px 27% 0px; } /*region Responsive 1600px*/ @media(max-width: 1600px) { .dashboard .grid-item .trailer { width: 95%; gap: 20px; } .dashboard .grid-item .trailer:nth-child(5), .dashboard .grid-item .trailer:nth-child(6) { display: none; } .dashboard .grid-item .trailer .image { width: 100%; max-width: 120px; height: 0px; padding: 0px 0px 27% 0px; } } /*endregion*/ .fancybox-content { background-color: #FFFFFF !important; margin: 0px; } .fancybox-container .toggle h2 .count { min-width: 15px; } .toggle h2 .count { position: relative; right: unset; top: unset; border: 1px solid #ffffff; } .toggle h2 .count:hover { background-color: #ffffff; color: darkred; border-color: darkred; } .dashboard .grid-item .buttons { width: 100%; } .dashboard .grid-item .buttons a { background-color: #e3e3e3; color: var(--color-app-dark); } #dashboard.tenant #reservations { grid-area: 1 / 1 / 3 / 3; } #dashboard.tenant #profile { grid-area: 1 / 3 / 1 / 4; } #dashboard.tenant #services { grid-area: 2 / 3 / 2 / 4; } #dashboard.tenant #reservations .reservation { max-width: 750px; margin: 2% auto; } #dashboard.tenant #reservations .reservation .image { float: right; max-width: 400px; width: 100%; background-repeat: no-repeat; background-size: contain; background-position: center center; margin: 0px 0px 20px 20px; } #dashboard.tenant #reservations .reservation .image::before { content: ''; display: block; padding-top: 60%; } #dashboard.tenant #reservations .reservation .action { margin-top: 10px; } #dashboard.tenant .timer { box-sizing: border-box; min-width: 300px; width: fit-content; margin: 0.5% 0 2% 0; padding: 10px 10px 10px 10px; /*background: var(--color-blue-dark);*/ background: var(--color-blue-light); text-align: center; /*background: linear-gradient(177deg, var(--color-blue-light) 0%, var(--color-blue-dark) 100%);*/ } #dashboard.tenant .timer.compact { min-width: unset; } #dashboard.tenant .timer.highlight { background-color: #dc143c; } #dashboard.tenant .timer * { color: #ffffff; } #dashboard.tenant .timer .countdown-section { display: block; padding: 0; } #dashboard.tenant .timer .countdown-section { display: inline-block; float: none; width: auto; text-align: center; } #dashboard.tenant .timer .countdown-section + .countdown-section { margin-left: 20px; } #dashboard.tenant .timer .countdown-section .countdown-amount { display: block; font-size: 30px; line-height: 36px; font-weight: 700; } #dashboard.tenant .timer .countdown-section .countdown-period { font-size: 16px; line-height: 16px; } #dashboard.tenant #reservations .reservation .action { clear: both; } #dashboard.tenant #reservations .reservation #Button, #dashboard.tenant #reservations .reservation .Button { font-size: 24px; line-height: 28px; font-weight: 300; } #dashboard.tenant #reservations .reservation.overview .Button { font-size: 18px; line-height: 22px; } #dashboard.tenant #reservations .reservation .Button.green { background-color: #00ff00; } #dashboard.tenant #reservations .reservation .Button.red { background-color: #ff0000; } #dashboard.tenant #reservations .reservation .action .Button { cursor: default; } #dashboard.tenant #reservations .reservation .action input[type="submit"] { cursor: pointer; } #dashboard.tenant #reservations .reservation .action .Button:hover { opacity: 1; } #dashboard.tenant #reservations .reservation .action input[type="submit"]:hover { opacity: 0.5; } #dashboard.tenant #reservations .reservation .Button + .loading { margin-left: 15px !important; } #dashboard.tenant #reservations .reservation .loading { width: 40px; } #dashboard.tenant #reservations .reservation .location { margin-bottom: 20px; } #dashboard.tenant #reservations .reservation .Success .loading { margin: 0px 0px 0px 20px; float: right; width: 50px; } #dashboard.tenant .Information, #dashboard.tenant .Error, #dashboard.tenant .Warning, #dashboard.tenant .Success { font-size: 18px !important; line-height: 26px !important; font-weight: bold; padding: 20px; } #dashboard.tenant .Information *, #dashboard.tenant .Error *, #dashboard.tenant .Warning *, #dashboard.tenant .Success * { font-size: 18px !important; line-height: 26px !important; font-weight: bold; } #dashboard.tenant .Information .Textnormal, #dashboard.tenant .Error .Textnormal, #dashboard.tenant .Warning .Textnormal, #dashboard.tenant .Success .Textnormal { margin: 0px; } #dashboard.tenant #Error { margin-bottom: 20px; } img.reservation-successfully { margin: -5px 10px 10px 0px; float: left; max-width: 50px; } .dashboard .Title { font-size: 21px; line-height: 26px; text-align: center; letter-spacing: 0; } .dashboard .box { display: inline-block; position: relative; box-sizing: border-box; width: 30%; padding: 25% 0 0 0; text-align: center; background-color: var(--color-app-dark); height: 0px; margin: 1% 1% 1% 1%; } .dashboard .box h1 { position: absolute; width: 87%; top: 15%; left: 50%; color: #ffffff; border-bottom: none; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); } .dashboard .box h3 { position: absolute; width: 85%; /*top: 45%;*/ top: 40%; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); text-transform: uppercase; color: #ffffff; font-size: 20px; line-height: 26px; } .dashboard .box.darkgray { background-color: #6c6867 !important; } .dashboard .box.darkgray h3 { color: #ffffff; } .dashboard .box img { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); max-width: 100px; height: 20%; margin: 10px 0 20px 0; } .dashboard .box .buttons { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); width: 85%; height: auto; } .dashboard .buttons a { display: block; position: relative; box-sizing: border-box; width: 100%; padding: 8px; text-align: left; font-size: 20px; line-height: 26px; } .dashboard .buttons a + a { margin-top: 10px; } .dashboard .buttons a:hover { opacity: 0.6; text-decoration: none; } .dashboard .buttons .add, .Container.dashboard .buttons .delete { margin-bottom: 5px; } .dashboard .buttons a.edit { text-align: center; text-transform: uppercase; } .dashboard .buttons .count { display: inline-block; position: absolute; top: 0px; right: 0px; box-sizing: border-box; margin: -15px -20px 0px 0px; padding: 10px 15px; text-align: center; border-radius: 50%; border: 1px solid #ffffff; background: darkred; font-size: 14px; text-decoration: inherit; font-weight: bold; font-style: inherit; color: #FFFFFF; line-height: 20px; transform: rotate(10deg); -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg); -ms-transform: rotate(10deg); -o-transform: rotate(10deg); } .dashboard .Profileimage { width: 100%; height: auto; max-height: none; aspect-ratio: 1; padding: 0; border: 1px solid #dedede; border-radius: 50%; background-repeat: no-repeat; background-position: center center; background-size: contain; } .dashboard .Profileimage img { top: 0; overflow: hidden; margin: 0; display: block; position: relative; width: auto; height: 100%; max-width: none; max-height: 100%; box-sizing: border-box; } .dashboard .greetings { position: absolute; width: 85%; top: 75%; left: 50%; padding: 0; margin: 0px; font-size: 20px; line-height: 26px; color: #ffffff; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); } .dashboard .box.with-buttons h1 { top: 7%; } .dashboard .box.with-buttons .Profileimage { top: 22%; } .dashboard .box.with-buttons .greetings { top: 65%; } .dashboard .TrailersList .Trailer .image { width: 40%; height: auto; padding: 0px; aspect-ratio: 16 / 9; background-size: cover; } .dashboard .TrailersList .Trailer .info { width: 60%; } .dashboard .LocationsList .list.columns-6 .row { grid-template-columns: 0.6fr 1.4fr 0.6fr 1.4fr 1.2fr 0.2fr; } .Frontend table.datatable { width: 100%; max-width: 100%; margin: 0px auto; border: 1px solid #cccccc; border-collapse: collapse; border-spacing: 0px; } .Frontend table.datatable td, .Frontend table.datatable th { vertical-align: top; text-align: center; border: none; background: none; padding: 7px 10px; border: 1px solid #cccccc; line-height: 20px; font-size: 15px; } .Frontend table.datatable th { vertical-align: middle; font-weight: 500; background-color: #114d7e; color: #FFFFFF; padding: 7px 10px; } .Frontend table.datatable td { white-space: nowrap; } .Frontend table.datatable td.text { text-align: left; white-space: normal; } .Frontend table.datatable td:first-child { vertical-align: middle; font-weight: 500; background-color: #2199d1; color: #FFFFFF; padding: 7px 10px; } .Information, .Error, .Warning, .Success { padding: 20px; } .Frontend .Information, .Frontend .Error, .Frontend .Warning, .Frontend .Success { font-size: 16px !important; line-height: 22px !important; } /*endregion*/ /*region sidebar*/ #sidebar { width: 20%; box-sizing: border-box; padding: 3% 3% 3% 3%; background-color: var(--color-blue-light); } #sidebar * { color: #ffffff; } #sidebar .Title { text-align: left; font-size: 21px; line-height: 26px; letter-spacing: unset; } #sidebar .calendar_views .calendar_view { display: inline-block; width: 30%; text-align: center; } #sidebar .calendar_views .calendar_view label { padding: 0 0 0 0; } #sidebar .calendar_views .Icon { display: block; width: 100%; padding-top: 60%; margin-bottom: 5px; background-image: url('https://test.trailer2go.de/assets/css/../images/icons/boxed/calendar_white.svg'); background-repeat: no-repeat; background-size: cover; background-position: center center; } #sidebar .calendar_views .Icon.week { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/boxed/calendar_week_white.svg'); } #sidebar .calendar_views .Icon.trailers { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/boxed/trailer_luggage_white.svg'); } #sidebar input.Search { color: var(--color-font); } #sidebar .Button.Search { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/search_white.svg); margin: 0 0 0 10px; } #sidebar summary { position: relative; padding-right: 30px; list-style: none; font-size: 18px; line-height: 24px; text-align: left; color: #ffffff; cursor: pointer; text-transform: uppercase; border-bottom: 2px solid #ffffff; -o-transition: margin 200ms ease-out; -ms-transition: margin 200ms ease-out; -moz-transition: margin 200ms ease-out; -webkit-transition: margin 200ms ease-out; transition: margin 200ms ease-out; } #sidebar summary::after { content: ''; position: absolute; top: 0; right: 0; display: block; width: 30px; height: 100%; background-image: url("https://test.trailer2go.de/assets/css/../images/icons/arrow_down_white.svg"); background-repeat: no-repeat; background-position: center center; -o-transition: transform 0.4s ease-in-out; -ms-transition: transform 0.4s ease-in-out; -moz-transition: transform 0.4s ease-in-out; -webkit-transition: transform 0.4s ease-in-out; transition: transform 0.4s ease-in-out; } #sidebar summary::after { -o-transform: rotate(0deg); -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } #sidebar details[open] summary { margin-bottom: 10px; } #sidebar details[open] summary::after { -o-transform: rotate(180deg); -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #sidebar details summary::-webkit-details-marker { display:none; } #sidebar .CheckboxList .CheckboxContainer { width: 100%; float: none; } #sidebar .CheckboxContainer { display: block; } /*endregion*/ /*region list*/ .list { margin: 20px 0 0 0; } .list .row { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; align-items: center; padding: 10px 0; } .list.columns-4 .row { grid-template-columns: 1fr 1fr 1fr 1fr; } .list.columns-5 .row { grid-template-columns: 1fr 1fr 1fr 1fr 0.2fr; } .list.columns-6 .row { grid-template-columns: 0.2fr 1fr 1fr 1fr 1fr 0.2fr; } .list.columns-7 .row { grid-template-columns: 0.2fr 1fr 1fr 1fr 1fr 1fr 0.2fr; } .list.invoices.columns-4 .row { grid-template-columns: 0.3fr 1fr 1fr 0.2fr; } .list.invoices.columns-6 .row { grid-template-columns: 0.2fr 0.8fr 1fr 0.6fr 1.3fr 0.2fr; } .list.coupons.columns-6 .row { grid-template-columns: 0.4fr 0.7fr 0.2fr 0.5fr 0.5fr 0.2fr; } .list .row .item { padding: 0 1vw 0 1vw; } .list .row .item.number, .list .row .item.action { min-width: 100px; } .list .row .item.active { line-height: 20px; } .list .row .item.active img { display: inline-block; border: 0; width: 20px; height: 20px; margin: 4px 0px 0px 0px; } .list .row.header { background-color: var(--color-blue-light); padding: 20px 0; } .list .row.header * { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; color: #ffffff !important; font-size: 18px; line-height: 18px; font-weight: 400; } .list .data .row { margin: 10px 0 0 0; /*background-color: var(--color-blue-dark);*/ background-color: #FFFFFF; } .list .data .row * { font-size: 18px; line-height: 24px; font-weight: 300; /*color: #ffffff;*/ color: var(--color-blue-dark); } .list .data .row .item { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .list .data .row:nth-child(even) { background-color: #ffffff; } .list .data .row:nth-child(even) * { color: var(--color-blue-dark); } .list .data .row .action .Icon { display: inline-block; width: 30px; height: 30px; background-color: var(--color-blue-light); background-repeat: no-repeat; background-size: auto 60%; background-position: center center; } .list .data .row .action .Icon:hover { opacity: 0.5; cursor: pointer; } .list .data .row .action .Icon + .Icon { margin: 0 0 0 10px; } .list .data .row .action .Icon.edit { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/edit_white.svg'); } .list .data .row .action .Icon.info { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/info_white.svg'); } .list .data .row .action .Icon.delete { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/delete_white.svg'); } .list .data .row .action .Icon.copy { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/documents_white.svg'); } .list .data .row .action .Icon.download { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/download_white.svg'); } /*endregion*/ /*region layout*/ .Center { display: block; text-align: center !important; } .clearfix:after { visibility: hidden; display: block; font-size: 0px; content: " "; clear: both; height: 0px; } .ie7 .clearfix { zoom: 1; } /* IE7 */ .Column50Left fieldset.bg-grey, .Column50Right fieldset.bg-grey { padding: 5% 6% 5% 6%; } .Column50Left fieldset.bg-grey.full, .Column50Right fieldset.bg-grey.full { padding: 2% 4% 4% 4%; margin: 8% 0px 8% 0px; } .Columns fieldset.nolegend { margin-top: 30px; } /*.Columns fieldset + fieldset { margin: 30px 0px 0px 0px !important; }*/ .Column50Left fieldset .Button, .Column50Right fieldset .Button { position: absolute; right: 6%; bottom: -25px; min-width: 53%; padding: 10px 20px 10px 20px; background-image: none; font-size: 16px; font-weight: 400; text-transform: none; letter-spacing: 0; } .Columns fieldset .Field, .Columns fieldset .Select { } .Columns fieldset .select-wrapper { position: relative; } .Columns .row, .Columns .row label, .Columns .row .Textnormal, .Columns .row .Textbold { display: block; font-size: 18px; line-height: 30px; text-align: left; } .Columns .row .Textnormal, .Columns .row .Textbold { font-size: 18px; line-height: 24px; } .Columns .row .Subtitle { font-size: 22px; line-height: 30px; } fieldset input[type='checkbox'] + label, fieldset input[type='radio'] + label { font-size: 16px; line-height: 24px; font-weight: 400; } .bg-grey { display: block; padding: 4%; background-color: #f2f2f2; box-sizing: border-box; } .bg-grey.full { padding: 2%; margin: 70px 0px 5% 0px; } .bg-grey legend { position: absolute; top: -50px; left: 0; margin: 0px; height: 0px; padding: 0px 0px 2% 0px; color: var(--color-blue-dark); } .bg-grey.full legend { padding: 0px 0px 2% 0px; } /*endregion*/ /*region separators*/ .Clear { clear: both !important; width: 0px !important; height: 0px !important; margin: 0px !important; float: none !important; } .ClearLeft { clear: left !important; width: 0px !important; height: 0px !important; margin: 0px !important; float: none !important; } .ClearRight { clear: right !important; width: 0px !important; height: 0px !important; margin: 0px !important; float: none !important; } .Space { display: block; font-size: 3px !important; line-height: 3px !important; height: 3px !important; } .Space5 { display: block; font-size: 5px !important; line-height: 5px !important; height: 5px !important; } .Space10 { display: block; font-size: 10px !important; line-height: 10px !important; height: 10px !important; } .Space15 { display: block; font-size: 15px !important; line-height: 15px !important; height: 15px !important; } .Space20 { display: block; font-size: 20px !important; line-height: 20px !important; height: 20px !important; } .Space30 { display: block; font-size: 30px !important; line-height: 30px !important; height: 30px !important; } .Space40 { display: block; font-size: 40px !important; line-height: 40px !important; height: 40px !important; } .Space75 { display: block; font-size: 75px !important; line-height: 75px !important; height: 75px !important; } /*endregion*/ /*region layout*/ .Grid { display: block; margin-top: 120px; } dl, dd, dt { font-size: 16px; line-height: 22px; } dl { display: flex; width: 100%; flex-direction: row; align-content: flex-start; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; margin: 0px; } dt, dd { display: inline-block; width: 60%; margin: 0px; padding: 2px 0px; } dt { font-weight: bold; width: 30%; margin-right: 5%; } .Overlay dd { width: 70%; } .Overlay dt { width: 20%; } dd:after { content: ""; display: block; width: 100%; height: 0px; line-height: 0px; margin: 0; padding: 0; overflow: hidden; } label .Color { display: inline-block; position: relative; top: 4px; width: 16px; height: 16px; margin: 0px 5px 0px 0px; } .ListSort .Color { display: inline-block; float: left; width: 20px; height: 16px; margin: 2px 5px 0px 0px; } /*endregion*/ /*region box*/ .boxes { display: flex; flex-direction: row; flex-wrap: wrap; align-content: stretch; justify-content: center; align-items: stretch; width: 100%; margin: 1% 0; padding: 0px; box-sizing: border-box; } .boxes .box { display: inline-block; position: relative; width: 30.33%; margin: 0.5%; padding: 0; overflow: hidden; box-sizing: border-box; text-align: center; } .boxes.two .box { width: 37%; } .boxes.two .box.video { margin: 4%; } .boxes.four { display: block; } .boxes.four .box { width: 21%; float: left; margin: 0 5.33% 2% 0; } .boxes.four .box:nth-child(4n + 0) { margin-right: 0; } .boxes.four.position-1 .box { width: 20%; margin: 0; } .boxes.four .box .box_icon { aspect-ratio: 4 / 3; display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: space-between; align-items: flex-end; margin-bottom: 4%; } .boxes.four.position-2 .box .box_icon img { max-width: 100%; max-height: 80%; width: auto; } .boxes.four.position-2 .box .box_icon { aspect-ratio: 6 / 3; } .boxes .box a, .boxes .box .introimage { display: block; z-index: 10; top: 0px; left: 0px; right: 0px; bottom: 0px; width: auto; height: auto; box-sizing: border-box; } .boxes .box .box_icon { position: relative; z-index: 10; } .boxes .box.video .Title { position: absolute; z-index: 20; display: inline-block; text-align: center; top: unset; bottom: 5%; left: 50%; min-width: 75%; width: auto; height: auto; padding: 2% 5%; font-size: 26px; line-height: 120%; background-color: rgba(255, 255, 255, 0.8); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); } .boxes .box.video:before { content: ""; position: absolute; z-index: 100; display: inline-block; top: 33%; left: 50%; width: 80px; height: 80px; margin: -40px 0 0 -40px; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/play_blue_dark.svg) no-repeat center; pointer-events: none; } @media (hover: hover) and (pointer: fine) { .boxes .box.video:hover:before, .boxes .box.video:hover .Title { opacity: 0.5; cursor: pointer; } } .boxes .box .box_icon img { max-width: 100%; max-height: 300px; } .boxes .box .background { position: relative; background-color: var(--color-light); } .boxes .box .background::before { content: ""; display: block; padding-top: 100%; } .boxes.two .box .background::before { padding-top: 50%; } .boxes .box .background:hover { background-color: var(--color-blue-dark); } .boxes .box .background:hover .Title, .boxes .box .background:hover .Textnormal { color: #ffffff; } .boxes .box .background .box_icon { position: absolute; top: 50%; left: 50%; width: 40%; max-height: 100%; -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .boxes .box .background .box_icon img { width: 100%; } .boxes .box a:hover { opacity: 1; text-decoration: none; } .boxes .box .Title { position: relative; display: block; z-index: 1000; top: 0px; left: 0px; width: 100%; margin: 0px; padding: 10px 0 5px 0; box-sizing: border-box; font-size: 20px; line-height: 26px; font-weight: 500; color: var(--color-blue-dark); } .boxes .box .Subtitle { font-size: 16px; line-height: 22px; } .boxes .box.blue { background-color: var(--color-blue-dark); color: #FFFFFF !important; } .boxes .box.yellow { background-color: #ffed00; color: var(--color-dark) !important; } .boxes .box.yellow .Title { color: var(--color-dark); } .boxes .box.yellow .Title:before { background-color: var(--color-dark); } .boxes .box .Textnormal { display: block; margin: 4% 0px 0px 0px; box-sizing: border-box; font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; text-align: left; text-transform: none; font-size: 14px; line-height: 20px; letter-spacing: 0px; font-weight: 400; } .boxes .box a.link { color: var(--color-theme-red); font-size: 14px; line-height: 20px; } .boxes .box a.link::after { content: '->'; margin-left: 2px; } .boxes.two .box .content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; padding: 4% 4% 4% 4%; align-items: start; } .boxes.two .box .content .box_icon { position: relative; top: unset; left: unset; width: 20%; max-height: none; box-sizing: border-box; padding: 4% 4% 4% 4%; -o-transform: none; -ms-transform: none; -moz-transform: none; -webkit-transform: none; transform: none; } /* disabled from dashboard article.shorttext + .boxes { margin-top: -3%; }*/ .boxes + article.shorttext, .downloads + article.shorttext, article.shorttext + article.shorttext { margin-top: 5%; } /*endregion*/ /*region product*/ .boxes .box.trailer { width: 23%; margin: 1% 1% 3% 1%; text-align: center; overflow: visible; } .box.trailer .image { display: block; position: relative; z-index: 100; width: 100%; height: auto; max-width: 100%; margin: 0px auto; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .box.trailer .symbol { display: block; position: absolute; z-index: 200; top: 30px; right: 35px; width: 5%; height: 0px; margin: 0px; padding: 0px 0px 5% 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .box.trailer .title-inline { display: inline-block; max-width: 100%; overflow: hidden; font-size: 23px; line-height: 28px; text-overflow: ellipsis; text-transform: uppercase; color: var(--color-blue-dark); } .box.trailer .content { display: block; opacity: 0; box-sizing: border-box; position: absolute; z-index: 300; width: 100%; height: 0; overflow: hidden; left: 0px; right: 0px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); margin: 0px auto; padding: 0px 25px; background-color: var(--color-blue-dark); } .box.trailer:hover .content { opacity: 1; height: auto; min-height: 100%; overflow: visible; padding: 20px 25px; } .box.trailer .content, .box.trailer .content * { font-size: 13px; line-height: 20px; font-weight: normal; font-style: normal; text-decoration: none; color: #ffffff; text-align: left; } .box.trailer .content h2 { display: block; position: relative; z-index: 100; width: auto; margin: 0px auto 10px auto; padding: 0px 0px; font-size: 23px; line-height: 28px; font-weight: normal; font-style: normal; text-decoration: none; text-align: left; text-transform: uppercase; color: #ffffff; } .box.trailer .note { display: block; font-weight: 600; margin: 5px 0 0 0; } .box.trailer .infos { display: block; margin: 5px 0 0 0; } .box.trailer .addon { display: block; margin: 5px 0 0 0; } .box.trailer .content .Button { display: block; margin: 10px auto 0 auto; padding: 5px 10px; background: #ffffff; font-style: normal; font-size: 14px; line-height: 18px; font-weight: 700; letter-spacing: 0; text-align: center; text-transform: initial; color: var(--color-blue-dark) !important; border: 2px solid #ffffff; } .box.trailer .content .Button:hover { color: #ffffff !important; background-color: var(--color-blue-dark); opacity: 1; text-decoration: none; } /*endregion*/ /*region stations*/ .formSearch { width: 45%; float: right; padding: 0 0 0 2%; box-sizing: border-box; } .SelectTrailers { padding: 0px 0px 0px 10px; } .SelectTrailers, .SelectTrailers * { line-height: 30px; } .SelectTrailers .tooltip-container { width: 50%; } .SelectTrailers input[type="checkbox"] + label, .SelectTrailers input[type="radio"] + label { display: inline-block; min-width: 50px; min-height: 22px; margin: 0px; padding: 0px 20px 0px 25px; } .Country { display: inline-block; margin: 0px 15px 0px 0px; font-size: 16px; color: var(--color-font); line-height: 22px; } .Country input[type='radio'] { opacity: 0.5; } .Country input[type='radio'] + label { display: inline-block; min-height: auto; padding: 0; font-size: 20px; line-height: 24px; font-weight: 300; opacity: 0.5; } .Country input[type='radio']:checked + label::before, .Country input[type='radio']:not(:checked) + label::before { content: ""; display: inline-block; width: 30px; height: 20px; margin: 0px 8px -1px 0px; background-size: 30px; background-position: left center; background-repeat: no-repeat; border: none; border-radius: 0; box-shadow: none; background-color: transparent; } .Country.de input[type='radio']:checked + label:before , .Country.de input[type='radio']:not(:checked) + label:before { background-image: url(https://test.trailer2go.de/assets/css/../images/flags/germany.svg); } .Country.ch input[type='radio']:checked + label:before , .Country.ch input[type='radio']:not(:checked) + label:before { background-image: url(https://test.trailer2go.de/assets/css/../images/flags/swiss.svg); } .Country.at input[type='radio']:checked + label:before , .Country.at input[type='radio']:not(:checked) + label:before { background-image: url(https://test.trailer2go.de/assets/css/../images/flags/austria.svg); } .Country input[type='radio']:checked { opacity: 1; } .Country input[type='radio']:checked + label { font-style: italic; opacity: 1; } .StationIcon { display: inline-block; float: right; width: 40px; height: 40px; margin: -5px 0px 0px 5px; background: transparent url(https://test.trailer2go.de/assets/css/../images/blank.gif) no-repeat center; background-image: url("https://test.trailer2go.de/assets/css/../images/blank.gif"); background-size: contain; } .StationIcon.Servicepartner { width: 50px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/icon_servicepoint.png); background-size: contain; } .StationIcon.Booking247partner { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/24-7_blue_dark.svg); background-size: contain; } .SelectTrailers .StationIcon.Booking247partner { width: 30px; } label .StationIcon.Servicepartner, label .StationIcon.Booking247partner { margin: -10px 0px 0px 15px; } .SelectRadius table { float: left; } .SpaceHorz { display: inline-block; white-space: nowrap; width: 30px; padding: 0px; } .StationsList, .TrailersList { display: flex; margin: 40px 0px; flex-direction: row; flex-wrap: wrap; align-content: flex-start; justify-content: flex-start; align-items: flex-start; columns: 2; column-gap: 4%; } .StationsList { columns: 3; } .StationsList .Station, .TrailersList .Trailer { display: flex; justify-content: space-between; align-items: stretch; width: 31%; margin: 0; padding: 2% 0 2% 0; border-bottom: 1px solid #dedede; font-weight: normal; font-style: normal; font-size: 16px; text-decoration: none; color: var(--color-font); line-height: 22px; } .StationsList .Station { display: block; width: 30.66%; justify-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: wrap; align-content: flex-start; } .Station h3, .TrailersList .Trailer h3 { display: block; width: 100%; margin: 0px 0px 5px 0px; font-size: 22px; line-height: 120%; font-weight: 400; text-transform: uppercase; font-style: normal; text-decoration: none; color: var(--color-blue-dark); } .Station .Address, .TrailersList .Trailer .Address { display: block; width: 100%; margin: 0px 0px 0px 0px; font-size: 16px; line-height: 22px; font-weight: 300; text-transform: uppercase; text-decoration: none; color: var(--color-font); } .Station .more, .TrailersList .Trailer .more { display: block; margin: 4px 0px; font-size: 16px; line-height: 22px; font-weight: 700; text-transform: uppercase; text-decoration: none; color: #1e405a; text-align: left; } .Station .more:before, .TrailersList .Trailer .more:before { content: "> "; } .Station .more.inline-left, .Station .more.inline-right { display: inline-block; margin-right: 20px; } .Station .more.inline-right { } #map-container { width: 55%; float: left; padding: 0 2% 0 0; box-sizing: border-box; } .formSearch { width: 45%; float: right; padding: 0 0 0 2%; box-sizing: border-box; } .search-container { display: inline-block; max-width: 100%; box-sizing: border-box; position: relative; } #acLocation { padding-right: 35px; } .ui-widget.ui-menu { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .ui-widget.ui-widget-content { border: 1px solid #d3d3d3; } .ui-widget-content { border: 1px solid #aaaaaa; background: #ffffff; color: #222222; } .ui-widget.ui-menu .ui-menu-item { margin: 0; border: 1px solid transparent; font-style: normal; font-weight: normal; font-size: 18px; line-height: 26px; text-decoration: none; color: var(--color-font); } .ui-menu .ui-menu-item-wrapper { position: relative; padding: 3px 1em 3px 0.4em; font-size: 18px; line-height: 26px; color: var(--color-font); } .Paging { position: relative; text-align: center; list-style: none; margin-left: 0 !important; margin-right: 0 !important; } .Paging > li { display: inline-block; padding: 0px 2px; height: 30px; width: 30px; line-height: 30px; font-size: 16px; font-weight: 700; text-align: center; margin-left: -1px; border: 1px solid #999999; } .Paging .Current { background-color: #f0f0f0; color: var(--color-blue-dark); border: 1px solid #999999; } .Paging a { display: block; width: 30px; height: 30px; margin: 0px; padding: 0px 0px 0px 0px; text-align: center; font-size: 16px; line-height: 30px; font-weight: 700; text-align: center; color: var(--color-font); } .Paging .Previous { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .Paging .Next { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } #map { height: 550px; width: 100%; position: relative; } @media only screen and (max-width: 500px) { #map { height: 300px; } } .mapboxgl-popup { width: 250px; } .mapboxgl-popup-close-button { width: 30px; height: 30px; font-size: 30px; line-height: 20px; } .mapboxgl-popup-content { border-radius: 8px !important; padding: 10px 25px 10px 15px !important; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } .event-details-content { max-height: 300px; } .event-details-content .StationIcon { width: 50px; height: 30px; margin: 0px 0px 0px 10px; } .event-details-content .event-details-title { font-size: 16px; line-height: 22px; color: var(--color-blue-dark); margin: 0 0 10px 0; } .event-details-content .event-details-address { color: var(--color-font); font-size: 14px; } .event-details-content .event-details-link { margin: 10px 0 0 0; } .event-details-link .more { display: block; padding: 0px; font-size: 14px; line-height: 18px; } .event-details-link .more + .more { margin: 5px 0 0 0; } .event-details-link .more:focus { outline: none; } .event-details-link .more::before { content: "> "; } /*endregion*/ /*region trailers*/ .TrailersList .Trailer { width: 48%; } /* .TrailersList .Trailer + .Trailer { border-top: 1px solid #999999; }*/ .TrailersList .Trailer .image { border: none; width: 30%; padding: 0 0 16.5% 0; margin: 0px 3% 0px 0px; } .TrailersList .Trailer .info { width: 50%; } .TrailersList .Trailer .data { width: 35%; } .TrailersList .Trailer .property { display: inline-block; margin: 3px 10px 3px 0; padding: 3px 6px; font-size: 14px; line-height: 18px; color: var(--color-font); border: 1px solid var(--color-font); } .TrailersList .Trailer .new { display: inline-block; margin: -5px 10px 10px 10px; padding: 5px; font-size: 16px; line-height: 16px; background-color: var(--color-blue-dark); color: #ffffff; float: right; } .TrailersList .Trailer .price { width: 20%; font-size: 22px; line-height: 26px; font-weight: bold; color: var(--color-blue-dark); text-align: right; } .TrailersList .Trailer .price .currency { font-size: 20px; line-height: 28px; font-weight: inherit; color: var(--color-font); } .price .tax { font-size: 14px; line-height: 22px; font-weight: 300; color: var(--color-font); } .Trailer .image { display: block; width: 40%; height: 0px; padding: 0px 0px 30% 0px; margin: 0 10px 0 0; border: 1px solid var(--color-blue-light); background-color: #ffffff; background-repeat: no-repeat; background-size: contain; background-position: center center; } /*endregion*/ /*region layout*/ .titleimage { position: relative; margin: 0px 0px 0px 0px; background-repeat: no-repeat; background-size: cover; background-position: center center; } .titleimage span { position: absolute; bottom: 14%; left: 50%; width: 84%; height: 100%; -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); } .titleimage span .content { position: absolute; bottom: 0; } .titleimage h1, .titleimage h2, .titleimage h3 { display: block; box-sizing: border-box; margin-bottom: 20px; color: #ffffff; font-size: 80px; font-weight: 700; line-height: 80px; text-transform: uppercase; } .titleimage h3 { display: block; box-sizing: border-box; margin: 0; font-size: 32px; font-weight: 500; line-height: 35px; text-transform: none; } .portal .introimage { display: block; position: relative; margin: -8.2% -5% 5% -5%; height: 0; padding: 0px 0px 45% 0px; overflow: hidden; } .portal .introimage img { max-width: 100%; width: 100%; height: auto; transform: translate(-50%, -50%); top: 50%; position: absolute; left: 50%; } .portal .Duty { color: #000000; } .portal .flyout { position: fixed; z-index: 9999; left: 100%; width: fit-content; margin-top: 50px; margin-left: 0px; box-sizing: border-box; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .Minimized .portal .flyout { margin-left: 40px; } .portal .flyout a { display: block; position: relative; font-style: normal; font-weight: 300; font-size: 18px; line-height: 30px; color: var(--color-font); text-decoration: none; text-transform: uppercase; padding: 5px 10px 5px 40px; margin: 3px 0 3px -40px; background-color: #FFFFFF; overflow: visible; white-space: nowrap; box-sizing: border-box; } .portal .flyout a:hover { margin-left: -100%; } .portal .flyout a:before { content: ""; display: inline-block; position: absolute; left: 5px; top: 5px; width: 30px; height: 30px; margin: 0px; cursor: pointer; background-position: center; background-repeat: no-repeat; background-size: contain; } .portal .flyout a.stations:before { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/locations_blue_dark.svg"); } .portal .flyout a.stations247:before { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/24-7_blue_dark.svg"); } .portal .flyout a.registration:before { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/registration_blue_dark.svg"); } .portal .flyout a.idea:before { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/idea_blue_dark.svg"); } .portal .flyout a.faq:before { background-image: url("https://test.trailer2go.de/assets/css/../images/icons/info_blue_dark.svg"); } /*endregion*/ /*region formular*/ .formular { width: 100%; margin: 0 auto; } fieldset { position: relative; border: none; box-shadow: none; padding: 0px 20px 20px 0px; } fieldset .col-25 { width: 24% !important; } fieldset .col-33 { width: 32% !important; } fieldset .col-50 { width: 49% !important; } fieldset .flex-row + .flex-row { margin: 10px 0 0 0; } .Column50Left fieldset, .Column50Right fieldset { padding: 0px 0px 20px 0px; } ::placeholder { color: #9c9c9c; opacity: 1; } input, textarea, select { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; } input[type='text'], input[type='date'], input[type='time'], input[type='email'], input[type='password'], input[type='textarea'], .Field, textarea, .Fieldtextarea { position: relative; width: 100%; padding: 5px 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #dedede; border-radius: 0; background-color: #ffffff; text-align: left; font-size: 16px; line-height: 22px; font-weight: normal; text-decoration: none; color: var(--color-font); } input[type='date'], input[type='time'] { cursor: pointer; -webkit-appearance: revert; -moz-appearance: revert; appearance: auto; } input[type='date']::-webkit-calendar-picker-indicator, input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(0.5) sepia(1) saturate(5) hue-rotate(175deg); background-position: right center; background-size: 20px auto; cursor: pointer; position: absolute; bottom: 0; left: 0; right: 0; top: 0; width: auto; height: auto; } input[type=time]::-webkit-datetime-edit-fields-wrapper { display: flex; } textarea:focus, input:focus { outline: none; } .Select, .SelectSmall, .SelectCheckboxes { border-color: #dedede; font-size: 16px; line-height: 22px; font-weight: normal; } .Select option { font-size: 16px; line-height: 22px; font-weight: normal; text-decoration: none; color: var(--color-font); } .Highlighted { border-color: var(--color-theme-dark) !important; } .FieldFileText { padding: 5px 6px !important; } input[type='submit'], input[type='reset'], .Button.Blue, .modal .Button { display: inline-block; } .modal .Button { margin: 0px 10px !important; } input[type='reset'] { background-color: var(--color-blue-light); color: #ffffff; } input[type='submit']:hover, .Button:hover { opacity: 0.5; } input[type='reset']:hover { opacity: 0.7; } input[type='submit']:disabled, input[type='button']:disabled, input[type='reset']:disabled { opacity: 0.5; } /*input[type='checkbox']:not(:checked) + label::before, input[type='radio']:not(:checked) + label::before { background-color: #00a9eb; }*/ input[type='checkbox'].error:not(:checked)+label::before, input[type='radio'].error:not(:checked)+label::before { border: 1px solid red; } select:disabled { color: var(--color-font); opacity: 0.6 !important; } span.error { display: block !important; margin: 5px 5px 5px 5px; color: red; max-width: 100%; box-sizing: border-box; font-size: 16px; line-height: 24px; } dt span.error { text-transform: none; } label span.error { display: block !important; margin: 0px 0px; } input.Field.error { outline: 1px solid red; outline-offset: -1px; } .floating-label { position: relative; } .floating-label > .Field, .floating-label > .Fieldtextarea, .floating-label > .Select, .floating-label .FieldFilterInput, .floating-label .FieldFileText { height: calc(3.7rem + 2px); padding: 1rem 20px; line-height: 1.25; } .floating-label .FieldFilterList, .floating-label .FieldFileText { top: calc(3.7rem + 2px) !important; width: 100% !important; } .floating-label > .Field::placeholder, .floating-label > .Fieldtextarea::placeholder, .floating-label > .Select::placeholder, .floating-label .FieldFilterInput::placeholder, .floating-label .FieldFileText::placeholder { color: transparent; } .floating-label > .Field:focus, .floating-label > .Fieldtextarea:focus, .floating-label .FieldFilterInput:focus, .floating-label .FieldFileText:focus, .floating-label > .Field:not(:placeholder-shown), .floating-label > .Fieldtextarea:not(:placeholder-shown), .floating-label .FieldFilterInput:not(:placeholder-shown) .floating-label .FieldFileText:not(:placeholder-shown), .floating-label > .Select { padding-top: 1.625rem; padding-bottom: 0.625rem; opacity: 1; } .floating-label .FieldFilterInput, .floating-label .FieldFileText, .floating-label .FieldFilterInput:focus, .floating-label .FieldFileText:focus, .floating-label .FieldFilterInput:not(:placeholder-shown), .floating-label .FieldFileText:not(:placeholder-shown) { padding-top: 1.125rem; padding-bottom: 1.125rem; } .floating-label > label { position: absolute; top: 0; left: 0; display: flex; align-items: center; height: 100%; box-sizing: border-box; padding: 0.6rem 20px; pointer-events: none; border: 1px solid transparent; opacity: 0.6; font-size: 16px; line-height: 22px; transform-origin: 0 0; transition: opacity .1s ease-in-out, transform .1s ease-in-out; } .floating-label > .Fieldtextarea + label { align-items: start; } .floating-label > .FieldFilterContainer + label { z-index: 9999; } .floating-label > .Field:focus~label, .floating-label > .Fieldtextarea:focus~label, .floating-label .FieldFilterInput:focus~label, .floating-label > .Field:not(:placeholder-shown)~label, .floating-label > .Fieldtextarea:not(:placeholder-shown)~label, .floating-label .FieldFilterInput:not(:placeholder-shown)~label, .floating-label > .FieldFilterContainer.focus + label, .floating-label > .Select~label { padding: 1rem 22px; font-size: 1rem; line-height: 1.5; font-weight: 400; opacity: .65; transform: scale(.85) translateY(-0.5rem) translateX(0.15rem); } .range_container { display: flex; flex-direction: column; width: 100%; margin: 35% auto; } .sliders_control { position: relative; display: flex; align-items: center; margin-bottom: 50px; } .form_control { position: relative; display: flex; justify-content: space-between; font-size: 24px; color: #635a5a; } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: all; width: 11px; height: 11px; background-color: var(--color-blue-dark); border-radius: 50%; cursor: pointer; } input[type=range]::-moz-range-thumb { -webkit-appearance: none; pointer-events: all; width: 11px; height: 11px; background-color: var(--color-blue-dark); border-radius: 50%; cursor: pointer; } input[type=range]::-webkit-slider-thumb:hover { background: #f7f7f7; } input[type=range]::-webkit-slider-thumb:active { box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe; -webkit-box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { opacity: 1; } input[type="range"] { position: absolute; -webkit-appearance: none; appearance: none; width: 100%; height: 3px; background-color: #ffffff; pointer-events: none; } .fromSlider { height: 0 !important; z-index: 1; } .slide_container { width: 96%; margin: 35% auto; } .ui-slider { height: 3px; background: #ffffff; } .ui-slider .ui-slider-handle { width: 15px; height: 15px; border-radius: 50%; } .ui-slider-horizontal .ui-slider-handle { top: -6px; } .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { background-color: var(--color-blue-dark); } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { background-color: #ededed; } .slide_control { position: relative; display: flex; justify-content: space-between; margin-top: 50px; font-size: 24px; line-height: 24px; } form.contact .flex-row + .flex-row { margin-top: 5px; } form.formular, form.contact, form.registration { max-width: 1100px; margin: 0 auto; } form.formular .Field, form.formular .Fieldtextarea, form.formular .Select, form.formular #booking .bg-grey, form.contact .Field, form.contact .Fieldtextarea, form.contact .Select { max-width: 400px; } .registration #registration_types { justify-content: space-evenly; margin: 2% 0 4% 0; } .registration #registration_types .button .Button { display: block; width: fit-content; min-width: 200px; margin: 0 auto; padding: 5px 15px; -o-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -webkit-transform: rotate(-8deg); transform: rotate(-8deg); background-color: var(--color-blue-dark); font-size: 30px; line-height: 30px; text-transform: uppercase; color: #ffffff; } .registration #registration_types .button .Button:first-child { background-color: var(--color-blue-light); } .registration #registration_types .button:hover { opacity: 0.5; cursor: pointer; text-decoration: none; } .registration #registration_types .button .Button:hover { opacity: 1; } .registration #registration_types .button .Button + .Button { margin-top: 5px; } .registration #registration_types .button.Active .Button, .registration #registration_types .button:hover .Button { background-color: #3C545C; } .registration #registration_types .button.Active .Button:first-child, .registration #registration_types .button:hover .Button:first-child { background-color: #72848B; } .registration .button input[type="radio"] + label.Button::before { visibility: hidden; display: block; width: 0; height: 0; border: none; } .registration .button input[type="radio"]:checked + label.Button { opacity: 0.5; } .registration .Field, .registration .Select, .registration #booking .bg-grey, .registration .description { max-width: 400px; } .registration .description { margin-bottom: 15px; } .registration #openingHours .weekday, .registration .trailers .trailer, .formular .trailers .trailer { box-sizing: border-box; max-width: 400px; padding: 0; } .registration #openingHours .weekday { border: 1px solid #dedede; padding: 4%; } .registration #openingHours .weekday + .weekday { margin-top: 10px; } .registration #openingHours .time + .time { margin-top: 4%; } .registration .trailers .container, .formular .trailers .container { box-sizing: border-box; max-width: 400px; border: 1px solid #dedede; padding: 4%; } /*endregion*/ /*region Frontend*/ .Frontend .CheckboxList { padding: 0px 2%; } .Frontend .Intended table { display: table; border: none; border-collapse: collapse; padding: 0px; width: auto; margin: 0px 2%; } .Frontend .Filter li.Label { font-weight: normal; font-size: 16px; } .Frontend .Filter .Select, .Frontend .Filter .SelectCheckboxes { max-width: 175px; font-weight: normal; font-size: 16px; } .Frontend .row .col-25 label { padding: 10px 6px 10px 0; display: inline-block; } .Frontend .ButtonCalendar { margin: 17px 5px 17px 10px; } .Frontend table { } .Frontend table td, .Frontend table th { font-family: "Roboto Condensed", Arial, Helvetica, Geneva, Tahoma, Verdana, sans-serif; font-weight: normal; font-style: normal; font-size: 15px; text-decoration: none; line-height: 24px; padding: 0px; border: none; } .Frontend table td { vertical-align: inherit; } .Frontend table th { font-weight: 500; background-color: transparent; padding: 2px 10px; } .Frontend .ListHeader { font-size: 15px; color: #073370; height: auto; background: none; } .Frontend .ListHeader td, .Frontend .ListHeader th { vertical-align: middle; } .Frontend .Textleft { text-align: left; } .Frontend .Textcenter { text-align: center; } .Frontend .Textright { text-align: right; } .Frontend .ListSort.Textleft { font-weight: 500; } .Frontend .LineSolid { background-color: #073370 !important; } .Frontend table td.Error { padding: 25px 25px; border-left: 10px #B4140A solid; } .Frontend .ListBody.Odd { background-color: #ececec !important; } .Frontend .TextsmallRed { font-size: 13px; text-decoration: none; color: #cc1638; line-height: 18px; } .Frontend .RegisterTabs .Register { width: 49.5%; box-sizing: border-box; font-size: 18px; padding: 10px 20px 10px 20px; background-color: transparent; color: #000000; opacity: 1; } .Frontend .RegisterTabs .Register.Active, .Frontend .RegisterTabs .Register:hover { background-color: var(--color-dark); color: #ffffff; } .Frontend .RegisterTabs .Register:nth-child(even) { margin: 0 0 0 0; } .Frontend .Field.Calendar { width: calc(100% - 30px); border-right: none; } .Frontend .ButtonCalendar.Calendar { background-color: #ffffff; width: 30px; height: 32px; padding: 0px 15px 0px 14px; margin: 0; box-shadow: none; border: 1px solid #c7c7c7; border-left: none; } /*endregion*/ /*region content layout*/ .Mobile { display: none !important; } ul.List h1, ul.List h2, ul.List h3, ul.List h4, ul.List a, ul.List p, ul.List ul, ul.List ol, ul.List div, ul.List dd, ul.List dt, ul.List span, ul.List font, ul.List textarea, ul.List label { font-size: 14px; line-height: 20px; } /*endregion*/ /*region buttons*/ .Button { font-family: "Roboto Condensed", sans-serif; display: inline-block; margin: 0px 10px 0px 0px; padding: 10px 30px; font-style: normal; font-size: 18px; line-height: 22px; font-weight: 400; text-decoration: none; border-radius: 0px !important; color: #ffffff !important; border: none; background-color: var(--color-blue-dark); background-image: none; cursor: pointer; box-shadow: none; } .Button.light { margin: 5px auto 0 auto; padding: 5px 10px; background: #ffffff; font-style: normal; font-size: 14px; letter-spacing: 0; text-align: center; line-height: 18px; text-transform: initial; color: var(--color-blue-dark); border: 2px solid #ffffff; } .Button.light:hover { color: #ffffff; background-color: var(--color-blue-dark); } .Button.Small { font-size: 11px; padding: 3px 10px; min-width: 0; } .Button.Edit { margin-top: 10px; padding: 3px 10px 3px 30px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/edit_blue.svg); background-position: 5px 50%; background-repeat: no-repeat; } .Button.Copy { background-color: var(--color-dark); border-bottom: 2px solid var(--color-theme-red); } .Button.Back, .Button.Next { background-color: var(--color-blue-light); } .Button.Back::before, .Button.Next::after { content: ''; display: inline-block; vertical-align: middle; width: 25px; height: 20px; background-repeat: no-repeat; background-size: cover; background-position: center center; } .Button.Back { padding-left: 20px; } .Button.Back::before { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/arrow_left_white.svg'); margin-right: 5px; } .Button.Next::after { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/arrow_right_white.svg'); margin-left: 5px; } .Button.More { margin-top: 10px; padding: 3px 10px 3px 30px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/info_blue.svg); background-position: 5px 50%; background-repeat: no-repeat; } .Button.Search { display: inline-block; padding: 0px 5px; height: 24px; width: 24px; cursor: pointer; text-align: center; vertical-align: middle; border: none; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/search_blue.svg) no-repeat center; text-indent: -99999px; overflow: hidden; } .Button.disabled { opacity: 0.5; cursor: not-allowed; } .Button:hover { text-decoration: none; color: #ffffff; } a.Button.Search::before { content: ''; display: inline-block; vertical-align: bottom; width: 25px; height: 25px; margin-right: 5px; background-image: url('https://test.trailer2go.de/assets/css/../images/icons/search_white.svg'); background-repeat: no-repeat; background-size: cover; background-position: center center; } .Button.Previous { float: left; } .Button.Previous:before { content: " "; float: left; display: inline-block; height: 20px; width: 20px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pull_left_blue.svg); background-repeat: no-repeat; background-size: contain; background-position: center; margin: 0px 5px 0px -5px; padding: 0px; } .Button.Next { float: right; } .Button.Grey { background-color: var(--color-theme-black-50); } .button-container .Button { margin: 5px 0 5px 0; } .Button.Loading { position: relative; width: auto; height: auto; top: unset; left: unset; background-position: 15px center; background-size: 20px; background-image: url(https://test.trailer2go.de/assets/css/../images/loading.svg); padding: 10px 30px 10px 45px; } /*.Button.Next:after { content: " "; float: right; display: inline-block; height: 20px; width: 20px; background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pull_right_blue.svg); background-repeat: no-repeat; background-size: contain; background-position: center; margin: 0px -5px 0px 5px; padding: 0px; } .Button.Next.Blue:after { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/pull_right_white.svg); }*/ /*endregion*/ /*region toggle*/ .toggle, .Container h2.toggle { font-family: 'Roboto Condensed', sans-serif; display: block; position: relative; font-size: 16px; font-weight: 500; text-decoration: none; color: #ffffff; background-color: var(--color-blue-dark); line-height: 22px; padding: 15px 25px 15px 70px; margin: 10px auto 0 auto; text-align: left; width: 98%; max-width: 1200px; box-sizing: border-box; } .Container h2.toggle:hover { opacity: 0.7; } .toggle span.expander { display: block; position: absolute; top: 50%; left: 20px; width: 30px; height: 30px; margin: -14px 0px 0px 0px; opacity: 1; cursor: pointer; background: transparent url('https://test.trailer2go.de/assets/css/../images/icons/arrow_down.svg') no-repeat center; background-size: auto; background-size: 20px auto; } .toggle.toggle-expanded, .toggle.toggle-collapsed:hover { background-color: var(--color-blue-light); } .toggle.toggle-expanded span { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .toggle-content { display: none; box-sizing: border-box; width: auto; height: auto; margin: 1px auto 1px auto; padding: 0 15px; text-align: left; background-color: #ffffff; max-width: 1200px; } .toggle-content.toggle-visible { display: block; overflow: hidden; height: auto; opacity: 1; padding: 30px; } .toggle-content.toggle-hidden { overflow: hidden; height: 0px; opacity: 0; padding: 0; } /*endregion*/ /*region icons*/ .icon { display: inline-block !important; position: relative; box-sizing: border-box; float: right !important; padding: 0px !important; width: 30px !important; height: 30px !important; margin: 0px 0px 0px 5px; background-position: center; background-size: contain; background-repeat: no-repeat; } .icon.remove { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/remove_blue.svg); width: 30px !important; height: 24px !important; margin: 0px 0px 0px 0px; float: none !important; } .icon.remove:hover { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/remove_grey.svg); } .icon.mail { background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/mail_blue.svg) no-repeat center; background-size: contain; } .icon.document { background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/document_blue.svg) no-repeat center; background-size: contain; width: 25px !important; } /*endregion*/ /*region Modal*/ .modal { display: block; box-sizing: border-box; margin: 0 auto; min-width: 50%; max-width: 600px; text-align: center; padding: 0; } .modal .logo { width: 250px; height: 100px; display: block; margin: 0px auto 50px auto; padding: 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/logo.svg) no-repeat center; background-size: contain; box-sizing: border-box; } .modal .logo:hover { text-decoration: none; } .modal .logo img { width: 100%; height: auto; } .modal .title { text-transform: uppercase; font: normal normal 500 16px/24px Roboto Condensed; letter-spacing: 1.5px; color: var(--color-dark); display: block; box-sizing: border-box; padding: 0; margin: 0; text-align: center; text-decoration: none; } .modal .title:after { content: ' '; width: 40px; height: 40px; display: inline-block; margin: -15px 0px -15px 0px; background: transparent url(https://test.trailer2go.de/assets/css/../images/icons/check_blue.svg) no-repeat center; background-size: contain; } .modal .actions { text-align: center; } /*endregion*/ /*region layout*/ .actions { display: block; margin: 20px 0px 0px 0px; } .image-preview { display: block; width: 200px; max-width: 100%; height: auto; border: 1px solid #F1F1F1; background-color: #FFFFFF; box-sizing: border-box; } .MatomoOptout { height: 80px; } /*endregion*/ /*region pageing*/ .pageing.Container { display: flex; justify-content: space-between; box-sizing: border-box; max-width: 100%; width: 100%; padding: 0px 10px; } .pageing.Container.flex-center { justify-content: center; } .pageing.Container .flex-item { display: flex; } .pageing .pageing_button { display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; margin: 0 3px 5px; background-color: #ffffff; border-radius: 50%; font-size: 17px; color: var(--color-blue-dark) } .pageing .pageing_button.active, .pageing .pageing_button:hover { background-color: var(--color-blue-light); color: #ffffff; } /*endregion*/ /*region booking queries*/ #FreePeriod { display: none; margin: 3% 0px 0px 0px; } .CouponContainer { display: block; float: left; } .CouponContainer > * { float: left; line-height: 30px; display: inline-block; margin-right: 10px; } #CouponCheck { display: inline-block; width: 30px; height: 30px; margin: 0; padding: 0; border: none; background-color: transparent; background-repeat: no-repeat; background-position: center; background-size: 30px 30px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #CouponCheck.Valid { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/check_valid_blue.svg); } #CouponCheck.Invalid { background-image: url(https://test.trailer2go.de/assets/css/../images/icons/check_failed_blue.svg); } /*endregion*/ /*region dropzone*/ .dropzone { border: 1px solid #dedede; display: flex; flex-direction: row; flex-wrap: wrap; align-content: center; align-items: center; justify-content: center; } .dropzone.single-image { border: 1px solid #dedede; padding: 0px; } .dropzone .dz-message { margin: 0; } /*region dropzone*/ /*region dashboard*/ .site-dashboard-services-downloads .Subtitle { text-align: left; } .site-dashboard-services-downloads .boxes.four.position-1 .Subtitle { text-align: center; } .site-dashboard-services-downloads article.shorttext { text-align: left; max-width: 100%; } .site-dashboard-services-downloads .Frontend .Subtitle + .Textnormal { margin-top: 0px; } /*endregion dashboard*/ /*region media queries, responsive*/ @media(max-width: 1600px) { article.introtext .textcontent .Introtitle { font-size: 32px; line-height: 42px; } .tooltip-content { top: -120px; bottom: unset; left: -13px; margin-left: 0px; } .tooltip-content::before, .tooltip-content::after { left: 7px; bottom: -7px; -webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1); box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); } header .NavigationPos a { background-position: center center; } .Country input[type="radio"] + label { font-size: 18px; line-height: 22px; } header #Navigation li a, header #Navigation li a.Active { font-size: 18px; line-height: 24px; padding: 45px 15px; } header #Navigation li a .icon { margin: -4px 7px 0 0; } } @media(max-width: 1400px) { .home .Country span { display: none; } .home .search .formSearch .info247 { padding: 5px 0px; } .home .search .formSearch .info247 img { height: 30px; } .home .search .formSearch .start-search .toggle, .home .search .formSearch #trailer-placeholder, .home .search .formSearch .start-search .Feld { font-size: 17px; line-height: 21px; } .home .search .formSearch .Button { font-size: 20px; line-height: 24px; } .boxes.two .box { width: 45%; } .boxes.two .box.video { width: 40%; } .boxes .box .Title { font-size: 16px; line-height: 22px; } .boxes .box a.link { font-size: 12px; line-height: 18px; } .boxes .box .box_icon img { max-height: 250px; } .dashboard.list_view #sidebar, .dashboard.list_view .content { padding-left: 2%; padding-right: 2%; } header #Navigation li a, header #Navigation li a.Active { font-size: 16px; line-height: 20px; } header #Navigation li a .icon { margin: -6px 7px 0 0; } } @media(max-width: 1200px) { article.introtext .textcontent .Introtitle { font-size: 26px; line-height: 36px; } .home .boxes .box .title-inline { font-size: 20px; line-height: 24px; } .dashboard .box.small h3 { font-size: 18px; } .dashboard .grid-item .content a.image span { font-size: 16px; line-height: 22px; } .dashboard.list_view #sidebar summary { font-size: 16px; line-height: 22px; } .Container ul.menu img { margin: 0 45px 5px 45px; } aside.sidemenu .headline { font-size: 16px; } .MatomoOptout { height: 100px; } header #NavigationToggle { display: inline-block; left: 300px; background-image: url('https://test.trailer2go.de/assets/css/../images/icons/menu_blue_dark.svg'); background-repeat: no-repeat; } header #NavigationToggle.toggle-expanded { background-image: url('https://test.trailer2go.de/assets/css/../images/icons/cross_menu_blue_dark.svg'); } header #Navigation { position: absolute; float: none; top: 100%; left: -100%; right: initial; max-width: unset; width: auto; height: auto; z-index: 100; margin: 0px 0px 0px 0px; padding: 2% 2% 2% 2%; background: none; background-color: rgba(0, 0, 0, 0); background-color: #ffffff; -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2); box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2); } header #Navigation.toggle-visible { box-sizing: border-box; width: auto; left: 300px; opacity: 1; } header #Navigation ul { display: block; left: 0; width: auto; min-width: initial; margin: 0px; position: relative; text-align: left; } header #Navigation li { position: relative; display: block; float: none; margin: 7px 0px; border-bottom: 1px solid var(--color-light); } header #Navigation li a { margin: 0px 60px 0px 20px; padding: 10px 10px 10px 10px !important; font-size: 24px !important; line-height: 32px !important; } header #Navigation li a .icon { margin: 0 10px 0 0; } header.logged .Mobile, header.logged ul li.login { display: block !important; } } /*endregion*/ /*region openinghours*/ .floating-openinghours { position: relative; } .floating-openinghours .ButtonAdd { float: right; margin: 0 0 0 10px; display: inline-block; font-size: 28px; font-weight: normal; color: #ffffff; width: calc(3.2rem + 2px); height: calc(3.7rem + 2px); text-align: center; padding: 0.4rem 0; line-height: 1.25; opacity: 0.5; cursor: pointer; border: none; background-color: var(--color-blue-light); background-repeat: no-repeat; background-size: auto 60%; background-position: center center; } .floating-openinghours .ButtonAdd:hover { opacity: 1; } .floating-openinghours .floating-label { float: left; margin: 0 0 5px 0; } .floating-openinghours .floating-label:first-of-type { margin-right: 5px; } .floating-openinghours .floating-label:last-of-type { width: 100%; } .fancybox-active { overflow: hidden; } /*endregion*/ /*#endregion assets/css/portal.css*/