@openeuropa/bcl-theme-joinup 0.16.0 → 0.17.0

package/css/oe-bcl-joinup.css

@@ -1,5 +1,28 @@
 @charset "UTF-8";
-@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap");
+@import "fonts/cyrillic-400.css";
+@import "fonts/latin-400.css";
+@import "fonts/latin-ext-400.css";
+@import "fonts/greek-400.css";
+@import "fonts/cyrillic-500.css";
+@import "fonts/latin-500.css";
+@import "fonts/latin-ext-500.css";
+@import "fonts/greek-500.css";
+@import "fonts/cyrillic-700.css";
+@import "fonts/latin-700.css";
+@import "fonts/latin-ext-700.css";
+@import "fonts/greek-700.css";
+@import "fonts/cyrillic-400-italic.css";
+@import "fonts/latin-400-italic.css";
+@import "fonts/latin-ext-400-italic.css";
+@import "fonts/greek-400-italic.css";
+@import "fonts/cyrillic-500-italic.css";
+@import "fonts/latin-500-italic.css";
+@import "fonts/latin-ext-500-italic.css";
+@import "fonts/greek-500-italic.css";
+@import "fonts/cyrillic-700-italic.css";
+@import "fonts/latin-700-italic.css";
+@import "fonts/latin-ext-700-italic.css";
+@import "fonts/greek-700-italic.css";
 .fs-sm,
 .fs-xs {
   color: #858a8c;
@@ -5514,6 +5537,69 @@ textarea.form-control-lg {
   color: #6c757d;
 }
 
+.placeholder {
+  display: inline-block;
+  min-height: 1em;
+  vertical-align: middle;
+  cursor: wait;
+  background-color: currentColor;
+  opacity: 0.5;
+}
+.placeholder.btn::before {
+  display: inline-block;
+  content: "";
+}
+
+.placeholder-xs {
+  min-height: 0.6em;
+}
+
+.placeholder-sm {
+  min-height: 0.8em;
+}
+
+.placeholder-lg {
+  min-height: 1.2em;
+}
+
+.placeholder-glow .placeholder {
+  -webkit-animation: placeholder-glow 2s ease-in-out infinite;
+          animation: placeholder-glow 2s ease-in-out infinite;
+}
+
+@-webkit-keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+
+@keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+.placeholder-wave {
+  -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+          mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+  -webkit-mask-size: 200% 100%;
+          mask-size: 200% 100%;
+  -webkit-animation: placeholder-wave 2s linear infinite;
+          animation: placeholder-wave 2s linear infinite;
+}
+
+@-webkit-keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+            mask-position: -200% 0%;
+  }
+}
+
+@keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+            mask-position: -200% 0%;
+  }
+}
 .pagination {
   display: -ms-flexbox;
   display: flex;
@@ -15714,6 +15800,7 @@ body {
   font-weight: 300;
   color: #fff;
   vertical-align: middle;
+  max-width: 80%;
 }
 
 .bcl-header .navbar-toggler {
@@ -15759,6 +15846,19 @@ body {
     -ms-flex-pack: right;
         justify-content: right;
   }
+
+  .bcl-header__navbar .navbar-collapse {
+    max-width: 100%;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown {
+    max-width: 100%;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown a {
+    white-space: normal;
+  }
+  .bcl-header__navbar .navbar-collapse .nav-item.dropdown .dropdown-menu {
+    max-width: 100%;
+  }
 }
 @media (min-width: 992px) {
   .bcl-header__project.light,