From 5d57f0e32a8fa779fa0ebf573ea24b00705ffb4a Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Wed, 12 Jun 2019 13:21:06 +0200 Subject: [PATCH] improved card header styling --- .../custom/materiotheme/assets/dist/main.js | 6 ++--- .../materiotheme/assets/styles/main.scss | 26 ++++++++++++++----- .../vuejs/components/Content/Card.vue | 1 + 3 files changed, 24 insertions(+), 9 deletions(-) diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js index 51aecc98..9377f515 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.js +++ b/web/themes/custom/materiotheme/assets/dist/main.js @@ -429,7 +429,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n name: \"Card\",\n props: ['item'],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\")\n };\n },\n directives: {\n lazy: {\n bind: function bind(img, binding) {\n // console.log('lazy bind', img, binding);\n if (binding.value === 0) {\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n }\n }\n },\n switcher: {\n inserted: function inserted(el, binding) {\n // switch images on mousemove\n el.addEventListener('mousemove', function (event) {\n var figs = this.querySelectorAll('figure'); // console.log('mousemove', this, event, figs.length);\n // let len = figs.length\n // let w = this.clientWidth;\n // let g = w / len;\n // let delta = Math.floor(event.layerX / g)\n\n var delta = Math.floor(event.layerX / (this.clientWidth / figs.length)); // console.log('delta', delta);\n\n figs.forEach(function (fig, index) {\n // console.log(index);\n if (index == delta) {\n fig.style.display = \"block\";\n } else {\n fig.style.display = \"none\";\n }\n });\n });\n }\n }\n },\n mounted: function mounted() {\n // lazy load images on mouseover\n this.$el.addEventListener('mouseover', function (event) {\n var imgs = this.querySelectorAll('.images figure img.lazy'); // console.log('mouseover', this, imgs);\n\n imgs.forEach(function (img) {\n // console.log('forEach img',img);\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n });\n }, {\n once: true\n });\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n name: \"Card\",\n props: ['item'],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\")\n };\n },\n directives: {\n lazy: {\n bind: function bind(img, binding) {\n // console.log('lazy bind', img, binding);\n if (binding.value === 0) {\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n }\n }\n },\n switcher: {\n inserted: function inserted(el, binding) {\n // switch images on mousemove\n el.addEventListener('mousemove', function (event) {\n var figs = this.querySelectorAll('figure'); // console.log('mousemove', this, event, figs.length);\n // let len = figs.length\n // let w = this.clientWidth;\n // let g = w / len;\n // let delta = Math.floor(event.layerX / g)\n\n var delta = Math.floor(event.layerX / (this.clientWidth / figs.length)); // console.log('delta', delta);\n\n figs.forEach(function (fig, index) {\n // console.log(index);\n if (index == delta) {\n fig.style.display = \"block\";\n } else {\n fig.style.display = \"none\";\n }\n });\n });\n }\n }\n },\n mounted: function mounted() {\n // lazy load images on mouseover\n this.$el.addEventListener('mouseover', function (event) {\n var imgs = this.querySelectorAll('.images figure img.lazy'); // console.log('mouseover', this, imgs);\n\n imgs.forEach(function (img) {\n // console.log('forEach img',img);\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n });\n }, {\n once: true\n });\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); /***/ }), @@ -488,7 +488,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { -eval("exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \"body {\\n background: white; }\\n\\na {\\n color: inherit;\\n text-decoration: none; }\\n\\na, a:focus, a:active {\\n outline: none; }\\n\\na:focus {\\n -moz-outline-style: none; }\\n\\n.col-1, .small-col-1, .med-col-1, .large-col-1, .col-2, .small-col-2, .med-col-2, .large-col-2, .col-3, .small-col-3, .med-col-3, .large-col-3, .col-4, .small-col-4, .med-col-4, .large-col-4, .col-5, .small-col-5, .med-col-5, .large-col-5, .col-6, .small-col-6, .med-col-6, .large-col-6, .col-7, .small-col-7, .med-col-7, .large-col-7, .col-8, .small-col-8, .med-col-8, .large-col-8, .col-9, .small-col-9, .med-col-9, .large-col-9, .col-10, .small-col-10, .med-col-10, .large-col-10, .col-11, .small-col-11, .med-col-11, .large-col-11, .col-12, .small-col-12, .med-col-12, .large-col-12, .col-1-offset-1, .col-1-offset-2, .col-1-offset-3, .col-1-offset-4, .col-1-offset-5, .col-1-offset-6, .col-1-offset-7, .col-1-offset-8, .col-1-offset-9, .col-1-offset-10, .col-1-offset-11, .col-2-offset-1, .col-2-offset-2, .col-2-offset-3, .col-2-offset-4, .col-2-offset-5, .col-2-offset-6, .col-2-offset-7, .col-2-offset-8, .col-2-offset-9, .col-2-offset-10, .col-3-offset-1, .col-3-offset-2, .col-3-offset-3, .col-3-offset-4, .col-3-offset-5, .col-3-offset-6, .col-3-offset-7, .col-3-offset-8, .col-3-offset-9, .col-4-offset-1, .col-4-offset-2, .col-4-offset-3, .col-4-offset-4, .col-4-offset-5, .col-4-offset-6, .col-4-offset-7, .col-4-offset-8, .col-5-offset-1, .col-5-offset-2, .col-5-offset-3, .col-5-offset-4, .col-5-offset-5, .col-5-offset-6, .col-5-offset-7, .col-6-offset-1, .col-6-offset-2, .col-6-offset-3, .col-6-offset-4, .col-6-offset-5, .col-6-offset-6, .col-7-offset-1, .col-7-offset-2, .col-7-offset-3, .col-7-offset-4, .col-7-offset-5, .col-8-offset-1, .col-8-offset-2, .col-8-offset-3, .col-8-offset-4, .col-9-offset-1, .col-9-offset-2, .col-9-offset-3, .col-10-offset-1, .col-10-offset-2, .col-11-offset-1 {\\n width: 100%;\\n float: left;\\n box-sizing: border-box; }\\n\\n.row {\\n position: relative; }\\n .row > * {\\n font-size: 16px; }\\n\\n.col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .col-1:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .small-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .med-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .large-col-1:last-child {\\n padding-right: 0; } }\\n\\n.col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .col-2:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .small-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .med-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .large-col-2:last-child {\\n padding-right: 0; } }\\n\\n.col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .col-3:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .small-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .med-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .large-col-3:last-child {\\n padding-right: 0; } }\\n\\n.col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .col-4:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .small-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .med-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .large-col-4:last-child {\\n padding-right: 0; } }\\n\\n.col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .col-5:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .small-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .med-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .large-col-5:last-child {\\n padding-right: 0; } }\\n\\n.col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .col-6:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .small-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .med-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .large-col-6:last-child {\\n padding-right: 0; } }\\n\\n.col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .col-7:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .small-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .med-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .large-col-7:last-child {\\n padding-right: 0; } }\\n\\n.col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .col-8:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .small-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .med-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .large-col-8:last-child {\\n padding-right: 0; } }\\n\\n.col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .col-9:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .small-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .med-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .large-col-9:last-child {\\n padding-right: 0; } }\\n\\n.col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .col-10:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .small-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .med-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .large-col-10:last-child {\\n padding-right: 0; } }\\n\\n.col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .col-11:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .small-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .med-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .large-col-11:last-child {\\n padding-right: 0; } }\\n\\n.col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .col-12:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .small-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .med-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .large-col-12:last-child {\\n padding-right: 0; } }\\n\\n.col-1-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 8.33333%;\\n width: 8.33333%; }\\n .col-1-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 8.33333%; }\\n .col-1-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 8.33333%; }\\n .col-1-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 8.33333%; }\\n .col-1-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 8.33333%; }\\n .col-1-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 8.33333%; }\\n .col-1-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 8.33333%; }\\n .col-1-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 8.33333%; }\\n .col-1-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 8.33333%; }\\n .col-1-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 8.33333%; }\\n .col-1-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-11 {\\n padding-left: 11em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 8.33333%; }\\n .col-1-offset-11:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 16.66667%; }\\n .col-2-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 16.66667%; }\\n .col-2-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 16.66667%; }\\n .col-2-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 16.66667%; }\\n .col-2-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 16.66667%; }\\n .col-2-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 16.66667%; }\\n .col-2-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 16.66667%; }\\n .col-2-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 16.66667%; }\\n .col-2-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 16.66667%; }\\n .col-2-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 16.66667%; }\\n .col-2-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 25%; }\\n .col-3-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 25%; }\\n .col-3-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 25%; }\\n .col-3-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 25%; }\\n .col-3-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 25%; }\\n .col-3-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 25%; }\\n .col-3-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 25%; }\\n .col-3-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 25%; }\\n .col-3-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 25%; }\\n .col-3-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 33.33333%; }\\n .col-4-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 33.33333%; }\\n .col-4-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 33.33333%; }\\n .col-4-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 33.33333%; }\\n .col-4-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 33.33333%; }\\n .col-4-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 33.33333%; }\\n .col-4-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 33.33333%; }\\n .col-4-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 33.33333%; }\\n .col-4-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 41.66667%; }\\n .col-5-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 41.66667%; }\\n .col-5-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 41.66667%; }\\n .col-5-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 41.66667%; }\\n .col-5-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 208.33333%;\\n width: 41.66667%; }\\n .col-5-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 41.66667%; }\\n .col-5-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 41.66667%; }\\n .col-5-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 50%; }\\n .col-6-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 50%; }\\n .col-6-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 50%; }\\n .col-6-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 50%; }\\n .col-6-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 50%; }\\n .col-6-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 300%;\\n width: 50%; }\\n .col-6-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 58.33333%; }\\n .col-7-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 58.33333%; }\\n .col-7-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 58.33333%; }\\n .col-7-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 58.33333%; }\\n .col-7-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 58.33333%; }\\n .col-7-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 66.66667%; }\\n .col-8-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 66.66667%; }\\n .col-8-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 66.66667%; }\\n .col-8-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 66.66667%; }\\n .col-8-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 75%; }\\n .col-9-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 75%; }\\n .col-9-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 75%; }\\n .col-9-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 83.33333%; }\\n .col-10-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 83.33333%; }\\n .col-10-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-11-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 91.66667%; }\\n .col-11-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col.float-right {\\n float: right;\\n padding-right: 0;\\n padding-left: 1em; }\\n\\nbody, html {\\n position: relative;\\n width: 100%;\\n height: 100%;\\n font-family: sans-serif;\\n font-style: normal;\\n margin: 0;\\n padding: 0; }\\n\\nbody.toolbar-horizontal.toolbar-themes.toolbar-no-tabs {\\n padding-top: 24px !important; }\\n\\nheader[role=\\\"banner\\\"] {\\n background-color: #fff;\\n overflow: visible;\\n position: fixed;\\n z-index: 10;\\n width: 100vw;\\n height: 80px; }\\n header[role=\\\"banner\\\"] .wrapper .header-block {\\n min-height: 15px;\\n font-size: 0; }\\n header[role=\\\"banner\\\"] .wrapper .header-block.header-right {\\n text-align: right; }\\n header[role=\\\"banner\\\"] .wrapper .header-block > * {\\n display: inline-block;\\n vertical-align: top;\\n font-size: 16px;\\n text-align: left; }\\n\\nmain[role=\\\"main\\\"] {\\n padding-top: 80px; }\\n\\nbody {\\n font-size: 16px;\\n font-family: \\\"Ubuntu\\\",Arial,\\\"MS Trebuchet\\\",sans-serif;\\n font-weight: 500;\\n font-style: normal;\\n line-height: 1.3; }\\n\\naside.messages {\\n border: none; }\\n\\nheader[role=\\\"banner\\\"] {\\n padding: 0.2em 0 0 0; }\\n header[role=\\\"banner\\\"] #block-sitebranding h1 {\\n margin: 0;\\n line-height: 1; }\\n header[role=\\\"banner\\\"] #block-userlogin {\\n position: relative;\\n width: 8em;\\n overflow: visible; }\\n header[role=\\\"banner\\\"] #block-userlogin h2 {\\n margin: 0;\\n font-size: 1em;\\n font-weight: 400; }\\n header[role=\\\"banner\\\"] #block-userlogin > section {\\n background-color: #fff;\\n overflow: hidden;\\n width: 11em;\\n height: 1px;\\n padding: 0.01em 1em;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out;\\n transition-delay: 2s;\\n position: absolute;\\n right: 0;\\n top: 1.7em;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin:hover > section {\\n transition-delay: 0s;\\n height: 12em;\\n padding: 1em 1em;\\n box-shadow: 0 0 10px #ccc; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item {\\n margin: 0;\\n position: relative;\\n width: 100%; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name {\\n margin: 2px 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass {\\n margin: 0 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login label {\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-userlogin #edit-actions {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li {\\n list-style: none;\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li a {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-languageswitcher h2 {\\n margin: 0.1em 0 0 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.1em 0.4em 0.2em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff;\\n display: inline-block;\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-languageswitcher > ul.links {\\n overflow: hidden;\\n width: 5em;\\n height: 1px;\\n padding: 0.01em 0;\\n margin: 0;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out; }\\n header[role=\\\"banner\\\"] #block-languageswitcher:hover > ul.links {\\n transition-delay: 0s;\\n height: 2em;\\n padding: 0.3em 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li {\\n list-style: none;\\n padding: 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li.is-active {\\n display: none; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li a {\\n margin: 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.2em 0.4em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff; }\\n\\naside.messages {\\n padding: 0; }\\n\\n#materio-sapi-search-form .form-item, #materio-sapi-search-form input.button {\\n display: inline-block; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-a-database:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-showrooms:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-blabla:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-pricing:not(:nth-child(1)) {\\n margin-top: 1em; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-a-database .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-showrooms .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-blabla .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-pricing .field__label {\\n font-size: 2.2em;\\n font-weight: bold; }\\n\\narticle.node--type-frontpage .node__content .field--name-computed-materials-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-showrooms-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-articles-reference .field__item {\\n display: inline-block;\\n vertical-align: top;\\n max-width: 250px; }\\n\\n.infinite-loading-container .infinite-status-prompt i[class^=\\\"loading-\\\"] {\\n width: 15px;\\n height: 15px; }\\n\\n.cards-list > ul {\\n margin: 0;\\n padding: 0; }\\n .cards-list > ul > li {\\n list-style: none;\\n margin: 0 1em 1em 0;\\n padding: 0;\\n display: inline-block;\\n vertical-align: top; }\\n\\n.card {\\n position: relative;\\n width: 210px;\\n height: 295px; }\\n .card header {\\n position: absolute;\\n bottom: 0;\\n z-index: 10;\\n color: #fff;\\n background-color: rgba(0, 0, 0, 0.5);\\n width: 100%; }\\n .card header h1, .card header h4 {\\n margin: 0;\\n padding: 0; }\\n .card header h1 {\\n font-size: 1.5em; }\\n .card header h4 {\\n font-size: 1em;\\n font-weight: normal; }\\n .card section.images {\\n position: relative; }\\n .card section.images, .card section.images * {\\n width: 100%;\\n height: 100%; }\\n .card section.images figure {\\n margin: 0;\\n position: absolute;\\n top: 0;\\n left: 0; }\\n .card section.images figure:first-of-type {\\n z-index: 5; }\\n .card section.images figure img.blank {\\n position: absolute;\\n top: 0;\\n left: 0;\\n z-index: 20; }\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/styles/main.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js"); +eval("exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \"body {\\n background: white; }\\n\\na {\\n color: inherit;\\n text-decoration: none; }\\n\\na, a:focus, a:active {\\n outline: none; }\\n\\na:focus {\\n -moz-outline-style: none; }\\n\\n.col-1, .small-col-1, .med-col-1, .large-col-1, .col-2, .small-col-2, .med-col-2, .large-col-2, .col-3, .small-col-3, .med-col-3, .large-col-3, .col-4, .small-col-4, .med-col-4, .large-col-4, .col-5, .small-col-5, .med-col-5, .large-col-5, .col-6, .small-col-6, .med-col-6, .large-col-6, .col-7, .small-col-7, .med-col-7, .large-col-7, .col-8, .small-col-8, .med-col-8, .large-col-8, .col-9, .small-col-9, .med-col-9, .large-col-9, .col-10, .small-col-10, .med-col-10, .large-col-10, .col-11, .small-col-11, .med-col-11, .large-col-11, .col-12, .small-col-12, .med-col-12, .large-col-12, .col-1-offset-1, .col-1-offset-2, .col-1-offset-3, .col-1-offset-4, .col-1-offset-5, .col-1-offset-6, .col-1-offset-7, .col-1-offset-8, .col-1-offset-9, .col-1-offset-10, .col-1-offset-11, .col-2-offset-1, .col-2-offset-2, .col-2-offset-3, .col-2-offset-4, .col-2-offset-5, .col-2-offset-6, .col-2-offset-7, .col-2-offset-8, .col-2-offset-9, .col-2-offset-10, .col-3-offset-1, .col-3-offset-2, .col-3-offset-3, .col-3-offset-4, .col-3-offset-5, .col-3-offset-6, .col-3-offset-7, .col-3-offset-8, .col-3-offset-9, .col-4-offset-1, .col-4-offset-2, .col-4-offset-3, .col-4-offset-4, .col-4-offset-5, .col-4-offset-6, .col-4-offset-7, .col-4-offset-8, .col-5-offset-1, .col-5-offset-2, .col-5-offset-3, .col-5-offset-4, .col-5-offset-5, .col-5-offset-6, .col-5-offset-7, .col-6-offset-1, .col-6-offset-2, .col-6-offset-3, .col-6-offset-4, .col-6-offset-5, .col-6-offset-6, .col-7-offset-1, .col-7-offset-2, .col-7-offset-3, .col-7-offset-4, .col-7-offset-5, .col-8-offset-1, .col-8-offset-2, .col-8-offset-3, .col-8-offset-4, .col-9-offset-1, .col-9-offset-2, .col-9-offset-3, .col-10-offset-1, .col-10-offset-2, .col-11-offset-1 {\\n width: 100%;\\n float: left;\\n box-sizing: border-box; }\\n\\n.row {\\n position: relative; }\\n .row > * {\\n font-size: 16px; }\\n\\n.col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .col-1:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .small-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .med-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .large-col-1:last-child {\\n padding-right: 0; } }\\n\\n.col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .col-2:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .small-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .med-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .large-col-2:last-child {\\n padding-right: 0; } }\\n\\n.col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .col-3:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .small-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .med-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .large-col-3:last-child {\\n padding-right: 0; } }\\n\\n.col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .col-4:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .small-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .med-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .large-col-4:last-child {\\n padding-right: 0; } }\\n\\n.col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .col-5:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .small-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .med-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .large-col-5:last-child {\\n padding-right: 0; } }\\n\\n.col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .col-6:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .small-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .med-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .large-col-6:last-child {\\n padding-right: 0; } }\\n\\n.col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .col-7:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .small-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .med-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .large-col-7:last-child {\\n padding-right: 0; } }\\n\\n.col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .col-8:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .small-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .med-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .large-col-8:last-child {\\n padding-right: 0; } }\\n\\n.col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .col-9:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .small-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .med-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .large-col-9:last-child {\\n padding-right: 0; } }\\n\\n.col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .col-10:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .small-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .med-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .large-col-10:last-child {\\n padding-right: 0; } }\\n\\n.col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .col-11:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .small-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .med-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .large-col-11:last-child {\\n padding-right: 0; } }\\n\\n.col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .col-12:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .small-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .med-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .large-col-12:last-child {\\n padding-right: 0; } }\\n\\n.col-1-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 8.33333%;\\n width: 8.33333%; }\\n .col-1-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 8.33333%; }\\n .col-1-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 8.33333%; }\\n .col-1-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 8.33333%; }\\n .col-1-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 8.33333%; }\\n .col-1-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 8.33333%; }\\n .col-1-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 8.33333%; }\\n .col-1-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 8.33333%; }\\n .col-1-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 8.33333%; }\\n .col-1-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 8.33333%; }\\n .col-1-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-11 {\\n padding-left: 11em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 8.33333%; }\\n .col-1-offset-11:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 16.66667%; }\\n .col-2-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 16.66667%; }\\n .col-2-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 16.66667%; }\\n .col-2-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 16.66667%; }\\n .col-2-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 16.66667%; }\\n .col-2-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 16.66667%; }\\n .col-2-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 16.66667%; }\\n .col-2-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 16.66667%; }\\n .col-2-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 16.66667%; }\\n .col-2-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 16.66667%; }\\n .col-2-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 25%; }\\n .col-3-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 25%; }\\n .col-3-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 25%; }\\n .col-3-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 25%; }\\n .col-3-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 25%; }\\n .col-3-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 25%; }\\n .col-3-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 25%; }\\n .col-3-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 25%; }\\n .col-3-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 25%; }\\n .col-3-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 33.33333%; }\\n .col-4-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 33.33333%; }\\n .col-4-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 33.33333%; }\\n .col-4-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 33.33333%; }\\n .col-4-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 33.33333%; }\\n .col-4-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 33.33333%; }\\n .col-4-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 33.33333%; }\\n .col-4-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 33.33333%; }\\n .col-4-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 41.66667%; }\\n .col-5-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 41.66667%; }\\n .col-5-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 41.66667%; }\\n .col-5-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 41.66667%; }\\n .col-5-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 208.33333%;\\n width: 41.66667%; }\\n .col-5-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 41.66667%; }\\n .col-5-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 41.66667%; }\\n .col-5-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 50%; }\\n .col-6-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 50%; }\\n .col-6-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 50%; }\\n .col-6-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 50%; }\\n .col-6-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 50%; }\\n .col-6-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 300%;\\n width: 50%; }\\n .col-6-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 58.33333%; }\\n .col-7-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 58.33333%; }\\n .col-7-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 58.33333%; }\\n .col-7-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 58.33333%; }\\n .col-7-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 58.33333%; }\\n .col-7-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 66.66667%; }\\n .col-8-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 66.66667%; }\\n .col-8-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 66.66667%; }\\n .col-8-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 66.66667%; }\\n .col-8-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 75%; }\\n .col-9-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 75%; }\\n .col-9-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 75%; }\\n .col-9-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 83.33333%; }\\n .col-10-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 83.33333%; }\\n .col-10-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-11-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 91.66667%; }\\n .col-11-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col.float-right {\\n float: right;\\n padding-right: 0;\\n padding-left: 1em; }\\n\\nbody, html {\\n position: relative;\\n width: 100%;\\n height: 100%;\\n font-family: sans-serif;\\n font-style: normal;\\n margin: 0;\\n padding: 0; }\\n\\nbody.toolbar-horizontal.toolbar-themes.toolbar-no-tabs {\\n padding-top: 24px !important; }\\n\\nheader[role=\\\"banner\\\"] {\\n background-color: #fff;\\n overflow: visible;\\n position: fixed;\\n z-index: 10;\\n width: 100vw;\\n height: 80px; }\\n header[role=\\\"banner\\\"] .wrapper .header-block {\\n min-height: 15px;\\n font-size: 0; }\\n header[role=\\\"banner\\\"] .wrapper .header-block.header-right {\\n text-align: right; }\\n header[role=\\\"banner\\\"] .wrapper .header-block > * {\\n display: inline-block;\\n vertical-align: top;\\n font-size: 16px;\\n text-align: left; }\\n\\nmain[role=\\\"main\\\"] {\\n padding-top: 80px; }\\n\\nbody {\\n font-size: 16px;\\n font-family: \\\"Ubuntu\\\",Arial,\\\"MS Trebuchet\\\",sans-serif;\\n font-weight: 500;\\n font-style: normal;\\n line-height: 1.3; }\\n\\naside.messages {\\n border: none; }\\n\\nheader[role=\\\"banner\\\"] {\\n padding: 0.2em 0 0 0; }\\n header[role=\\\"banner\\\"] #block-sitebranding h1 {\\n margin: 0;\\n line-height: 1; }\\n header[role=\\\"banner\\\"] #block-userlogin {\\n position: relative;\\n width: 8em;\\n overflow: visible; }\\n header[role=\\\"banner\\\"] #block-userlogin h2 {\\n margin: 0;\\n font-size: 1em;\\n font-weight: 400; }\\n header[role=\\\"banner\\\"] #block-userlogin > section {\\n background-color: #fff;\\n overflow: hidden;\\n width: 11em;\\n height: 1px;\\n padding: 0.01em 1em;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out;\\n transition-delay: 2s;\\n position: absolute;\\n right: 0;\\n top: 1.7em;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin:hover > section {\\n transition-delay: 0s;\\n height: 12em;\\n padding: 1em 1em;\\n box-shadow: 0 0 10px #ccc; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item {\\n margin: 0;\\n position: relative;\\n width: 100%; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name {\\n margin: 2px 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass {\\n margin: 0 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login label {\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-userlogin #edit-actions {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li {\\n list-style: none;\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li a {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-languageswitcher h2 {\\n margin: 0.1em 0 0 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.1em 0.4em 0.2em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff;\\n display: inline-block;\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-languageswitcher > ul.links {\\n overflow: hidden;\\n width: 5em;\\n height: 1px;\\n padding: 0.01em 0;\\n margin: 0;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out; }\\n header[role=\\\"banner\\\"] #block-languageswitcher:hover > ul.links {\\n transition-delay: 0s;\\n height: 2em;\\n padding: 0.3em 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li {\\n list-style: none;\\n padding: 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li.is-active {\\n display: none; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li a {\\n margin: 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.2em 0.4em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff; }\\n\\naside.messages {\\n padding: 0; }\\n\\n#materio-sapi-search-form .form-item, #materio-sapi-search-form input.button {\\n display: inline-block; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-a-database:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-showrooms:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-blabla:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-pricing:not(:nth-child(1)) {\\n margin-top: 1em; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-a-database .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-showrooms .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-blabla .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-pricing .field__label {\\n font-size: 2.2em;\\n font-weight: bold; }\\n\\narticle.node--type-frontpage .node__content .field--name-computed-materials-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-showrooms-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-articles-reference .field__item {\\n display: inline-block;\\n vertical-align: top;\\n max-width: 250px; }\\n\\n.infinite-loading-container .infinite-status-prompt i[class^=\\\"loading-\\\"] {\\n width: 15px;\\n height: 15px; }\\n\\n.cards-list > ul {\\n margin: 0;\\n padding: 0; }\\n .cards-list > ul > li {\\n list-style: none;\\n margin: 0 1em 1em 0;\\n padding: 0;\\n display: inline-block;\\n vertical-align: top; }\\n\\n.card {\\n position: relative;\\n width: 210px;\\n height: 295px;\\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }\\n .card header {\\n position: absolute;\\n bottom: 0;\\n z-index: 10;\\n color: #000;\\n background-color: rgba(255, 255, 255, 0.8);\\n padding: 0.3em 0.3em;\\n box-sizing: border-box;\\n width: 100%; }\\n .card header h1, .card header h4 {\\n margin: 0;\\n padding: 0; }\\n .card header h1 {\\n font-size: 1.3em;\\n font-weight: 700;\\n line-height: 0.8;\\n margin-bottom: 0.2em; }\\n .card header h4 {\\n font-size: 0.882em;\\n font-weight: 300;\\n line-height: 1; }\\n .card header span.ref {\\n font-size: 0.693em;\\n font-weight: 300;\\n line-height: 1; }\\n .card section.images {\\n position: relative; }\\n .card section.images, .card section.images * {\\n width: 100%;\\n height: 100%; }\\n .card section.images figure {\\n margin: 0;\\n position: absolute;\\n top: 0;\\n left: 0; }\\n .card section.images figure:first-of-type {\\n z-index: 5; }\\n .card section.images figure img.blank {\\n position: absolute;\\n top: 0;\\n left: 0;\\n z-index: 20; }\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/styles/main.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js"); /***/ }), @@ -661,7 +661,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) * /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { staticClass: \"card\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"h4\", [_vm._v(_vm._s(_vm.item.description))])\n ]),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { staticClass: \"card\" }, [\n _c(\"header\", [\n _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))]),\n _vm._v(\" \"),\n _c(\"h4\", [_vm._v(_vm._s(_vm.item.description))]),\n _vm._v(\" \"),\n _c(\"span\", { staticClass: \"ref\" }, [_vm._v(_vm._s(_vm.item.reference))])\n ]),\n _vm._v(\" \"),\n _c(\n \"section\",\n {\n directives: [{ name: \"switcher\", rawName: \"v-switcher\" }],\n staticClass: \"images\"\n },\n _vm._l(_vm.item.images, function(img, index) {\n return _c(\"figure\", { key: img.url }, [\n _c(\"img\", {\n directives: [\n {\n name: \"lazy\",\n rawName: \"v-lazy\",\n value: index,\n expression: \"index\"\n }\n ],\n staticClass: \"lazy\",\n attrs: { \"data-src\": img.url, title: img.title }\n }),\n _vm._v(\" \"),\n _c(\"img\", { staticClass: \"blank\", attrs: { src: _vm.blanksrc } })\n ])\n }),\n 0\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options"); /***/ }), diff --git a/web/themes/custom/materiotheme/assets/styles/main.scss b/web/themes/custom/materiotheme/assets/styles/main.scss index 4f5009db..bd48c863 100644 --- a/web/themes/custom/materiotheme/assets/styles/main.scss +++ b/web/themes/custom/materiotheme/assets/styles/main.scss @@ -241,22 +241,36 @@ article.node--type-frontpage{ .card{ position: relative; width:210px; height:295px; + box-shadow: 0 0 5px rgba(0,0,0,0.2); + // focused + // box-shadow: 0 0 7px rgba(0,0,0,0.9); header{ position: absolute; bottom:0; z-index:10; - color: #fff; - background-color: rgba(0,0,0,0.5); + color: #000; + background-color: rgba(255,255,255,0.8); + padding: 0.3em 0.3em; + box-sizing:border-box; width:100%; h1, h4{ margin:0; padding:0; } h1{ - font-size: 1.5em; + font-size: 1.3em; + font-weight: 700; + line-height: 0.8; + margin-bottom: 0.2em; } h4{ - font-size: 1em; - font-weight: normal; + font-size: 0.882em; + font-weight: 300; + line-height: 1; + // margin-bottom: 0.1em; + } + span.ref{ + font-size: 0.693em; + font-weight: 300; + line-height: 1; } - } section.images{ position: relative; diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue index eb393e38..3fc46f71 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue @@ -3,6 +3,7 @@

{{ item.title }}

{{ item.description }}

+ {{ item.reference }}