/**
 * @file
 * Subtheme specific CSS.
 */

/*
 * Otto Zitko Bootstrap Barrio 5 SubTheme
 * Markus Hörl / designpraxis.at
 */





/* ----- Allgemein -----
 */
 
/* Barrio 5 Update */
body .visually-hidden-focusable {
  display: none !important;
  visibility: hidden !important;
}





/* ----- Logo -----
 */

/* Barrio 5 Update */
.navbar {
  padding: 0.5rem 1rem;
}

.navbar-brand {
  margin-left: -2px;  /* 36px;  "ottozitko"-logo nicht links eingerückt und "o" ganz links mit -2px optisch korrigiert */
  margin-bottom: 20px;
  text-transform: uppercase;
  font-size: 2.8rem;
  font-weight: bold;
  letter-spacing: -1px;
  color:#4a4a4a; /* Barrio 5 Update */
}

/* ottozitko-logo nicht links eingerückt n.v. */
/* @media all and (min-width: 768px) {  .navbar-brand {  margin-left: 56px;  }  } */


.navbar .navbar-toggler {
  border-width: 0;
  outline: 0;
  padding: .25rem 0 20px; /* .25rem .75rem; */
  margin-left: -1px;
}



/* Barrio 5 Update */

.row>* {
  padding-right: 13px;
  padding-left: 13px;
}

@media all and (min-width: 768px) {

  .row>* {
    padding-right: 15px;
    padding-left: 15px;
  }

}



/* ----- Sidebar -----
 */

/* content-bereich alignment oben */
.sidebar .block {
  border-width: 0;
  padding: 0 15px 15px 17px;
}

/* Barrio 5 Update */
.sidebar .navbar {
  padding: 0 2px;
}

/* Barrio 5 Update
 * 
 * html - How to remove focus around buttons on click - Stack Overflow
 * https://stackoverflow.com/questions/19053181/how-to-remove-focus-around-buttons-on-click
 */
.navbar-toggler:focus {
  outline: none;
  box-shadow: none;
}


.sidebar .block div.content {
  margin: 0 -1rem;
  font-size: 1rem;
}

.sidebar .block ul.links {
  list-style: none;
  padding-right: 0;
  padding-left: 0;
}

.sidebar .block ul.links a {
  color: rgba(0, 0, 0, .5);
}
.sidebar .block ul.links .is-active a {
  color: rgba(0, 0, 0, 1);
  font-weight: bold;
}

.site-footer .region-footer-first {
  margin-left: 0;
}



/* ----- Hauptmenü -----
 */ 

@media all and (min-width: 768px) {

  .sidebar .block.menu--main {
    margin-bottom: 14px;
  }

}

@media all and (min-width: 927px) {

  .sidebar .block.menu--main {
    margin-bottom: 120px;
  }

}



/* ----- Menüs -----
 */

/* .navbar-nav  (Barrio 4) { */
.block-menu .nav {  /* Barrio 5 Update */
  text-transform: uppercase;
  font-size: 0.914em;
  letter-spacing: 1px;
  display: block;
}

/* .navigation .navbar-nav .nav-link  (Barrio 4) { */
.block-menu .nav .nav-link {  /* Barrio 5 Update */
  color: rgba(0, 0, 0, .5);
  padding: 0 0 0.4rem;
}

/* .nav-item.active, */
/* .navigation .navbar-nav .nav-link.is-active,  (Barrio 4) */
.block-menu .nav-link.is-active,  /* Barrio 5 Update */
/* .path-site-specific .navigation .navbar-nav .nav-link[data-drupal-link-system-path="node/24"],  (etc. Barrio 4) */
/* Barrio 5 Update */
.path-site-specific .block-menu .nav-link[data-drupal-link-system-path="node/24"],  /* In Situ */
.path-exhibitions .block-menu .nav-link[data-drupal-link-system-path="node/36"],  /* Ausstellungen */
.path-aluminum .block-menu .nav-link[data-drupal-link-system-path="node/25"],  /* Aluminium */
.path-canvas .block-menu .nav-link[data-drupal-link-system-path="node/26"],  /* Leinwand */
.path-paper .block-menu .nav-link[data-drupal-link-system-path="node/27"],  /* Papier */
.path-wood .block-menu .nav-link[data-drupal-link-system-path="node/28"],  /* Holz */
.path-glass .block-menu .nav-link[data-drupal-link-system-path="node/29"],  /* Glas */
.path-specials .block-menu .nav-link[data-drupal-link-system-path="node/30"],  /* Spezielles */
/* .page-node-4 .block-menu .nav-link[data-drupal-link-system-path="node/4"],  Biografie */
/* .page-node-5 .block-menu .nav-link[data-drupal-link-system-path="node/5"],  Bibliografie */
.node--type-video .block-menu .nav-link[data-drupal-link-system-path="video"],  /* Video */
.node--type-text .block-menu .nav-link[data-drupal-link-system-path="text"],  /* Text */
.node--type-news .block-menu .nav-link[data-drupal-link-system-path="news"] {  /* News */
  color: rgba(0, 0, 0, 1);
  font-weight: bold;
}



/* ----- Sprachumschalter / Language Switcher -----
 */ 

.sidebar .block-language {
  margin-bottom: 16px;
}

/* Barrio 5 Update */
.sidebar .block-language .nav {
  margin-left: 0;
  margin-right: 0;
}

.block-language .links .nav-link a {
  color: rgba(0, 0, 0, .5);
}
/* .block-language .links .nav-link a.is-active {  color: #4a4a4a;  } */

.block-language .links .nav-link {
  text-transform: uppercase;
  font-size: 0.914em;
  letter-spacing: 1px;
  padding: 0 0 0.4rem;
  display: inline-block;
}
.block-language .links .de.nav-link:after {
  color: rgba(0, 0, 0, .5);
  content: ' /';
  margin-right: 5px;
}



/* ----- Werkfoto Menüs Views -----
 */

/* breite limitieren und inhalt zentrieren */
/*
.path-site-specific .main-content .section, 
.path-aluminum .main-content .section, 
.path-canvas .main-content .section, 
.path-paper .main-content .section, 
.path-wood .main-content .section, 
.path-glass .main-content .section, 
.path-specials .main-content .section {
  max-width: 610px;
  margin: 0 auto;
}
*/

.view-werkfoto-menues .view-content {  /* Container für Years & Places */
  display: block;
  clear: both;
}

.view-werkfoto-menues .view-grouping-header,   /* Year */
.view-werkfoto-menues .view-content h3 {  /* Place */
  float: left;
  clear: left;
  margin-right: 10px;
}

.view-werkfoto-menues .view-content .view-grouping-content h3 {  /* Place */
  float: left;
  clear: none;
  margin-right: 10px;
}

.view-werkfoto-menues .view-content h3 {  /* Place */
  margin-top: 2px;
  margin-right: 10px;
  font-size: 100%;
  font-weight: normal;
}


/* Aktives Jahr in Jahres-Submenü Block highlighten 
 *
 * [class*="str"] select that elements whose attribute value contains the specified sub string str.
 * https://www.geeksforgeeks.org/wildcard-selectors-and-in-css-for-classes/
 * https://www.w3schools.com/css/css_attribute_selectors.asp
 * https://www.w3schools.com/cssref/sel_attr_contain.asp
 */

[class*="-2050"] .year-2050, 
[class*="-2049"] .year-2049, 
[class*="-2048"] .year-2048, 
[class*="-2047"] .year-2047, 
[class*="-2046"] .year-2046, 
[class*="-2045"] .year-2045, 
[class*="-2044"] .year-2044, 
[class*="-2043"] .year-2043, 
[class*="-2042"] .year-2042, 
[class*="-2041"] .year-2041, 
[class*="-2040"] .year-2040, 
[class*="-2039"] .year-2039, 
[class*="-2038"] .year-2038, 
[class*="-2037"] .year-2037, 
[class*="-2036"] .year-2036, 
[class*="-2035"] .year-2035, 
[class*="-2034"] .year-2034, 
[class*="-2033"] .year-2033, 
[class*="-2032"] .year-2032, 
[class*="-2031"] .year-2031, 
[class*="-2030"] .year-2030, 
[class*="-2029"] .year-2029, 
[class*="-2028"] .year-2028, 
[class*="-2027"] .year-2027, 
[class*="-2026"] .year-2026, 
[class*="-2025"] .year-2025, 
[class*="-2024"] .year-2024, 
[class*="-2023"] .year-2023, 
[class*="-2022"] .year-2022, 
[class*="-2021"] .year-2021, 
[class*="-2020"] .year-2020, 
[class*="-2019"] .year-2019, 
[class*="-2018"] .year-2018, 
[class*="-2017"] .year-2017, 
[class*="-2016"] .year-2016, 
[class*="-2015"] .year-2015, 
[class*="-2014"] .year-2014, 
[class*="-2013"] .year-2013, 
[class*="-2012"] .year-2012, 
[class*="-2011"] .year-2011, 
[class*="-2010"] .year-2010, 
[class*="-2009"] .year-2009, 
[class*="-2008"] .year-2008, 
[class*="-2007"] .year-2007, 
[class*="-2006"] .year-2006, 
[class*="-2005"] .year-2005, 
[class*="-2004"] .year-2004, 
[class*="-2003"] .year-2003, 
[class*="-2002"] .year-2002, 
[class*="-2001"] .year-2001, 
[class*="-2000"] .year-2000, 
[class*="-1999"] .year-1999, 
[class*="-1998"] .year-1998, 
[class*="-1997"] .year-1997, 
[class*="-1996"] .year-1996, 
[class*="-1995"] .year-1995, 
[class*="-1994"] .year-1994, 
[class*="-1993"] .year-1993, 
[class*="-1992"] .year-1992, 
[class*="-1991"] .year-1991, 
[class*="-1990"] .year-1990, 
[class*="-1989"] .year-1989, 
[class*="-1988"] .year-1988, 
[class*="-1987"] .year-1987, 
[class*="-1986"] .year-1986, 
[class*="-1985"] .year-1985, 
[class*="-1984"] .year-1984, 
[class*="-1983"] .year-1983, 
[class*="-1982"] .year-1982, 
[class*="-1981"] .year-1981, 
[class*="-1980"] .year-1980, 
[class*="-1979"] .year-1979, 
[class*="-1978"] .year-1978, 
[class*="-1977"] .year-1977, 
[class*="-1976"] .year-1976, 
[class*="-1975"] .year-1975, 
[class*="-1974"] .year-1974, 
[class*="-1973"] .year-1973, 
[class*="-1972"] .year-1972, 
[class*="-1971"] .year-1971, 
[class*="-1970"] .year-1970, 
[class*="-1969"] .year-1969, 
[class*="-1968"] .year-1968, 
[class*="-1967"] .year-1967, 
[class*="-1966"] .year-1966, 
[class*="-1965"] .year-1965, 
[class*="-1964"] .year-1964, 
[class*="-1963"] .year-1963, 
[class*="-1962"] .year-1962, 
[class*="-1961"] .year-1961, 
[class*="-1960"] .year-1960, 
[class*="-1959"] .year-1959 {
  color: rgba(0, 0, 0, 1);
  font-weight: bold;
}

/* Aktiven Ort in Jahres-Submenü von In-Situ-Block highlighten 
 */
/* [class*="place-3"] .place-3,    - Undefiniert - */ 
[class*="place-23"] .place-23,  /* St. Petersburg */ 
[class*="place-24"] .place-24,  /* Wels */ 
[class*="place-25"] .place-25,  /* Brünn */ 
[class*="place-26"] .place-26,  /* Linz */ 
[class*="place-27"] .place-27,  /* Soloturn */ 
[class*="place-28"] .place-28,  /* Wien */ 
[class*="place-29"] .place-29,  /* Wien */ 
[class*="place-30"] .place-30,  /* Wien */ 
[class*="place-31"] .place-31,  /* Rügen */ 
[class*="place-32"] .place-32,  /* Bristol */ 
[class*="place-33"] .place-33,     /* xxx Berlin */ 
[class*="place-34"] .place-34,  /* Bukarest */ 
[class*="place-35"] .place-35,  /* Innsbruck */ 
[class*="place-36"] .place-36,  /* Leipzig */ 
[class*="place-37"] .place-37,  /* Bozen */ 
[class*="place-38"] .place-38,  /* Bozen */ 
[class*="place-39"] .place-39,  /* Krakau */ 
[class*="place-40"] .place-40,  /* Berlin */ 
[class*="place-41"] .place-41,  /* Berlin */ 
[class*="place-42"] .place-42,  /* Salzburg */ 
[class*="place-43"] .place-43,  /* Hall in Tirol */ 
[class*="place-44"] .place-44,  /* Tessaloniki */ 
[class*="place-45"] .place-45,  /* Helsinki */ 
[class*="place-46"] .place-46,  /* Klagenfurt */ 
[class*="place-47"] .place-47,  /* Madrid */ 
[class*="place-48"] .place-48,  /* Madrid */ 
[class*="place-49"] .place-49,  /* New York */ 
[class*="place-50"] .place-50,  /* New York */ 
[class*="place-51"] .place-51,  /* New York */ 
[class*="place-52"] .place-52, 
[class*="place-53"] .place-53, 
[class*="place-54"] .place-54, 
[class*="place-55"] .place-55, 
[class*="place-56"] .place-56, 
[class*="place-57"] .place-57, 
[class*="place-58"] .place-58, 
[class*="place-59"] .place-59, 
[class*="place-60"] .place-60, 
[class*="place-61"] .place-61, 
[class*="place-62"] .place-62, 
[class*="place-63"] .place-63, 
[class*="place-64"] .place-64, 
[class*="place-65"] .place-65, 
[class*="place-66"] .place-66, 
[class*="place-67"] .place-67, 
[class*="place-68"] .place-68, 
[class*="place-69"] .place-69, 
[class*="place-70"] .place-70, 
[class*="place-71"] .place-71, 
[class*="place-72"] .place-72, 
[class*="place-73"] .place-73, 
[class*="place-74"] .place-74, 
[class*="place-75"] .place-75, 
[class*="place-76"] .place-76, 
[class*="place-77"] .place-77, 
[class*="place-78"] .place-78, 
[class*="place-79"] .place-79, 
[class*="place-80"] .place-80, 
[class*="place-81"] .place-81, 
[class*="place-82"] .place-82, 
[class*="place-83"] .place-83, 
[class*="place-84"] .place-84, 
[class*="place-85"] .place-85, 
[class*="place-86"] .place-86, 
[class*="place-87"] .place-87, 
[class*="place-88"] .place-88, 
[class*="place-89"] .place-89, 
[class*="place-90"] .place-90, 
[class*="place-91"] .place-91, 
[class*="place-92"] .place-92, 
[class*="place-93"] .place-93, 
[class*="place-94"] .place-94, 
[class*="place-95"] .place-95, 
[class*="place-96"] .place-96, 
[class*="place-97"] .place-97, 
[class*="place-98"] .place-98, 
[class*="place-99"] .place-99 {
  color: rgba(0, 0, 0, 1);
  font-weight: bold;
  /* border-bottom: 2px solid #444; */
}





/* ----- Node -----
 */

/* Content-bereich Alignment oben */
.node__content {
  margin-top: 7px;
}
.node--type-seite .node__content {
  margin-top: 0;
}

/* Schriftgröße wie _reboot.scss */
.node__content {
  font-size: 1rem;
}

/* Unpublished node styles. */
.node--unpublished {
  padding: 20px 15px 0;
  border-left: 1px solid #f00;
}
.node--unpublished .comment-text .comment-arrow {
  border-left: 1px solid #f00;
  border-right: 1px solid #f00;
}

/* Content-Bereich Alignment oben */
.main-content {
  margin-top: 0;  /* kein Titel, daher oben kein Abstand */
  padding-bottom: 30px;  /* Abstand zu Footer-Menü /Sidbar-right bei Mobile darunter */
}



/* ----- Content -----
 */

/* Titel */
.h1, h1, .h2, h2 {
  font-size: 1.5rem;
}
.h3, h3, .h4, h4 {
  font-size: 1.25rem;
}
.h5, h5, .h6, h6 {
  font-size: 1.15rem;
}

/* Links in Dunkelgrau und nicht Unterstrichen */
div a, div .link {
  color: #4a4a4a;
  text-decoration: none;
}



/* ----- Seite -----
 */

/* Breite limitieren */
.node--type-seite .main-content .section {
  max-width: 610px;
  margin: 0 auto;
}

.node--type-seite h1.title {
  display: none;
  visibility: hidden;
}



/* MH: Bei Menü views Seite wird Titel angezeigt, auch wenn Titel in Views leer! 
 *     Bei Seite wird Titel angezeigt, auch wenn Titel in Views leer! 
 *     Bei Menü Views Block wird Titel _nicht_ angezeigt, wenn Titel in Views leer 
 *     oder Titel bei Block unter Blocklayout ausgeblendet. 
 */
/* oben Bündigkeit mit Menüs in Sidebar left und right herstellen */
.path-site-specific h1.title, 
.path-exhibitions h1.title, 
.path-aluminum h1.title, 
.path-canvas h1.title, 
.path-paper h1.title,
.path-wood h1.title, 
.path-glass h1.title, 
.path-specials h1.title {
  margin-bottom: 5px;
}





/* ----- Reiter über Tabellen -----
 */

.nav-tabs, 
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover, 
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  border-color: #fff;
}



/* ----- Tabelle unter Reiter 'Reihung' -----
 */

/* Tabelle ohne vertikale Linien */
tr td,
tr th {
  border-left: none;
  border-right: none;
}

/* übermäßige Ränder links und rechts entfernen */
.views-field-form-field-field-media-reihung .col-auto {
  padding-left: 0;
  padding-right: 0;
}

/* übermäßigen rechten Rand entfernen */
.js td .dropbutton-multiple {
    padding-right: 0.5em;
    margin-right: 0.5em;
}



/* ----- Draggable Views n.v. -----
 */

/* Fehler mit nicht sichtbarem Drag-Handle beheben */ 
a.tabledrag-handle .handle {
  width: 28px;
  height: 28px;
}





/* ----- Video, Text und News -----
 */
 
/* Breite limitieren und Inhalt zentrieren */
.path-video .main-content .section, 
.node--type-video .main-content .section, 
.path-text .main-content .section, 
.node--type-text .main-content .section, 
.path-news .main-content .section, 
.node--type-news .main-content .section {
  max-width: 610px;
  margin: 0 auto;
}

.path-video h1.title, 
.path-text h1.title, 
.path-news h1.title {
  display: none;
  visibility: hidden;
}

.view-video .view-content, 
.view-text .view-content, 
.view-news .view-content {
  margin-top: -0.6rem;
}

.view-video .views-row, 
.view-text .views-row, 
.view-news .views-row {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* Gespeichert von Benutzername am Mi., 24.12.2008 - 00:00 */ 
.node .node__meta {
  margin-bottom: 20px;
}

.node .field--type-image {
  float: none;
}

.view-news .views-field-field-news-media img {
  max-width: 100%;
  height: auto;
}

.view-video .views-field, 
.view-text .views-field, 
.view-news .views-field {
  margin-bottom: 20px;
}

.view-video .views-field-title, 
.view-text .views-field-title, 
.view-news .views-field-title {
  margin-top: -6px;
}


@media all and (min-width: 768px) {

  .view-video .views-field, 
  .view-news .views-field {
    margin-left: 180px;
  }
  
  .view-video .views-field-field-video-media, 
  .view-news .views-field-field-news-media {
    margin-left: 0;
    float: left;
  }

}





/* ----- Werkgalerie n.v. -----
 */

.node--type-werkgalerie .block-page-title-block {
  display: none;
  visibility: hidden;
}



/* ----- Werkfoto -----
 */

.views-field-field-media-copyright, 
.field--name-field-media-copyright {
  color: #777;
  font-size: 0.7rem;
  margin-bottom: 1rem;
}

.views-field-field-media-beschreibung, 
.field--name-field-media-beschreibung {
  font-size: 0.85rem;
}



/* ----- Slick-Slide -----
 */

/* damit auch einzelnes Slide zentriert wird */
.slick,
.slick-wrapper {
  width: 100%;
}

@media all and (min-width: 768px) {

  .main-content {
    /* width = 12 spalten (100%) = 
       sidebar-left: 2 spalten (16.666%) + 
       sidebar-left: 2 spalten (16.666%) + 
       main-content: 8 spalten (66.666%) */
    max-width: 66.666%;
  }

}

.slide .views-field, 
.slide .field {
  width: 100%;
  text-align: center;
}

/* remove dotted outline around clicked element
 * https://stackoverflow.com/questions/13195081/how-to-remove-the-dotted-line-around-the-clicked-a-element-in-html
 * https://css-tricks.com/removing-the-dotted-outline/
 * https://www.tutorialrepublic.com/faq/how-to-remove-dotted-line-around-links-using-css.php
 *
 * MH: genau genommen ist a:focus die Property, die bei Klick aktiv wird 
 * und nach Schließen des Zoom-Images aktiv bleibt (gepunktete Linie um den Link des Bilds). 
 * a:focus Property übertrieben sichtbar machen: 
 * .slide .views-field-field-media-werkfoto a:focus {  outline: thick dotted;  }
 */
.slide .views-field-field-media-werkfoto a {
  outline: 0;
}

.slide .views-field-field-media-werkfoto img, 
.slide .field--type-image img {
  margin: 0 auto 0.2em;
}



/* damit Bilder bei Mobile nicht direkt aneinander grenzen */
.slide .views-field-field-media-werkfoto .field-content, 
.slide .field--type-image .field-content {
  border-left: 3px solid #ddd;
  border-right: 3px solid #ddd;
}



/* Abstand über Slide-Dots = 50px-25px = 25px  */
.slick-dots {
  bottom: -40px;  /* bottom: -25px; */
}

/* Slide-Dots verstecken */
.slick-dots li button:before, 
.slick-dots li.slick-active button:before, 
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 0;
}

/* Slide-Nummer sichtbar machen und stylen */
.slick-dots li button {
  padding: 0;
  font-size: 0.7em;
  color: #777;
}
.slick-dots li.slick-active button {
  color: #444;
  font-weight: bold;
}

.slick-dots li.slick-active {
  border-bottom: 2px solid #444;
}





/**
 * Skins.
 * Arrows contained/wrapped within slick__arrow for easy moves.
 */
/* Overrides problematic hidden arrows at core slick.css */
.slick-prev {
  left: auto;
  right: 30px;
}

.slick-next {
  right: 0;
}


.slick__arrow {
  top: -42px;
  margin-left: -13px;   /* Barrio 5 Update */
  margin-right: -13px;  /* Barrio 5 Update */
}

@media all and (min-width: 768px) {

  .slick__arrow {
    top: -65px;
    margin-left: -15px;   /* Barrio 5 Update */
    margin-right: -15px;  /* Barrio 5 Update */
  }

}

.slick-arrow {
  width: 24px;
}

.slick-arrow::before {
  color: rgba(119, 119, 119, .15);
  font-size: 24px;
  font-size: 1.5rem;
}

.slick-arrow:hover::before {
  color: rgba(119, 119, 119, .2);
}





/* Colorbox
 *
 * MH: Overwrites für Colorbox Core Style "Einfach (hauptsächlich für Bilder)"
 * modules/colorbox/styles/plain/colorbox_style.css
 */
 
#cboxOverlay {
  background: #fff;
}

#cboxContent,
.cboxPhoto {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

#cboxTitle {
  background: rgba(255, 255, 255, 0.4);
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

#cboxClose.cbox-close-plain {
  font-size: 0;
  background: rgba(119, 119, 119, 0.2) url("images/button_close_white.png") no-repeat center center;
  top: 10px;
  right: 10px;
}





/* ----- EU-Cookie-Compliance Banner Button -----
 */

/* Inhalt breiter (war zuvor max-width: 80%;) */
.eu-cookie-compliance-content {
  max-width: 100%;
  padding-left: 15px;
  padding-right: 15px;
  margin: 0 0 5px 0;
}

.eu-cookie-compliance-secondary-button {
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 2px solid #dcdcdc;
}

/* "Ausblenden"(/de)- bzw. "Hide"(/en)-Button nicht anzeigen */
.eu-cookie-compliance-banner .decline-button.eu-cookie-compliance-default-button {
  display: none;
  visibility: hidden;
}

/* Buttons schmaler (war zuvor max-width: 40%;) */
.eu-cookie-compliance-buttons {
  max-width: 12%;
}

/* Text breiter (war zuvor max-width: 60%;)
 * Mobile: Text volle Breite; Button unterhalb */
.eu-cookie-compliance-message {
  max-width: 100%;
}

@media all and (min-width: 768px) {

  /* Text breiter (war zuvor max-width: 60%;)
   * Desktop: Text nicht über volle Breite; Button daneben */
  .eu-cookie-compliance-message {
    max-width: 88%;
  }

}

.eu-cookie-compliance-message h1,
.eu-cookie-compliance-message h2,
.eu-cookie-compliance-message h3,
.eu-cookie-compliance-message p {
  margin: 5px 0 0 0;
  font-weight: normal;
  font-size: 16px;
}