/* CLIENT NAME :: STYLES COLLECTION */
/* theme fonts, colors, mixins, body and content styles */
/* CLIENT/PROJECT NAME :: FONTS, COLORS, MIXINS, BODY AND CONTENT STYLES
/* Font Import (local)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
@font-face {
font-family: 'IBM Plex Sans';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Regular.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Regular.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'IBM Plex Sans';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Italic.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Italic.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'IBM Plex Sans';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Bold.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Bold.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Sans/IBMPlexSans-Bold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'IBM Plex Serif';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Regular.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Regular.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'IBM Plex Serif';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Italic.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Italic.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Serif/IBMPlexSerif-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'IBM Plex Mono';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Mono/IBMPlexMono-Regular.woff2') format('woff2'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Mono/IBMPlexMono-Regular.woff') format('woff'), url('/packages/blinkbox_next/themes/blinkbox_next/fonts/IBM_Plex_Mono/IBMPlexMono-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Source Sans Pro';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/Source_Sans_Pro/SourceSansPro-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Source Code Pro';
src: url('/packages/blinkbox_next/themes/blinkbox_next/fonts/Source_Code_Pro/SourceCodePro-Medium.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
/* Design Colors
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* no color */
/* black */
/* white */
/* gelb */
/* orange */
/* cyanblue */
/* hellgrau */
/* mittelgrau */
/* anthrazit */
/* himbeer */
/* violet */
/* Basic Variables
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Media queries breakpoints Variables
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Responsive sizing TEMPLATE or any other breakpoint action
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
.IMAGE-SIZER {
height: 100%; width: 100%; // XS Default (575.98px) no specs required/Standard CSS for all tiers
@media (min-width: @xs-min) and (max-width: @xs-max) {height: 100%; width: 100%;} // SM
@media (min-width: @sm-min) and (max-width: @sm-max) {height: 100%; width: 100%;} // MD
@media (min-width: @md-min) and (max-width: @md-max) {height: 100%; width: 100%;} // LG
@media (min-width: @lg-min) and (max-width: @lg-max) {height: 100%; width: 100%;} // XL
@media (min-width: @xl-min) {height: 100%; width: 100%;} // XXL
@media (max-width: @xs-max) {.responsive-invisibility();} // eg: hides image @XS
} */
/* Mixins
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Body Styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
:root {
font-size: 16px;
}
body {
background: transparent;
}
body .body-page-login {
background-color: transparent;
}
html {
background: none;
}
div.ccm-page {
overflow-x: hidden;
position: relative;
}
/* Content Styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
div.ccm-page {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-weight: 400;
font-size: 18px;
color: magenta;
line-height: 1.428571429;
/* addl page styles */
}
div.ccm-page a {
color: cyan;
text-decoration: none;
}
div.ccm-page a:hover {
color: limegreen;
}
div.ccm-page img {
max-width: 100%;
}
div.ccm-page hr {
margin-top: 10px;
margin-bottom: 15px;
border-top: 1px dotted #ff7300;
}
div.ccm-page main,
div.ccm-page footer {
background-color: transparent;
}
div.ccm-page main div.container:last-child,
div.ccm-page footer div.container:last-child {
padding-bottom: 40px;
}
div.ccm-page div[data-container=block] div.container:last-child {
padding-bottom: 0px;
}
/* Page specific styles SAMPLE
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
div.ccm-page {
main {
// ensure that what you're putting in here is large and in charge
.page-specific-class {
h1 {
.fluid-calculation(font-size, 992px, 1200px, 30px, 36px);
.fluid-calculation(line-height, 992px, 1200px, 40px, 45px);
font-family: 'IBM Plex Serif', serif;
color: @c4;
font-weight: 400;
font-style: normal;
}
p {
.fluid-calculation(font-size, 480px, 1200px, 14px, 16px);
.fluid-calculation(line-height, 480px, 1200px, 16px, 18px);
font-family: 'IBM Plex Serif', serif;
color: @c4;
font-weight: 400;
font-style: normal;
}
min-height: 300px;
}
}
} */
/* namespaced styles */
div.ccm-page {
/* CLIENT/PROJECT NAME :: HEADER & FOOTER STYLES */
/* footer styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* end footer styles */
/* theme styles */
/* CLIENT/PROJECT NAME :: TYPOGRAPHY STYLES */
/* type colors according to design colors
- - - - - - - - - - - - - - - - - - - - - */
/* Headers, Titles, Text etc.
- - - - - - - - - - - - - - - - - - - - - */
/* Standard Schriftart unformatiert */
/* fluid typography
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* animated type gradient
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* typesetting & typography variations
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* CLIENT/PROJECT NAME :: PAGE SECTION STYLES */
/* FLUID page margins / padding
- - - - - - - - - - - - - - - - - - - - - */
/* page with background image, color or pattern
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* page with background video mp4/webm/ogv
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Section header class and #id for image
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*
.bg-show-position {
//background-color: rgba(155, 155, 155, 0.5);
//background-image: url("/index.php/download_file/3/0"); // url to ccm filemanager
//background-image: linear-gradient(rgba(0,0,0,.15), rgba(77, 169, 245, 0.15)), url("../../media/images/blinkbox_background.jpg");
background-position: 80% 0%; // horizontal - vertikal
@media (max-width: @sm-min) {background-position: 100% 50%;}
//@media (min-width: 1200px) {background-position: 50% 85%;}
//background-position: top left;
//background-repeat: no-repeat;
//background-size:cover;
//background-attachment: scroll; // |fixed|local|initial|inherit;
//z-index: -1;
}
.vegas-wrapper {background-position: 20% 0%; // horizontal - vertikal }
body.vegas-container-inner {background-position: 20% 0%; // horizontal - vertikal} */
/* CLIENT/PROJECT NAME :: VARIOUS STYLES */
/* Missing Styles for Top Navigation Bar Hamburger
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Photo Swipe - Lightbox adjustment
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Pixelmeter in Header mit Bootstrap 5 Breakpoints
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* slide navigation lss theme styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Pagelist styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
div.ccm-block-page-list-header {
//.fluid-calculation(font-size, 992px, 1200px, 30px, 36px);
font-family: 'IBM Plex Sans', sans-serif;
color: @c9;
font-weight: 400;
font-style: normal;
}*/
/* Jarallax styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Headernavigation Color Set 1 - other than
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* De Sandro Masonry
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* box styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Horizontal Ruler Styles
- - - - - - - - - - - - - - - - - - - - - */
/* down-button welcome section
implement HTML Block
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Stacking Styles Vertical
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* Responsive Scrollup Styles Unicode: f062
embed html-block:
- - - - - - - - - - - - - - - - - - - - - */
/* Error Styles
- - - - - - - - - - - - - - - - - - - - - */
/* FLUID margins TEMPLATE
- - - - - - - - - - - - - - - - - - - - -
.fluid-margin-breakpoints {
//margin: 0px 0px 5px 0px; // default XS
@media (max-width: 479px) {margin: 0px 0px 0px 0px;} //XXS
@media (min-width: 480px) and (max-width: 767px) {margin: 0px 0px 0px 0px;} // SM
@media (min-width: 768px) and (max-width: 991px) {margin: 0px 0px 0px 0px;} // MD
@media (min-width: 992px) and (max-width: 1199px) {margin: 90px 0px 0px 0px;} // LG
@media (min-width: 1200px) and (max-width: 1439px) {margin: 90px 0px 0px 0px;} //XL
@media (min-width: 1440px) and (max-width: 1599px) {margin: 90px 0px 0px 0px;} //JU
@media (min-width: 1600px) {margin: 90px 0px 0px 0px;} //GI
} */
/* blinkbox utilities */
/* CLIENT/PROJECT NAME :: PRINT/HIDE STYLES */
/* responsive hiding styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* print styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/
/* CLIENT/PROJECT NAME :: Column Flow Styles */
/* XXS-1, XS-1, SM-2, MD-2, LG-2, XL-3
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* XXS-1, XS-2, SM-3, MD-3, LG-3, XL-4
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* XXS-1, XS-2, SM-3, MD-4, LG-4, XL-5
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* CLIENT/PROJECT NAME :: BUTTON STYLES */
/* BS Button styles
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
.btn {
//display: inline-block;
border-radius: 50%;
padding: 5px 12px;
margin: 30px 30px 0px 0px;
//margin-right: 30px;
font-size: 28px;
font-weight: 400;
//line-height: 1.42857143;
line-height: 1;
text-align: center;
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;
//border: 1px solid transparent;
//border-radius: 4px;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
.btn:hover,
.btn:focus,
.btn.focus {
color: #333;
text-decoration: none;
}
.btn:active,
.btn.active {
background-image: none;
outline: 0;
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
}
*/
/* reg. elemental style
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
.btn-success {
.button-variant(@btn-success-color, #00cc66, @btn-success-border);
}
.btn-default {
.button-variant(@body-type-color, @page-background-color, @default-button-border-color);
}
*/
/* block styles */
/* CLIENT NAME :: ACCORDION STYLES */
/* Optional classes for styling icon
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - *
.accordion-icon-color {color: @c4 !important;}
.accordion-icon-active-color {color: @c5 !important;}
.accordion-button:not(.collapsed)::after {
content: "\f067";
font-family: "Font Awesome 5 Free";
color: @c5;
background-image: none;
//background-size: 1.25rem;
}
.accordion-button:after {
content: "\f068";
font-family: "Font Awesome 5 Free";
color: @c4;
background-image: none;
//background-size: 1.25rem;
}*/
/* CLIENT/PROJECT NAME :: CONVERSATIONS STYLES */
/* Conversation and Messenger Styles
- - - - - - - - - - - - - - - - - - - - - */
/* CLIENT/PROJECT NAME :: HORIZONTAL SLIDER */
/* Navigation Items Styles
- - - - - - - - - - - - - - - - - - - - - */
/* CLIENT NAME :: TEASER BOX STYLES */
/* DEFAULT TEMPLATE CAPTION BELOW
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* remove class ".teaser-box-caption:hover" to have caption dissapear on image mouseout */
/* Caption Styles, add these classes to Pagetheme, to be available in styles dropdown */
/* TEMPLATE OVERLAY
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Caption Styles, add these classes to Pagetheme, to be available in styles dropdown */
}
div.ccm-page header {
padding: 20px 0 10px 0;
margin: 10px 0 10px 0;
border-top: 1px dotted #0099ff;
border-bottom: 1px dotted #0099ff;
/* ----------- navigation links ---------------- */
}
div.ccm-page header nav {
float: right;
padding-right: 10px;
/* ----------- erste ebene ---------------- */
}
div.ccm-page header nav .dropdown:after {
content: ' ▶';
}
div.ccm-page header nav .dropdown:hover:after {
content: '\25bc';
}
div.ccm-page header nav ul {
list-style: none;
margin-top: 10px !important;
float: left;
}
div.ccm-page header nav ul a {
margin-left: 20px;
margin-right: 20px;
line-height: 35px;
padding: 8px 0px 3px 0px;
letter-spacing: 1px;
font-family: 'IBM Plex Sans', sans-serif;
text-shadow: 0 0 3px rgba(35, 39, 41, 0.7);
font-size: 16px;
font-weight: 400;
color: #000000;
text-transform: none;
}
div.ccm-page header nav ul a:hover {
color: #f8079c;
text-decoration: none;
}
div.ccm-page header nav ul a:active {
color: #ffc037;
text-decoration: none;
}
div.ccm-page header nav ul a:focus {
outline: none;
}
div.ccm-page header nav ul a.nav-selected {
font-weight: 700;
font-size: 16px;
color: #f8079c !important;
}
div.ccm-page header nav ul li {
margin: 0;
padding: 0;
position: relative;
display: inline-block;
/* ----------- zweite ebene ---------------- */
}
div.ccm-page header nav ul li:hover ul {
opacity: 1;
top: 30px;
visibility: visible;
}
div.ccm-page header nav ul li ul {
/* ----------- hintergrund fläche ---------------- */
cursor: pointer;
padding: 2px 0px 2px 0px;
float: left;
top: 25px;
left: 0px;
position: absolute;
visibility: hidden;
background-color: rgba(0, 0, 0, 0.25);
z-index: 99;
-webkit-transition: all 0.25s ease;
-o-transition: all 0.25s ease;
transition: all 0.25s ease;
-webkit-border-radius: 5px;
border-radius: 5px;
border: 1px solid rgba(248, 7, 156, 0.3);
}
div.ccm-page header nav ul li ul li {
float: none;
width: 100%;
padding-bottom: 0px;
}
div.ccm-page header nav ul li ul li:hover a {
color: #000000;
}
div.ccm-page header nav ul li ul li a {
display: block;
padding: 2px 10px 2px 0px;
font-size: 14px;
text-transform: none;
color: #000000;
-webkit-transition: all 0.25s ease;
-o-transition: all 0.25s ease;
transition: all 0.25s ease;
font-family: 'IBM Plex Sans', Arial, Helvetica, sans-serif;
font-weight: normal;
}
div.ccm-page header nav ul li ul li a:hover {
color: #f8079c;
}
div.ccm-page footer {
/* -----------fixed footer---------------------
width: 100%;
position: fixed;
left: 0;
bottom: 0;
background-color: @c2;
//opacity: 1;
*/
border-top: 1px dotted #f8079c;
border-bottom: 1px dotted #f8079c;
padding: 10px 0 10px 0;
margin: 10px 0 30px 0;
}
div.ccm-page .text-schwarz {
color: #000000;
}
div.ccm-page .text-weiss {
color: #ffffff;
}
div.ccm-page .text-gelb {
color: #ffc037;
}
div.ccm-page .text-orange {
color: #ff7300;
}
div.ccm-page .text-cyanblue {
color: #05a6cd;
}
div.ccm-page .text-hellgrau {
color: #cccccc;
}
div.ccm-page .text-mittelgrau {
color: #5c6666;
}
div.ccm-page .text-anthrazit {
color: #40423c;
}
div.ccm-page .text-himbeer {
color: #f8079c;
}
div.ccm-page .text-violet {
color: #6f00ff;
}
div.ccm-page h1,
div.ccm-page .h1 {
font-size: 30px;
line-height: 40px;
font-family: 'IBM Plex Serif', serif;
color: #ff7300;
font-weight: 400;
font-style: normal;
}
@media screen and (min-width: 992px) {
div.ccm-page h1,
div.ccm-page .h1 {
font-size: calc(30px + 6 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h1,
div.ccm-page .h1 {
font-size: 36px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page h1,
div.ccm-page .h1 {
line-height: calc(40px + 5 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h1,
div.ccm-page .h1 {
line-height: 45px;
}
}
div.ccm-page h2,
div.ccm-page .h2 {
font-size: 22px;
line-height: 30px;
font-family: 'IBM Plex Serif', serif;
color: #f8079c;
font-weight: 400;
font-style: normal;
}
@media screen and (min-width: 992px) {
div.ccm-page h2,
div.ccm-page .h2 {
font-size: calc(22px + 6 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h2,
div.ccm-page .h2 {
font-size: 28px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page h2,
div.ccm-page .h2 {
line-height: calc(30px + 6 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h2,
div.ccm-page .h2 {
line-height: 36px;
}
}
div.ccm-page h3,
div.ccm-page .h3 {
font-size: 24px;
font-family: 'IBM Plex Sans', sans-serif;
color: #f8079c;
font-weight: 400;
font-style: normal;
}
div.ccm-page h4,
div.ccm-page .h4 {
font-size: 14px;
line-height: 20px;
font-family: 'IBM Plex Serif', sans-serif;
color: #cccccc;
font-weight: 400;
letter-spacing: 1px;
text-decoration: none;
}
@media screen and (min-width: 992px) {
div.ccm-page h4,
div.ccm-page .h4 {
font-size: calc(14px + 4 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h4,
div.ccm-page .h4 {
font-size: 18px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page h4,
div.ccm-page .h4 {
line-height: calc(20px + 4 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h4,
div.ccm-page .h4 {
line-height: 24px;
}
}
div.ccm-page h4 a,
div.ccm-page .h4 a {
color: #cccccc;
border-bottom: 1px dotted #cccccc;
text-decoration: none;
}
div.ccm-page h4 a:visited,
div.ccm-page .h4 a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page h4 a:hover,
div.ccm-page .h4 a:hover {
color: #05a6cd;
border-bottom: 1px dotted #05a6cd;
}
div.ccm-page h4 a:hover:visited,
div.ccm-page .h4 a:hover:visited {
text-decoration: none;
border-bottom: 1px dotted #05a6cd;
}
div.ccm-page h5,
div.ccm-page .h5 {
font-size: 14px;
line-height: 22px;
font-family: 'IBM Plex Serif', sans-serif;
color: #ffc037;
font-weight: 400;
letter-spacing: 1px;
text-decoration: none;
}
@media screen and (min-width: 992px) {
div.ccm-page h5,
div.ccm-page .h5 {
font-size: calc(14px + 10 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h5,
div.ccm-page .h5 {
font-size: 24px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page h5,
div.ccm-page .h5 {
line-height: calc(22px + 10 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page h5,
div.ccm-page .h5 {
line-height: 32px;
}
}
div.ccm-page p {
font-size: 16px;
font-family: 'IBM Plex Mono', Courier, monospace;
color: magenta;
}
div.ccm-page p a {
color: blue;
text-decoration: none;
transition: color 0.3s ease 0s;
}
div.ccm-page p a:hover {
color: cyan;
}
div.ccm-page .text-normal {
font-size: 16px;
line-height: 22px;
font-family: 'IBM Plex Sans', sans-serif;
color: #000000;
font-weight: 400;
}
@media screen and (min-width: 768px) {
div.ccm-page .text-normal {
font-size: calc(16px + 2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .text-normal {
font-size: 18px;
}
}
@media screen and (min-width: 768px) {
div.ccm-page .text-normal {
line-height: calc(22px + 2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .text-normal {
line-height: 24px;
}
}
div.ccm-page .text-normal a {
color: #ff7300;
transition: color 0.3s ease 0s;
text-decoration: none;
}
div.ccm-page .text-normal a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .text-normal a:hover {
color: #40423c;
text-decoration: none;
}
div.ccm-page .text-klein {
font-size: 14px;
line-height: 16px;
font-family: 'IBM Plex Sans', sans-serif;
color: #40423c;
font-weight: 400;
}
@media screen and (min-width: 480px) {
div.ccm-page .text-klein {
font-size: calc(14px + 2 * ((100vw - 480px ) / 720 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .text-klein {
font-size: 16px;
}
}
@media screen and (min-width: 480px) {
div.ccm-page .text-klein {
line-height: calc(16px + 2 * ((100vw - 480px ) / 720 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .text-klein {
line-height: 18px;
}
}
div.ccm-page .text-klein a {
color: #40423c;
border-bottom: 1px dotted #40423c;
text-decoration: none;
}
div.ccm-page .text-klein a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .text-klein a:hover {
color: #ff7300;
border-bottom: 1px dotted #ff7300;
text-decoration: none;
}
div.ccm-page .titel-gross {
font-size: 22px;
line-height: 30px;
font-family: 'IBM Plex Serif', serif;
color: #ff7300;
font-weight: 500;
letter-spacing: 1px;
}
@media screen and (min-width: 768px) {
div.ccm-page .titel-gross {
font-size: calc(22px + 10 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .titel-gross {
font-size: 32px;
}
}
@media screen and (min-width: 768px) {
div.ccm-page .titel-gross {
line-height: calc(30px + 10 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .titel-gross {
line-height: 40px;
}
}
div.ccm-page .titel-klein {
font-size: 18px;
line-height: 26px;
font-family: 'IBM Plex Serif', serif;
color: #ff7300;
font-weight: 500;
letter-spacing: 1px;
}
@media screen and (min-width: 768px) {
div.ccm-page .titel-klein {
font-size: calc(18px + 10 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .titel-klein {
font-size: 28px;
}
}
@media screen and (min-width: 768px) {
div.ccm-page .titel-klein {
line-height: calc(26px + 10 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .titel-klein {
line-height: 36px;
}
}
div.ccm-page .lead-text {
font-size: 20px;
line-height: 28px;
font-family: 'IBM Plex Serif', serif;
color: #40423c;
font-weight: 400;
font-style: normal;
}
@media screen and (min-width: 768px) {
div.ccm-page .lead-text {
font-size: calc(20px + 4 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .lead-text {
font-size: 24px;
}
}
@media screen and (min-width: 768px) {
div.ccm-page .lead-text {
line-height: calc(28px + 6 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .lead-text {
line-height: 34px;
}
}
div.ccm-page .lead-text a {
color: #f8079c;
transition: color 0.3s ease 0s;
text-decoration: none;
}
div.ccm-page .lead-text a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .lead-text a:hover {
color: #40423c;
text-decoration: none;
}
div.ccm-page .legende {
font-family: 'IBM Plex Sans', sans-serif;
color: #40423c;
font-size: 16px;
font-weight: 400;
line-height: 20px;
}
div.ccm-page .legende a {
color: #40423c;
border-bottom: 1px dotted #40423c;
text-decoration: none;
}
div.ccm-page .legende a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .legende a:hover {
color: #ff7300;
border-bottom: 1px dotted #ff7300;
text-decoration: none;
}
div.ccm-page .copyright {
font-family: 'IBM Plex Sans', sans-serif;
color: #40423c;
font-size: 14px;
font-weight: 400;
line-height: 18px;
}
div.ccm-page .copyright a {
color: #40423c;
border-bottom: 1px dotted #40423c;
text-decoration: none;
}
div.ccm-page .copyright a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .copyright a:hover {
color: #ff7300;
border-bottom: 1px dotted #ff7300;
text-decoration: none;
}
div.ccm-page .liste {
font-size: 14px;
line-height: 22px;
font-family: 'IBM Plex Sans', sans-serif;
color: #40423c;
font-weight: 400;
line-height: 18px;
}
@media screen and (min-width: 768px) {
div.ccm-page .liste {
font-size: calc(14px + 2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .liste {
font-size: 16px;
}
}
@media screen and (min-width: 768px) {
div.ccm-page .liste {
line-height: calc(22px + -2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .liste {
line-height: 20px;
}
}
div.ccm-page .liste a {
color: #40423c;
border-bottom: 1px dotted #40423c;
text-decoration: none;
}
div.ccm-page .liste a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .liste a:hover {
color: #ff7300;
border-bottom: 1px dotted #ff7300;
text-decoration: none;
}
div.ccm-page .linear-wipe a {
font-size: 21px;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
background: repeating-linear-gradient(45deg, #001aff, #5200ff, #ad00ff, #ff00d6, #ff0000, #ff00d6, #ad00ff, #5200ff, #0400ff, #0400ff);
background-size: 200% auto;
color: #000;
text-shadow: 0 0 2px rgba(35, 39, 41, 0.7);
background-clip: text;
text-fill-color: transparent;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: shine 12s linear infinite;
}
@media screen and (min-width: 992px) {
div.ccm-page .linear-wipe a {
font-size: calc(21px + 15 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .linear-wipe a {
font-size: 36px;
}
}
@keyframes shine {
to {
background-position: 200% center;
}
}
div.ccm-page .bullets-highlightcolor ul li::marker {
color: #ff7300;
font-size: 14px;
}
div.ccm-page .text-schatten {
text-shadow: 1px 1px 20px #000000;
}
div.ccm-page .letter-spacing-1 {
letter-spacing: 1px;
}
div.ccm-page .remove-underline {
text-decoration: none;
}
div.ccm-page .lineheight-sm {
font-size: 14px;
}
div.ccm-page .lineheight-base {
font-size: 18px;
}
div.ccm-page .lineheight-lg {
font-size: 24px;
}
div.ccm-page .fluid-side-margin {
margin-left: 1px;
margin-right: 1px;
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-side-margin {
margin-left: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-side-margin {
margin-left: 144px;
}
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-side-margin {
margin-right: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-side-margin {
margin-right: 144px;
}
}
div.ccm-page .fluid-side-padding {
padding-left: 1px;
padding-right: 1px;
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-side-padding {
padding-left: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-side-padding {
padding-left: 144px;
}
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-side-padding {
padding-right: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-side-padding {
padding-right: 144px;
}
}
div.ccm-page .fluid-margin-top {
margin-top: 70px;
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-margin-top {
margin-top: calc(70px + 20 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-margin-top {
margin-top: 90px;
}
}
div.ccm-page .side-margin-20 {
margin: 0px 20px 0px 20px;
}
div.ccm-page .fluid-section {
padding-left: 1px;
padding-right: 1px;
padding: 20px 0 30px 0;
position: relative;
overflow: hidden;
min-width: 100vw;
box-sizing: border-box;
z-index: 1;
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-section {
padding-left: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-section {
padding-left: 144px;
}
}
@media screen and (min-width: 1024px) {
div.ccm-page .fluid-section {
padding-right: calc(1px + 143 * ((100vw - 1024px ) / 176 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .fluid-section {
padding-right: 144px;
}
}
div.ccm-page .fluid-section:before {
content: "";
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
div.ccm-page #background-color:before {
background-color: #ffffff;
z-index: -1;
}
div.ccm-page #background-pattern:before {
background-image: url("/packages/blinkbox_next/themes/blinkbox_next/media/overlays/muster_dot.png");
background-repeat: repeat;
background-attachment: fixed;
z-index: -1;
}
div.ccm-page #background-video {
width: 100vw;
height: 100vh;
object-fit: cover;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #000000;
z-index: -1;
}
div.ccm-page .header-content-image {
box-sizing: border-box;
position: relative;
min-width: 100vw;
}
div.ccm-page .header-content-image:before {
content: "";
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
div.ccm-page #header-home-image:before {
background-image: url("/packages/blinkbox_next/themes/blinkbox_next/media/images/blinkbox_background.jpg");
background-position: 50% 50%;
background-repeat: no-repeat;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
z-index: -1;
}
@media (max-width: 768px) {
div.ccm-page #header-home-image:before {
background-position: 70% 50%;
}
}
div.ccm-page .vegas-slide .vegas-slide-inner {
background-position: 80% 0%;
}
@media (max-width: 768px) {
div.ccm-page .vegas-slide .vegas-slide-inner {
background-position: 100% 50%;
}
}
div.ccm-page .header-home-image-scroll {
height: 100%;
margin: 0px;
background: url(http://www.freegreatpicture.com/files/147/18380-hd-color-background-wallpaper.jpg) no-repeat center center;
background-size: cover;
background-attachment: fixed;
}
div.ccm-page #header-home-image-scroll::before {
position: absolute;
background-color: rgba(255, 255, 255, 0.7);
width: 960px;
height: 720px;
left: 20px;
top: 20px;
}
div.ccm-page button.navbar-toggler.collapsed {
color: rgba(237, 19, 19, 0.55);
}
div.ccm-page .icon-bar {
display: block;
min-width: 16px;
min-height: 6px;
border-top: 3px solid darkgray;
}
div.ccm-page .icon-bar:first-child {
margin-top: 5px;
}
div.ccm-page .pswp__top-bar {
margin-top: 0px;
margin-bottom: 40px;
}
div.ccm-page .pswp__img {
padding-top: 0px;
padding-bottom: 40px;
}
div.ccm-page .blinkbox-pixelmeter {
background: url(/packages/blinkbox_next/themes/blinkbox_next/media/images/pixelmeter-schwarz_bs_breakpoints.gif) no-repeat, no-repeat fixed;
}
div.ccm-page .site-name .navbar-nav {
margin-left: -15px;
}
div.ccm-page .site-header .navbar-right .navbar-nav {
margin-right: -15px;
}
div.ccm-page .navbar-nav.navbar-right:last-child {
margin-right: -15px;
}
div.ccm-page div.ccm-block-page-list-title {
font-family: 'IBM Plex Sans', sans-serif;
color: #000000;
font-weight: 400;
font-style: normal;
}
div.ccm-page .jarallax {
position: relative;
z-index: 0;
}
div.ccm-page .jarallax > .jarallax-img {
position: absolute;
object-fit: cover;
/* support for plugin https://github.com/bfred-it/object-fit-images */
font-family: 'object-fit: cover;';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
div.ccm-page .wortmarke-primary {
font-size: 18px;
font-family: 'IBM Plex Sans', sans-serif;
color: #ffffff;
font-weight: 500;
}
@media screen and (min-width: 768px) {
div.ccm-page .wortmarke-primary {
font-size: calc(18px + 2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .wortmarke-primary {
font-size: 20px;
}
}
div.ccm-page .wortmarke-secondary {
font-size: 18px;
font-family: 'IBM Plex Sans', sans-serif;
color: #000000;
font-weight: 500;
}
@media screen and (min-width: 768px) {
div.ccm-page .wortmarke-secondary {
font-size: calc(18px + 2 * ((100vw - 768px ) / 832 ));
}
}
@media screen and (min-width: 1600px) {
div.ccm-page .wortmarke-secondary {
font-size: 20px;
}
}
div.ccm-page .wortmarke-secondary a {
color: #000000;
transition: color 0.3s ease 0s;
text-decoration: none;
}
div.ccm-page .wortmarke-secondary a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .wortmarke-secondary a:hover {
color: #f8079c;
text-decoration: none;
}
div.ccm-page .navlink-color-primary a {
color: #ffffff;
}
div.ccm-page .navlink-color-primary-hamburger i::after {
color: #ffffff;
}
div.ccm-page .navlink-subpages-color-primary ul li ul li a {
color: #000000;
text-shadow: 3px 3px 20px #000000;
}
div.ccm-page .fluid-box {
padding-right: 0px;
padding-left: 0px;
margin-right: auto;
margin-left: auto;
margin-bottom: 60px;
}
div.ccm-page .grid-item {
float: left;
}
div.ccm-page .grid-item-content {
padding: 12px 12px 8px 12px;
background-color: #ffffff;
border-radius: 8px;
margin-bottom: 20px;
}
div.ccm-page .box-style {
margin-bottom: 0px;
border-radius: 8px 8px 0px 0px;
padding: 8px 8px 8px 8px;
background-color: rgba(255, 255, 255, 0.75);
}
div.ccm-page .box-style-top {
border-radius: 5px 5px 0 0;
background-color: #ffffff;
}
div.ccm-page .box-style-bottom {
border-radius: 0 0 5px 5px;
background-color: #ffffff;
padding: 12px 12px 8px 12px;
margin-bottom: 20px;
}
div.ccm-page .box-style-hover {
margin: 50px 0 30px 0px;
padding: 0px 0px 0px 0px;
border: 5px dashed #ff7300;
cursor: pointer;
}
@media (max-width: 991px) {
div.ccm-page .box-style-hover {
margin: 30px 0 30px 0px;
}
}
@media (max-width: 767px) {
div.ccm-page .box-style-hover {
margin: 0px 0 30px 0px;
}
}
div.ccm-page .box-style-hover:hover {
border: 5px dashed #cccccc;
}
div.ccm-page .hr-yellow {
border: 0 none;
}
div.ccm-page .hr-yellow hr {
border-top: 3px dashed #cccccc;
margin-top: 10px;
margin-bottom: 40px;
}
div.ccm-page .hr-no-margin {
border: 0 none;
}
div.ccm-page .hr-no-margin hr {
border-top: 3px dashed #ff7300;
margin-top: 0px;
margin-bottom: 0px;
}
div.ccm-page .arrow-button {
border: 2px solid #0066cc !important;
font-size: 42px;
line-height: 40px;
color: #ffffff;
border-radius: 50%;
height: 55px;
width: 55px;
position: relative;
margin: 20px 0px 0px 0px;
}
div.ccm-page .arrow-button:hover {
color: #05a6cd;
background-color: #0000cc;
text-decoration: none;
border-color: #fff;
}
div.ccm-page div.margin-bottom-regular {
margin-bottom: 15px;
}
div.ccm-page div.margin-bottom-medium {
margin-bottom: 30px;
}
div.ccm-page div.margin-bottom-large {
margin-bottom: 60px;
}
div.ccm-page div.margin-top-regular {
margin-top: 15px;
}
div.ccm-page div.margin-top-medium {
margin-top: 30px;
}
div.ccm-page div.margin-top-large {
margin-top: 60px;
}
@media (max-width: 576px) {
div.ccm-page div.margin-top-large {
margin-top: 30px;
}
}
div.ccm-page #scrollup {
margin-right: 1px;
border-radius: 3px;
opacity: 1.0;
position: fixed;
bottom: 35px;
right: 10px;
display: none;
line-height: 35px;
text-align: center;
width: 40px;
height: 40px;
font-size: 35px;
cursor: pointer;
background-color: transparent;
color: #ff7300;
z-index: 999999;
}
@media screen and (min-width: 768px) {
div.ccm-page #scrollup {
margin-right: calc(1px + 143 * ((100vw - 768px ) / 432 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page #scrollup {
margin-right: 144px;
}
}
div.ccm-page #scrollup:hover {
color: #cccccc;
background-color: transparent;
}
div.ccm-page div.ccm-system-errors {
margin-top: 40px;
}
@media (max-width: 576px) {
div.ccm-page .hidden-xs {
display: none !important;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
div.ccm-page .hidden-sm {
display: none !important;
}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
div.ccm-page .hidden-md {
display: none !important;
}
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
div.ccm-page .hidden-lg {
display: none !important;
}
}
@media (min-width: 1400px) {
div.ccm-page .hidden-xl {
display: none !important;
}
}
div.ccm-page .visible-print {
display: none !important;
}
@media print {
div.ccm-page .visible-print {
display: block !important;
}
div.ccm-page table.visible-print {
display: table;
}
div.ccm-page tr.visible-print {
display: table-row !important;
}
div.ccm-page th.visible-print,
div.ccm-page td.visible-print {
display: table-cell !important;
}
}
div.ccm-page .visible-print-block {
display: none !important;
}
@media print {
div.ccm-page .visible-print-block {
display: block !important;
}
}
div.ccm-page .visible-print-inline {
display: none !important;
}
@media print {
div.ccm-page .visible-print-inline {
display: inline !important;
}
}
div.ccm-page .visible-print-inline-block {
display: none !important;
}
@media print {
div.ccm-page .visible-print-inline-block {
display: inline-block !important;
}
}
@media print {
div.ccm-page .hidden-print {
display: none !important;
}
}
@media print {
div.ccm-page a,
div.ccm-page a:visited {
text-decoration: underline;
}
div.ccm-page a[href]:after {
display: none !important;
}
div.ccm-page abbr[title]:after {
display: none !important;
}
div.ccm-page a[href^="#"]:after,
div.ccm-page a[href^="javascript:"]:after {
display: none !important;
}
}
div.ccm-page .titel-alle-spalten {
column-span: all;
}
div.ccm-page .kein-absatz-umbruch {
break-before: column;
break-after: avoid;
}
div.ccm-page .column-flow-2 {
margin: 0 0 30px 0;
column-gap: 30px;
column-rule: 1px dotted #000;
-webkit-column-rule: 1px dotted #000;
/* Chrome, Safari, Opera */
column-count: 2;
-webkit-column-count: 2;
/* Safari and Chrome */
column-span: all;
-webkit-column-span: all;
/* Chrome, Safari, Opera */
/* extend to 3 columns for XL size
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
@media (min-width: 1440px) {
column-count:3;
-webkit-column-count:3; // Safari and Chrome
}*/
}
@media (max-width: 479px) {
div.ccm-page .column-flow-2 {
column-count: 1;
-webkit-column-count: 1;
/* Safari and Chrome */
}
}
div.ccm-page .column-flow-3 {
margin: 0 0 30px 0;
column-gap: 30px;
column-rule: 1px dotted #000;
-webkit-column-rule: 1px dotted #000;
/* Chrome, Safari, Opera */
column-count: 3;
-webkit-column-count: 3;
/* Safari and Chrome */
column-span: all;
-webkit-column-span: all;
/* Chrome, Safari, Opera */
}
@media (max-width: 479px) {
div.ccm-page .column-flow-3 {
column-count: 1;
-webkit-column-count: 1;
/* Safari and Chrome */
}
}
@media (min-width: 480px) and (max-width: 767px) {
div.ccm-page .column-flow-3 {
column-count: 2;
-webkit-column-count: 2;
/* Safari and Chrome */
}
}
@media (min-width: 1440px) {
div.ccm-page .column-flow-3 {
column-count: 3;
-webkit-column-count: 3;
/* Safari and Chrome */
}
}
div.ccm-page .column-flow-4 {
margin: 0 0 30px 0;
column-gap: 30px;
column-rule: 1px dotted #000;
-webkit-column-rule: 1px dotted #000;
/* Chrome, Safari, Opera */
column-count: 4;
-webkit-column-count: 4;
/* Safari and Chrome */
column-span: all;
-webkit-column-span: all;
/* Chrome, Safari, Opera */
}
@media (max-width: 479px) {
div.ccm-page .column-flow-4 {
column-count: 1;
-webkit-column-count: 1;
/* Safari and Chrome */
}
}
@media (min-width: 480px) and (max-width: 767px) {
div.ccm-page .column-flow-4 {
column-count: 2;
-webkit-column-count: 2;
/* Safari and Chrome */
}
}
@media (min-width: 768px) and (max-width: 991px) {
div.ccm-page .column-flow-4 {
column-count: 3;
-webkit-column-count: 3;
/* Safari and Chrome */
}
}
@media (min-width: 1440px) {
div.ccm-page .column-flow-4 {
column-count: 5;
-webkit-column-count: 5;
/* Safari and Chrome */
}
}
div.ccm-page .btn {
color: #fff;
border: 1px #fff;
}
div.ccm-page .image-right-tilt .ccm-image-block {
display: block;
margin: 0px auto 0px auto;
transform: rotate(3deg);
-moz-transform: rotate(3deg);
-ms-transform: rotate(3deg);
/* IE 9 */
-webkit-transform: rotate(3deg);
}
div.ccm-page .rounded-circle .ccm-image-block {
border-radius: 50%;
}
div.ccm-page .rounded .ccm-image-block {
border-radius: 8px;
}
div.ccm-page .rounded-top .ccm-image-block {
border-radius: 5px 5px 0 0;
}
div.ccm-page img {
max-width: 100%;
height: auto;
}
div.ccm-page .accordion-button {
position: relative;
display: flex;
align-items: center;
width: 100%;
padding: 1rem 1.25rem;
font-size: 1.125rem;
color: #ff7300;
text-align: left;
background-color: #fff;
border: 0;
border-radius: 5px;
overflow-anchor: none;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
}
@media (prefers-reduced-motion: reduce) {
div.ccm-page .accordion-button {
transition: none;
}
}
div.ccm-page .accordion-button:not(.collapsed) {
color: #05a6cd;
background-color: #ffffff;
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125);
}
div.ccm-page .accordion-button:not(.collapsed)::after {
background-image: url("/packages/blinkbox_next/themes/blinkbox_next/media/vectors/arrow_down_cyan.svg");
transform: rotate(-180deg);
}
div.ccm-page .accordion-button::after {
flex-shrink: 0;
width: 20px;
height: 12px;
margin-left: auto;
content: "";
background-image: url("/packages/blinkbox_next/themes/blinkbox_next/media/vectors/arrow_down_orange.svg");
background-repeat: no-repeat;
background-size: 20px;
transition: transform 0.2s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
div.ccm-page .accordion-button::after {
transition: none;
}
}
div.ccm-page .accordion-button:hover {
z-index: 2;
}
div.ccm-page .accordion-button:focus {
z-index: 3;
border-color: #fd01be;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(253, 141, 13, 0.25);
}
div.ccm-page .accordion-header {
margin-bottom: 0;
}
div.ccm-page .accordion-item {
background-color: #ffffff;
border: 1px solid rgba(0, 0, 0, 0.125);
}
div.ccm-page .accordion-item:first-of-type {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
div.ccm-page .accordion-item:first-of-type .accordion-button {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
div.ccm-page .accordion-item:not(:first-of-type) {
border-top: 0;
}
div.ccm-page .accordion-item:last-of-type {
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
div.ccm-page .accordion-item:last-of-type .accordion-button.collapsed {
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
div.ccm-page .accordion-item:last-of-type .accordion-collapse {
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
div.ccm-page .accordion-body {
padding: 1rem 1.25rem;
}
div.ccm-page .accordion-flush .accordion-collapse {
border-width: 0;
}
div.ccm-page .accordion-flush .accordion-item {
border-right: 0;
border-left: 0;
border-radius: 0;
}
div.ccm-page .accordion-flush .accordion-item:first-child {
border-top: 0;
}
div.ccm-page .accordion-flush .accordion-item:last-child {
border-bottom: 0;
}
div.ccm-page .accordion-flush .accordion-item .accordion-button {
border-radius: 0;
}
div.ccm-page .ccm-conversation-wrapper {
font-family: 'IBM Plex Serif', serif;
color: #000000;
font-weight: 400;
font-style: normal;
}
div.ccm-page div.ccm-conversation-message div.ccm-conversation-message-byline span.ccm-conversation-message-username {
color: #ff7300;
font-weight: 700;
}
div.ccm-page div.ccm-conversation-message div.ccm-conversation-message-byline span.ccm-conversation-message-date {
color: #9f9f9f;
font-size: 0.8rem;
}
div.ccm-page .xw-timeline-slider-module {
font-family: 'IBM Plex Sans', sans-serif;
color: #000000;
font-weight: 400;
font-style: normal;
}
div.ccm-page .timeline__slider-item.slick-current .timeline__slider-item-headline {
color: #ff7300;
font-weight: 700;
transform: scale(1.05);
}
div.ccm-page .timeline__slider-item-subline {
font-size: var(--xw-timeline-slider-item-subline, 15px);
line-height: 1.3;
color: #ff7300;
}
div.ccm-page .timeline__slider-arrow-icon {
height: var(--xw-timeline-slider-item-arrow-height, 100px);
width: var(--xw-timeline-slider-item-arrow-width, 70px);
fill: #ff7300;
}
div.ccm-page .timeline__slider-item-bubble {
background-color: var(--xw-timeline-slider-item-bubble-color, #3f3f3f);
border-radius: 50%;
display: inline-block;
height: var(--xw-timeline-slider-item-size, 18px);
margin-top: var(--xw-timeline-slider-item-size, 18px);
position: relative;
width: var(--xw-timeline-slider-item-size, 18px);
transform: var(--xw-timeline-slider-item-transform, translateY(-7px));
transition: all .2s;
}
div.ccm-page .timeline__slider-item.slick-current .timeline__slider-item-bubble {
background-color: var(--xw-timeline-slider-item-active-bubble-color, #ff7300);
height: var(--xw-timeline-slider-item-active-size, 30px);
width: var(--xw-timeline-slider-item-active-size, 30px);
transform: var(--xw-timeline-slider-item-active-transform, translateY(0));
margin-top: .7rem;
}
div.ccm-page .timeline__slider-inner::after {
content: "";
background-color: var(--xw-timeline-slider-line-color, #ff7300);
position: absolute;
display: block;
height: .1rem;
left: 8%;
right: 8%;
bottom: 4.1rem;
z-index: -1;
}
div.ccm-page .teaser-box-wrapper {
float: left;
height: auto;
cursor: pointer;
position: relative;
display: block;
z-index: 1;
}
div.ccm-page .teaser-box-wrapper:hover .teaser-box-image {
opacity: 0.75;
}
div.ccm-page .teaser-box-image {
width: 100%;
/* &:hover, &:active {-webkit-user-select: none;-webkit-touch-callout: none;}
margin-bottom:3px;*/
}
div.ccm-page .teaser-box-caption {
transition: all 200ms ease-in-out;
padding: 8px 5px 12px 5px;
opacity: 0.0;
}
div.ccm-page .teaser-box-caption a {
text-decoration: none;
}
div.ccm-page .teaser-box-caption a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .teaser-box-caption a:hover {
text-decoration: none;
}
@media (max-width: 576px) {
div.ccm-page .teaser-box-caption {
opacity: 1.0;
}
}
div.ccm-page .teaser-box-image:hover + .teaser-box-caption,
div.ccm-page .teaser-box-caption:hover {
opacity: 1.0;
}
div.ccm-page .teaser-box-title {
font-size: 16px;
line-height: 17px;
font-family: 'IBM Plex Sans', sans-serif;
color: #5c6666;
font-weight: 700;
font-style: normal;
letter-spacing: 1px;
}
@media screen and (min-width: 992px) {
div.ccm-page .teaser-box-title {
font-size: calc(16px + 2 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-title {
font-size: 18px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page .teaser-box-title {
line-height: calc(17px + 3 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-title {
line-height: 20px;
}
}
div.ccm-page .teaser-box-text {
font-size: 14px;
line-height: 15px;
font-family: 'IBM Plex Sans', sans-serif;
color: #cccccc;
font-weight: 400;
font-style: normal;
}
@media screen and (min-width: 992px) {
div.ccm-page .teaser-box-text {
font-size: calc(14px + 2 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-text {
font-size: 16px;
}
}
@media screen and (min-width: 992px) {
div.ccm-page .teaser-box-text {
line-height: calc(15px + 3 * ((100vw - 992px ) / 208 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-text {
line-height: 18px;
}
}
div.ccm-page .teaser-box-wrapper-overlay {
float: left;
height: auto;
cursor: pointer;
position: relative;
display: block;
margin-bottom: 20px;
z-index: 1;
}
div.ccm-page .teaser-box-image-overlay {
width: 100%;
/* &:hover, &:active {-webkit-user-select: none;-webkit-touch-callout: none;}
margin-bottom:3px;*/
}
div.ccm-page .teaser-box-caption-overlay {
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
transition: all 200ms ease-in-out;
opacity: 0.0;
}
div.ccm-page .teaser-box-caption-overlay a {
text-decoration: none;
}
div.ccm-page .teaser-box-caption-overlay a:visited {
text-decoration: none;
outline: none;
}
div.ccm-page .teaser-box-caption-overlay a:hover {
text-decoration: none;
}
@media (max-width: 576px) {
div.ccm-page .teaser-box-caption-overlay {
opacity: 1.0;
}
}
div.ccm-page .teaser-box-image-overlay:hover + .teaser-box-caption-overlay,
div.ccm-page .teaser-box-caption-overlay:hover {
opacity: 1.0;
}
div.ccm-page .teaser-box-text-overlay {
font-size: 20px;
line-height: 24px;
font-family: 'IBM Plex Sans', sans-serif;
color: #ffffff;
font-weight: 500;
font-style: normal;
width: 80%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
z-index: 9;
}
@media screen and (min-width: 576px) {
div.ccm-page .teaser-box-text-overlay {
font-size: calc(20px + -2 * ((100vw - 576px ) / 624 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-text-overlay {
font-size: 18px;
}
}
@media screen and (min-width: 576px) {
div.ccm-page .teaser-box-text-overlay {
line-height: calc(24px + -1 * ((100vw - 576px ) / 624 ));
}
}
@media screen and (min-width: 1200px) {
div.ccm-page .teaser-box-text-overlay {
line-height: 23px;
}
}
@media (max-width: 576px) {
div.ccm-page .teaser-box-text-overlay {
width: 90%;
}
}
/* not namespaced styles */
/* CLIENT/PROJECT NAME :: MOBILE NAVIGATION STYLES */
.ccm-responsive-overlay {
font-family: 'IBM Plex Sans';
display: none;
position: absolute;
background: rgba(255, 255, 255, 0.8);
width: 100%;
z-index: 99;
top: 150px;
left: 0px;
padding: 10px 0 30px 32px;
text-align: center;
-webkit-text-size-adjust: none;
}
.ccm-responsive-overlay ul {
padding-left: 0;
}
.ccm-responsive-overlay ul li {
list-style-type: none;
display: block;
}
.ccm-responsive-overlay ul li.parent-ul a:after {
padding-left: 7px;
padding-top: 3px;
font-size: 20px;
content: "\f107";
font-family: "Font Awesome 5 Free";
font-weight: 700;
font-style: normal;
display: inline-block;
cursor: pointer;
text-decoration: inherit;
}
.ccm-responsive-overlay ul li a {
color: #40423c;
font-size: 24px;
letter-spacing: 1px;
display: inline-block;
width: 80%;
padding: 4px 0px 4px 0px;
height: 100%;
font-weight: 400;
text-decoration: none;
}
.ccm-responsive-overlay ul li a:hover {
color: #ff7300;
}
.ccm-responsive-overlay ul li a.nav-selected {
color: #ff7300;
}
.ccm-responsive-overlay ul li ul li {
padding-left: 10px;
}
.ccm-responsive-overlay ul li ul li.last-li a {
padding-top: 0px;
font-size: 24px;
}
.ccm-responsive-overlay ul li ul li.last-li a:after {
content: '';
}
.ccm-responsive-menu-launch {
display: none;
cursor: pointer;
margin-top: 10px;
margin-bottom: 20px;
margin-right: 15px;
float: right;
z-index: 1001;
}
.ccm-responsive-menu-launch.responsive-button-close i:after {
font-size: 28px;
color: #40423c;
content: "\f077";
font-family: "Font Awesome 5 Free";
font-weight: 700;
font-style: normal;
display: inline-block;
cursor: pointer;
text-decoration: inherit;
}
.ccm-responsive-menu-launch i:after {
font-size: 28px;
content: "\f0c9";
font-family: "Font Awesome 5 Free";
color: #40423c;
font-weight: 700;
font-style: normal;
display: inline-block;
cursor: pointer;
text-decoration: inherit;
}
@media all and (max-width: 991.98px) {
.ccm-responsive-menu-launch {
display: block;
}
.ccm-responsive-navigation.original {
display: none;
}
}
@media all and (min-width: 991.98px) {
.ccm-responsive-overlay {
display: none !important;
}
}
/* Hamburger only
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
.ccm-responsive-menu-launch {
display: block;
}
.ccm-responsive-navigation.original {
display: none;
}
/* Hamburger @ sm breakpoint
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */