/*@import url(font-awesome.min.css);*/ /* Reset */ *, *:after, *:before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0;} html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body {line-height: 1;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} table {border-collapse: collapse; border-spacing: 0;} body {-webkit-text-size-adjust: none;} /* Box Model */ *, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} /* Clearfix */ .clearfix:before {content: " "; display: table;} .clearfix:after {clear: both; content: " "; display: table;} /* Remove background color autofil */ input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;} input {filter: none;} /* Basic */ html { font-size: 62.5%; } @-ms-viewport {width: device-width;} body {-ms-overflow-style: scrollbar;} @media screen and (max-width: 480px) { html, body { min-width: 320px; } } body {background: #ffffff;} body.is-loading *, body.is-loading *:before, body.is-loading *:after {-moz-animation: none !important; -webkit-animation: none !important; -ms-animation: none !important; animation: none !important;-moz-transition: none !important; -webkit-transition: none !important; -ms-transition: none !important; transition: none !important;} /* Type */ body {color: #000; -webkit-font-feature-settings: "lnum"; -moz-font-feature-settings: "lnum"; -ms-font-feature-settings: "lnum"; -o-font-feature-settings: "lnum"; font-feature-settings: "lnum";} body, input, select, option, textarea {font-family: "futura-pt",sans-serif; font-size: 20px; font-size: 2rem; font-weight: 400; line-height: 1.75; /*letter-spacing: 0.025em;*/} option {font-size: 1.4rem;} @media screen and (max-width: 1680px) { body, input, select, textarea { font-size: 20px; font-size: 2rem; } } @media screen and (max-width: 1280px) { body, input, select, textarea { font-size: 18px; font-size: 1.8rem; } ::-webkit-input-placeholder {font-size: 18px; font-size: 1.8rem;} :-moz-placeholder {font-size: 18px; font-size: 1.8rem;} ::-moz-placeholder {font-size: 18px; font-size: 1.8rem;} :-ms-input-placeholder {font-size: 18px; font-size: 1.8rem;} } @media screen and (max-width: 980px) { body, input, select, textarea { font-size: 18px; font-size: 1.8rem; } } @media screen and (max-width: 736px) { body, input, select, textarea { font-size: 18px; font-size: 1.8rem; } } @media screen and (max-width: 480px) { body, input, select, textarea { font-size: 18px; font-size: 1.8rem; line-height: 1.3; } } @media screen and (max-width: 360px) { body, input, select, textarea { font-size: 18px; font-size: 1.8rem; } ::-webkit-input-placeholder {font-size: 18px; font-size: 1.8rem;} :-moz-placeholder {font-size: 18px; font-size: 1.8rem;} ::-moz-placeholder {font-size: 18px; font-size: 1.8rem;} :-ms-input-placeholder {font-size: 18px; font-size: 1.8rem;} } input, select, textarea {color: inherit;} a {-moz-transition: border-bottom-color 0.2s ease; -webkit-transition: border-bottom-color 0.2s ease; -ms-transition: border-bottom-color 0.2s ease; transition: border-bottom-color 0.2s ease; color: inherit; text-decoration: none !important; border-bottom: 1px solid #000;} a:hover {border-bottom-color: transparent; color:#f90;} strong, b {color: inherit; font-weight: 600;} em, i {font-style: italic;} p {margin: 0 0 1em 0;} p.caption {margin-top:-30px;} h1, h2, h3, h4, h5, h6 {color: inherit; font-weight: 600; line-height: 1.3; margin: 0 0 1rem 0; text-transform:uppercase; letter-spacing: 0.01em;} h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit; text-decoration: none;} @media screen and (max-width: 1280px) { h1, h2, h3, h4, h5, h6 { margin: 0 0 1.4rem 0; } } @media screen and (max-width: 736px) { h1, h2, h3, h4, h5, h6 { margin: 0 0 1.25rem 0; } } h1 {font-size: 2.4em; line-height: 1.1; margin: 0 0 1.5rem 0; /*letter-spacing: 0.025em;*/}/*48px*/ h1.home-title {font-weight: 400;} @media screen and (max-width: 736px) { h1 { font-size: 2.0em; /*48px*/ line-height: 1.3; margin: 0 0 1rem 0; word-break: break-word; } h1.home-title { word-break:initial; } } h2 {font-size: 1.8em; line-height: 1.3;} /*36px*/ @media screen and (max-width: 1280px) { h2 { font-size: 1.8em; } } @media screen and (max-width: 736px) { h2 { font-size: 1.5em; line-height: 1.5; } } h3 {font-size: 1.5em;} /*30px*/ @media screen and (max-width: 736px) { h3 { font-size: 1.3em; } } h4 {font-size: 1.2em;} /*24px*/ @media screen and (max-width: 736px) { h4 { font-size: 1.2em; } } h5 {font-size: 0.9em;} h6 {font-size: 0.7em;} sub {font-size: 0.8em; position: relative; top: 0.5em;} sup {font-size: 0.8em; position: relative; top: -0.5em;} blockquote {border-left: solid 4px; font-style: italic; margin: 0 0 2em 0; padding: 0.5em 0 0.5em 2em;} code {border-radius: 0.5rem; font-family: "Courier New", monospace; font-size: 0.9em; margin: 0 0.25em; padding: 0.25em 0.65em;} pre {-webkit-overflow-scrolling: touch; font-family: "Courier New", monospace; font-size: 0.9em; margin: 0 0 2em 0;} pre code {display: block; padding: 1em 1.5em; overflow-x: auto;} hr {border: 0; border-bottom: solid 1px; margin: 3em 0;} hr.major {margin: 5em 0;} .align-left {text-align: left;} .align-center, .text-center {text-align: center;} .align-right {text-align: right;} blockquote {border-left-color: rgba(86, 86, 86, 0.25);} hr {border-bottom-color: rgba(86, 86, 86, 0.25);} code {background: rgba(86, 86, 86, 0.075);} img{display:block;} .img-fluid {margin-bottom: 30px; width: 100%;} /* Box */ .box {border-radius: 0.5rem; border: solid 1px; margin-bottom: 2em; padding: 1.5em;} .box > :last-child, .box.alt {border: 0; border-radius: 0; padding: 0;} /* Button */ input[type="submit"], input[type="reset"], input[type="button"], button, .button { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; /*border-radius: 0.5rem;*/ border-style: solid; border-width: 2px !important; border-color: inherit !important; color: inherit !important; cursor: pointer; display: inline-block; font-weight: 600; font-size: 0.8em; height: auto; line-height: 2.100em; /*border-radius: 4.28571em;*/ padding: 0 2.85714em; text-align: center; text-decoration: none; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.05em; } .button.small {height: 2.28571em; line-height: 2.28571em; /*border-radius: 2.28571em;*/} input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover, .button:hover {border: solid 1px;} input[type="submit"].icon:before, input[type="reset"].icon:before, input[type="button"].icon:before, button.icon:before, .button.icon:before {margin-right: 0.5em;} input[type="submit"].fit, input[type="reset"].fit, input[type="button"].fit, button.fit, .button.fit {display: block; margin: 0 0 1em 0; width: 100%;} input[type="submit"].big, input[type="reset"].big, input[type="button"].big, button.big, .button.big {font-size: 0.85em; height: auto; line-height: 2.100em; padding: 0 2.5em;} input[type="submit"].small, input[type="reset"].small, input[type="button"].small, button.small, .button.small {font-size: 0.6em; height: auto; line-height: 2.100em; padding: 0 2.5em;} input[type="submit"].disabled, input[type="submit"]:disabled, input[type="reset"].disabled, input[type="reset"]:disabled, input[type="button"].disabled, input[type="button"]:disabled, button.disabled, button:disabled, .button.disabled, .button:disabled {-moz-pointer-events: none; -webkit-pointer-events: none; -ms-pointer-events: none; pointer-events: none; opacity: 0.25;} input[type="submit"], input[type="reset"], input[type="button"], button, .button {background-color: transparent;} input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover, .button:hover {background-color: rgba(86, 86, 86, 0.075);} input[type="submit"].special, input[type="reset"].special, input[type="button"].special, button.special, .button.special {background-color: #000; border-color: #000; color: #ffffff !important;} input[type="submit"].special:hover, input[type="reset"].special:hover, input[type="button"].special:hover, button.special:hover, .button.special:hover {background-color: rgba(86, 86, 86, 0.075); color: inherit !important;} @media screen and (max-width: 767px) { input[type="submit"], button, .button {white-space:normal; line-height:1.3em !important; padding: 1em !important; height: auto !important; /*background-color: rgba(86, 86, 86, 0.1);*/} } /* Form */ form {margin: 0 0 2em 0;} form:after {content: ''; display: block; clear: both; height: 1px;} form .field {position: relative; float: left; margin: 0 0 1.25em 0; vertical-align: top; width: 100%;} form .half {width: calc(50% + 0.625em) !important; padding-left: 1.25em;} form .half.first {width: calc(50% - 0.625em) !important; padding-left: 0;} form :last-child {margin-bottom: 0;} form .half:nth-last-child(2) {margin-bottom: 0;} form .actions {position: relative; clear: both; margin-bottom: 0 !important;} @supports (-ms-ime-align:auto) and (-webkit-mask: url()) { form .half {width:100% !important; padding-left: 0 !important;} form .half.first {width:100% !important; padding-left: 0!important;} } form .center, #wrapper .center {position: relative; margin:0 auto 1.25em auto; vertical-align: top; width: 60%;} @media screen and (max-width: 1380px) { @supports (-ms-ime-align:auto) { form .half {width:100% !important; padding-left: 0 !important;} form .half.first {width:100% !important; padding-left: 0!important;} } } @media screen and (max-width: 480px) { form .half {width: 100% !important; padding-left: 0;} form .half.first {width: 100% !important; padding-left: 0;} form .half:nth-last-child(2) {margin: 0 0 1.3em 0;} form .center {width: 90% !important;} } label {color: inherit; display: block; font-size: 0.9em; font-weight: 400; margin: 0 0 1em 0;} input[type="text"], input[type="password"], input[type="email"], select, textarea {-moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; /*border-radius: 4.28571em;*/ border: none; border: solid 1px; color: inherit; display: block; outline: 0; padding: 0 2em; text-decoration: none; width: 100%;} input[type="text"]:invalid, input[type="password"]:invalid, input[type="email"]:invalid, select:invalid, textarea:invalid {box-shadow: none;} .select-wrapper {text-decoration: none; display: block; position: relative;} .select-wrapper:before {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important;} .select-wrapper:before {content: '\f078'; display: block; height: 3em; line-height: 3em; pointer-events: none; position: absolute; right: 0; text-align: center; top: 0; width: 3em;} .select-wrapper select::-ms-expand {display: none;} input[type="text"], input[type="password"], input[type="email"], select {height: 3.5em;} textarea {padding: 0.75em 2em;} /* Checka radiobuttons */ ::-webkit-input-placeholder {color: inherit !important; opacity: 0.5;} :-moz-placeholder {color: inherit !important; opacity: 0.5;} ::-moz-placeholder {color: inherit !important; opacity: 0.5;} :-ms-input-placeholder {color: inherit !important; opacity: 0.5;} .select-wrapper:before {color: rgba(86, 86, 86, 0.25);} input[type="text"], input[type="password"], input[type="email"], select, textarea {background: #ffffff; border-color: rgba(86, 86, 86, 0.25);} input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, select:focus, textarea:focus {border-color: #000; box-shadow: 0 0 0 1px #000;} .radio, .checkbox {width: 100%; margin-bottom: 15px !important;} [type="radio"]:checked, [type="radio"]:not(:checked), [type="Checkbox"]:checked, [type="Checkbox"]:not(:checked) {position: absolute;left: -9999px;} [type="radio"]:checked + label, [type="radio"]:not(:checked) + label, [type="Checkbox"]:checked + label, [type="Checkbox"]:not(:checked) + label {position: relative; padding-left: 2.5em; cursor: pointer; color: inherit; font-weight: 400; text-align:left;} [type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before, [type="Checkbox"]:checked + label:before, [type="Checkbox"]:not(:checked) + label:before {content: ''; position: absolute; display: inline-block; left: 0; top: 0; width: 1.8em; height: 1.8em; border-radius: 100%; background: #fff; border: 1px solid #000;} [type="Checkbox"]:checked + label:before, [type="Checkbox"]:not(:checked) + label:before {border-radius: 0% !important;} [type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after, [type="Checkbox"]:checked + label:after, [type="Checkbox"]:not(:checked) + label:after {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; /*content: '';*/ width: 1.8em; height: 1.8em; position: absolute; display: inline-block; top: 0; left: 0; border-radius: 100%; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; content: '\f00c'; color:#fff; background-color:#000; padding-left:8px;} [type="Checkbox"]:checked + label:after, [type="Checkbox"]:not(:checked) + label:after {border-radius: 0% !important;} [type="radio"]:not(:checked) + label:after, [type="Checkbox"]:not(:checked) + label:after {opacity: 0; -webkit-transform: scale(0); transform: scale(0);} input.input-validation-error { border-color: #f90;} span.field-validation-error {color:#f90; text-align:left;} @media screen and (max-width: 1280px) { label { font-size: 18px; font-size: 1.8rem; } } @media screen and (max-width: 767px) { [type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after, [type="Checkbox"]:checked + label:after, [type="Checkbox"]:not(:checked) + label:after {padding-top:5px;} .radio, .checkbox {margin-bottom: 25px !important;} } /* Icon */ .icon {text-decoration: none; position: relative; border-bottom-width: 0;} .icon:before {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important;} .icon > .label {display: none;} /* Image */ .image {border-radius: 0.5rem; border: 0; display: inline-block; position: relative;} .image img {/*border-radius: 0.5rem;*/ display: block;} .image.left, .image.right {max-width: 40%;} .image.left img, .image.right img {width: 100%;} .image.left {float: left; margin: 0 1.5em 1em 0; top: 0.25em;} .image.right {float: right; margin: 0 0 1em 1.5em; top: 0.25em;} .image.fit {display: block; margin: 0 0 2em 0; width: 100%;} .image.fit img {width: 100%;} .image.main {display: block; margin: 0 0 3em 0; width: 100%;} .image.main img {width: 100%;} /* List */ ol {list-style: decimal; margin: 0 0 2em 0; padding-left: 1.25em;} ol li {padding-left: 0.25em;} ul {list-style: disc; margin: 0 0 2em 0; padding-left: 1em;} ul li {padding-left: 0.5em;} ul.alt {list-style: none; padding-left: 0;} ul.alt li {border-top: solid 1px; padding: 0.5em 0;} ul.alt li:first-child {border-top: 0; padding-top: 0;} ul.icons {cursor: default; list-style: none; padding-left: 0;} ul.icons li {position: relative; display: inline-block; padding: 0 1em 0 0;} ul.icons li:last-child {padding-right: 0 !important;} ul.icons li .icon:before {-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; border: solid 1px; /*border-radius: 100%;*/ width: 2.25em; height: 2.25em; line-height: 2.25em; display: inline-block; text-align: center; font-size: 1.25em;} ul.icons.major {margin: 3.5em 0;} ul.icons.major li {padding: 0 4em 0 0;} ul.icons.major li .icon:before {width: 3.5em; height: 3.5em; line-height: 3.5em; font-size: 2.25rem;} ul.icons.style2 li:before {content: ''; width: 1em; height: 1px; border-top: solid 1px; display: block; position: absolute; top: 50%; left: -1em;} ul.icons.style2 li:first-child:before {display: none;} ul.icons.style2.major li:before {width: 4em; left: -4em;} @media screen and (max-width: 1280px) { ul.icons.major {margin: 0 0 2em 0;} ul.icons.major li {padding: 1em !important;} ul.icons.major li:before {display: none;} ul.icons.style2 li:before {display: none;} } @media screen and (max-width: 980px) { ul.icons.major {max-width: 34em; margin-left: auto; margin-right: auto;} } @media screen and (max-width: 736px) { ul.icons.major {max-width: 30em;} ul.icons.major li {padding: 0.75em !important;} ul.icons.major li .icon:before {width: 2.75em; height: 2.75em; line-height: 2.75em;} } @media screen and (max-width: 480px) { ul.icons.major {max-width: 100%;} ul.icons.major li {padding: 0.5em !important;} ul.icons.major li .icon:before {font-size: 1.75rem;} } ul.actions {cursor: default; list-style: none; padding-left: 0; } ul.actions li {display: inline-block; padding: 0 1em 0 0; vertical-align: middle;} ul.actions li:last-child {padding-right: 0;} ul.actions.small li {padding: 0 0.5em 0 0;} ul.actions.vertical li {display: block; padding: 1.5em 0 0 0;} ul.actions.vertical li:first-child {padding-top: 0;} ul.actions.vertical li > * {margin-bottom: 0;} ul.actions.vertical.small li {padding: 1em 0 0 0;} ul.actions.vertical.small li:first-child {padding-top: 0;} ul.actions.fit {display: table; margin-left: -1em; padding: 0; table-layout: fixed; width: calc(100% + 1em); max-width: 100%;} ul.actions.fit li {display: table-cell; padding: 0 0 0 1em;} ul.actions.fit li > * {text-overflow: ellipsis; overflow: hidden; margin-bottom: 0;} ul.actions.fit.small {margin-left: -0.5em; width: calc(100% + 0.5em);} ul.actions.fit.small li {padding: 0 0 0 0.5em;} @media screen and (max-width: 480px) { ul.actions {margin: 0 auto 2em auto; max-width: 23em;} ul.actions li {padding: 1em 0 0 0; display: block; text-align: center; width: 100%;} ul.actions li:first-child {padding-top: 0;} ul.actions li > * {width: 80%; margin: 0 !important;} ul.actions.small li {padding: 0.5em 0 0 0;} ul.actions.small li:first-child {padding-top: 0;} } dl {margin: 0 0 2em 0;} dl dt {display: block; font-weight: 400; margin: 0 0 1em 0;} dl dd {margin-left: 2em;} ul.alt li {border-top-color: rgba(86, 86, 86, 0.25);} ul.icons li a.icon:hover:before {background-color: rgba(86, 86, 86, 0.075);} /* Section/Article */ section header h1:before, section header h2:before, section header h3:before, section header h4:before, section header h5:before, section header h6:before, article header h1:before, article header h2:before, article header h3:before, article header h4:before, article header h5:before, article header h6:before { content: ''; display: block; width: 2em; height: 1px; } section header p, article header p {font-size: 1.75em;} section header.major, article header.major {text-align: center; margin: 0 0 1.5em 0;} section header.major h1:before, section header.major h2:before, section header.major h3:before, section header.major h4:before, section header.major h5:before, section header.major h6:before, article header.major h1:before, article header.major h2:before, article header.major h3:before, article header.major h4:before, article header.major h5:before, article header.major h6:before {margin-left: auto; margin-right: auto;} section.special, article.special {text-align: center;} section.special header h2:before, section.special header h3:before, section.special header h4:before, section.special header h5:before, section.special header h6:before, article.special header h2:before, article.special header h3:before, article.special header h4:before, article.special header h5:before, article.special header h6:before {margin-left: auto; margin-right: auto;} @media screen and (max-width: 1025px) { section header p, article header p {font-size: 1em;} section header p br, article header p br {display: none;} } @media screen and (max-width: 767px) { section header.major, article header.major { text-align: center; margin: 0 1.5em 1.5em 1.5em; } } /* Table */ .table-wrapper { -webkit-overflow-scrolling: touch; overflow-x: auto; } table { margin: 0 0 2em 0; width: 100%; } table tbody tr { border: solid 1px; border-left: 0; border-right: 0; } table td { padding: 0.75em 0.75em; } table th { font-size: 0.9em; font-weight: 400; padding: 0 0.75em 0.75em 0.75em; text-align: left; } table thead { border-bottom: solid 1px; } table tfoot { border-top: solid 2px; } table.alt { border-collapse: separate; } table.alt tbody tr td { border: solid 1px; border-left-width: 0; border-top-width: 0; } table.alt tbody tr td:first-child { border-left-width: 1px; } table.alt tbody tr:first-child td { border-top-width: 1px; } table.alt thead { border-bottom: 0; } table.alt tfoot { border-top: 0; } table thead { border-bottom-color: rgba(86, 86, 86, 0.1); } tbody tr, tfoot { border: none !important; } .form-control { font: inherit; } /* Wrapper */ .wrapper { padding: 3.5em 0 5.5em 0; } .wrapper > .inner { width: 72em; max-width: 100%; margin: 0 auto; } @media screen and (max-width: 1680px) { .wrapper > .inner { width: 64em; } } .wrapper.style2 { background-color: #f7f7f7; } .wrapper.style3 { background-color: #000; color: #ffffff; background-size: cover; background-position: center center; background-repeat: no-repeat; background-attachment: fixed; } .wrapper.style3 blockquote { border-left-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 hr { border-bottom-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 code { background: rgba(255, 255, 255, 0.075); } .wrapper.style3 input[type="submit"], .wrapper.style3 input[type="reset"], .wrapper.style3 input[type="button"], .wrapper.style3 button, .wrapper.style3 .button { background-color: transparent; } .wrapper.style3 input[type="submit"]:hover, .wrapper.style3 input[type="reset"]:hover, .wrapper.style3 input[type="button"]:hover, .wrapper.style3 button:hover, .wrapper.style3 .button:hover { background-color: rgba(255, 255, 255, 0.075); } .wrapper.style3 input[type="submit"].special, .wrapper.style3 input[type="reset"].special, .wrapper.style3 input[type="button"].special, .wrapper.style3 button.special, .wrapper.style3 .button.special { background-color: #ffffff; border-color: #000; color: #000 !important; } .wrapper.style3 input[type="submit"].special:hover, .wrapper.style3 input[type="reset"].special:hover, .wrapper.style3 input[type="button"].special:hover, .wrapper.style3 button.special:hover, .wrapper.style3 .button.special:hover { background-color: rgba(255, 255, 255, 0.075); color: inherit !important; } .wrapper.style3 .select-wrapper:before { color: rgba(255, 255, 255, 0.25); } .wrapper.style3 input[type="text"], .wrapper.style3 input[type="password"], .wrapper.style3 input[type="email"], .wrapper.style3 select, .wrapper.style3 textarea { background: rgba(255, 255, 255, 0.075); border-color: inherit; } .wrapper.style3 input[type="text"]:focus, .wrapper.style3 input[type="password"]:focus, .wrapper.style3 input[type="email"]:focus, .wrapper.style3 select:focus, .wrapper.style3 textarea:focus { background: rgba(255, 255, 255, 0.25); box-shadow: 0 0 0 1px #ffffff; } .wrapper.style3 input[type="checkbox"] + label:before, .wrapper.style3 input[type="radio"] + label:before { background: rgba(255, 255, 255, 0.075); border-color: inherit; } .wrapper.style3 input[type="checkbox"]:focus + label:before, .wrapper.style3 input[type="radio"]:focus + label:before { background: rgba(255, 255, 255, 0.075); box-shadow: 0 0 0 1px #ffffff; } .wrapper.style3 input[type="checkbox"]:checked + label:before, .wrapper.style3 input[type="radio"]:checked + label:before { background-color: #ffffff; border-color: #ffffff; color: #000; } .wrapper.style3 ul.alt li { border-top-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 ul.icons li a.icon:hover:before { background-color: rgba(255, 255, 255, 0.075); } .wrapper.style3 table thead { border-bottom-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 table tfoot { border-top-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 table tbody tr { border-color: rgba(255, 255, 255, 0.25); } .wrapper.style3 table tbody tr:nth-child(2n + 1) { background-color: rgba(255, 255, 255, 0.075); } .wrapper.style3 table.alt tbody tr td { border-color: rgba(255, 255, 255, 0.25); } @media screen and (max-width: 980px) { .wrapper.style3 .spotlight:last-of-type { border-bottom-color: rgba(255, 255, 255, 0.25); } } @media screen and (max-width: 980px) { .wrapper.style3 > .inner.split > :first-child { border-bottom-color: rgba(255, 255, 255, 0.25); } } .wrapper.featured { text-align: center; padding: 0; } .wrapper.featured > .inner { display: inline-flex; -moz-flex-direction: row; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -moz-align-items: center; -webkit-align-items: center; -ms-align-items: center; align-items: center; padding: 2em 0; width: auto; text-align: left; } .wrapper.featured > .inner > .image { display: block; margin: 0 4em 2em 0; width: 21em; } .wrapper.featured > .inner > .image img { border-radius: 100%; width: 100%; } .wrapper.featured > .inner > .content h1 { font-size: 4em; } .wrapper.featured > .inner > .content h1:before { display: none; } .wrapper.featured > .inner > .content p { font-size: 1.5em; margin: 0 0 1.5em 0; } @media screen and (max-width: 1280px) { .wrapper.featured > .inner { padding: 0; } .wrapper.featured > .inner > .content h1 { font-size: 3.5em; } .wrapper.featured > .inner > .content p { font-size: 1.25em; } } @media screen and (max-width: 980px) { .wrapper.featured > .inner { display: block; text-align: center; } .wrapper.featured > .inner > .image { margin: 0 auto 3em auto; width: 18em; } .wrapper.featured > .inner > .content p { margin: 0 0 2em 0; } } @media screen and (max-width: 736px) { .wrapper.style3 { background-color: #000; color: #ffffff; background-size: cover; background-position: center center; background-repeat: no-repeat; background-attachment: unset; } .wrapper.featured > .inner > .image { margin: 0 auto 2.5em auto; width: 13em; } .wrapper.featured > .inner > .content h1 { font-size: 2.5em; } .wrapper.featured > .inner > .content p { font-size: 1em; } } @media screen and (max-width: 360px) { .wrapper.featured > .inner > .image { margin: 0 auto 2em auto; width: 11em; } } /*.wrapper.split > .inner {display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; -moz-flex-direction: row; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;} .wrapper.split > .inner > * {width: 50%; -ms-flex: 1;} .wrapper.split > .inner > :first-child {margin-right: 2em;} .wrapper.split > .inner > :last-child {margin-left: 2em;} @media screen and (max-width: 1280px) { .wrapper.split > .inner > :first-child {margin-right: 1.5em;} .wrapper.split > .inner > :last-child {margin-left: 1.5em;} } @media screen and (max-width: 980px) { .wrapper.split > .inner {display: block; text-align: center;} .wrapper.split > .inner header h2::before, .wrapper.split > .inner header h3::before, .wrapper.split > .inner header h4::before, .wrapper.split > .inner header h5::before, .wrapper.split > .inner header h6::before {margin-left: auto !important; margin-right: auto !important;} .wrapper.split > .inner > * {width: 100%;} .wrapper.split > .inner > :first-child {margin-right: 0; border-bottom: solid 1px rgba(86, 86, 86, 0.25); padding-bottom: 2em; margin-bottom: 4em !important;} .wrapper.split > .inner > :last-child {margin-left: 0;} }*/ @media screen and (max-width: 1280px) { .wrapper, .wrapper.main { padding: 4em 3em 4em 3em; } .wrapper > .inner { width: 100%; } } @media screen and (max-width: 736px) { .wrapper { padding: 1.5em 2em 2em 2em; } .wrapper.reclaim { padding: 1.5em 0 2em 0; } } @media screen and (max-width: 480px) { .wrapper { padding: 1.5em 1.5em 2em 1.5em; } } @media screen and (max-width: 360px) { .wrapper { padding: 1.5em 1em 1em 1em; } } /* Header black */ /* #header {position: fixed; right: 2em; top: 2em; z-index: 10000;} #header ul {display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; -moz-align-items: center; -webkit-align-items: center; -ms-align-items: center; align-items: center; list-style: none; margin: 0; padding: 0;} #header ul li {display: block; padding: 0;} #header ul li a {display: block; position: relative; height: 3.75em; line-height: 3.75em; padding: 0 2em 0 0; border: 0;} #header ul li a[href="#menu"] {-moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em;} #header ul li a[href="#menu"]:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 6px%3B stroke: %23ffffff%3B %7D%3C/style%3E%3Cline x1='10' y1='30' x2='90' y2='30' /%3E%3Cline x1='10' y1='50' x2='90' y2='50' /%3E%3Cline x1='10' y1='70' x2='90' y2='70' /%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em;} #header ul li a[href="#menu"]:hover {color: #ffffff; text-indent: 0; width: 9.6875em; border-radius: 4.6875em; padding-left: 1.875em;} #header ul li a[href="#menu"]:hover:before {background-size: 1.5625em;} #header ul li.searchwrapper {margin-right: 1.5em;} #header ul li a.freetext-search { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a.freetext-search:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("search.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em;} #header ul li a.freetext-search:hover {color: #ffffff; text-indent: 0; width: 9.6875em; border-radius: 4.6875em; padding-left: 1.875em;} #header ul li a.freetext-search:hover:before {background-size: 1.5625em;} #header ul li.profilwrapper {margin-right: 1.5em;} #header ul li a.profil-user {-moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em;} #header ul li a.profil-user:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("user.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em;} #header ul li a.profil-user:hover {color: #ffffff; text-indent: 0; width: 10.6875em; border-radius: 4.6875em; padding-left: 1.875em;} #header ul li a.profil-user:hover:before {background-size: 1.5625em;} #header ul li.contactwrapper {margin-right: 1.5em;} #header ul li a.contact {-moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -5.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em;} #header ul li a.contact:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("email.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em;} #header ul li a.contact:hover {color: #ffffff; text-indent: 0; width: 12.6875em; border-radius: 4.6875em; padding-left: 1.875em;} #header ul li a.contact:hover:before {background-size: 1.5625em;} @media screen and (max-width: 767px) { #header {right: 30px; top: 20px !important; float: right; position: relative;} #header ul li a {height: 3em; line-height: 3em; padding: 0 1em 0 0;} #header ul li a[href="#menu"] {text-indent: -3.75em; width: 3.75em; height: 3.75em; line-height: 3.75em;} #header ul li a[href="#menu"]:before {width: 3.75em; height: 3.75em; background-size: 2.1875em;} #header ul li a[href="#menu"]:hover {border-radius: 100%; padding-left: 0; text-indent: -3.75em; width: 3.75em;} #header ul li a[href="#menu"]:hover:before {background-size: 2.1875em;} #header ul li.profilwrapper, #header ul li.moodboardwrapper {display:none;} #header ul li.searchwrapper {display:none;} #header ul li a.contact {text-indent: -3.75em; width: 3.75em; height: 3.75em; line-height: 3.75em;} #header ul li a.contact:before {width: 3.75em; height: 3.75em; background-size: 2.1875em;} #header ul li a.contact:hover {border-radius: 100%; padding-left: 0; text-indent: -3.75em; width: 3.75em;} #header ul li a.contact:hover:before {background-size: 2.1875em;} } #header ul li.moodboardwrapper {display:none; margin-right: 1.5em; position:relative;} #header ul li a.moodboard-created {-moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(255, 153, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -8.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em;} #header ul li a.moodboard-created:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0.5em; background-image: url("moodboard.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 1.5em;} #header ul li a.moodboard-created:hover { text-indent: 0;} #header ul li a.moodboard-created.no-plates:before {right: 0;} #header ul li.cartWrapper {display: none; margin-right: 1.5em;} #header ul li a#cart {-moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(255, 153, 0, 0.9); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em;width: 4.6875em; height: 4.6875em; line-height: 4.6875em; text-align:center; color:white;} #header ul li a#cart:before {-moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url(""); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em;} #header ul li a[href="#cart"]:hover { text-indent: 0; } @media screen and (max-width: 767px) { #header ul li.moodboardwrapper {display:none !important; } #header {right: 30px; top: 30px;} #header ul li a {height: 3em; line-height: 3em; padding: 0 1em 0 0;} #header ul li a#cart { width: 3.75em; height: 3.75em; } #header ul li a#cart:before {width: 3.75em; height: 3.75em; background-size: 2.1875em;} #header ul li a#cart span {top:-5px; position:relative;} } */ /* Header white */ #wrapper { margin-top: 120px; } #header { position: fixed; right: 2em; top: 2em; z-index: 10000; } #header ul { display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; -moz-align-items: center; -webkit-align-items: center; -ms-align-items: center; align-items: center; list-style: none; margin: 0; padding: 0; } #header ul li { display: block; padding: 0; } #header ul li a { display: block; position: relative; height: 3.75em; line-height: 3.75em; padding: 0 2em 0 0; border: 0; } #header ul li a[href="#menu"] { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a[href="#menu"]:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 6px%3B stroke: %23565656%3B %7D%3C/style%3E%3Cline x1='10' y1='30' x2='90' y2='30' /%3E%3Cline x1='10' y1='50' x2='90' y2='50' /%3E%3Cline x1='10' y1='70' x2='90' y2='70' /%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em; } #header ul li a[href="#menu"]:hover { color: #000; text-indent: 0; width: 9.6875em; border-radius: 4.6875em; padding-left: 1.875em; font-weight: 600; } #header ul li a[href="#menu"]:hover:before { background-size: 1.5625em; } #header ul li.searchwrapper { margin-right: 1.5em; } #header ul li a.freetext-search { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a.freetext-search:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("search-dark.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em; } #header ul li a.freetext-search:hover { color: #000; text-indent: 0; width: 9.6875em; border-radius: 4.6875em; padding-left: 1.875em; font-weight: 600; } #header ul li a.freetext-search:hover:before { background-size: 1.5625em; } #header ul li.profilwrapper { margin-right: 1.5em; } #header ul li a.profil-user { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -4.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a.profil-user:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("user-dark.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em; } #header ul li a.profil-user:hover { color: #000; text-indent: 0; width: 10.6875em; border-radius: 4.6875em; padding-left: 1.875em; font-weight: 600; } #header ul li a.profil-user:hover:before { background-size: 1.5625em; } #header ul li.contactwrapper { margin-right: 1.5em; } #header ul li a.contact { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(0, 0, 0, 0); border-radius: 100%; color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -5.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a.contact:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url("email-dark.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em; } #header ul li a.contact:hover { color: #000; text-indent: 0; width: 12.6875em; border-radius: 4.6875em; padding-left: 1.875em; font-weight: 600; } #header ul li a.contact:hover:before { background-size: 1.5625em; } @media screen and (max-width: 767px) { #wrapper { margin-top: 0; } #header { right: 30px; top: 20px !important; float: right; position: relative; } #header ul li a { height: 3em; line-height: 3em; padding: 0 1em 0 0; color: #fff; } #header ul li a[href="#menu"] { text-indent: -3.75em; width: 3.75em; height: 3.75em; line-height: 3.75em; } #header ul li a[href="#menu"]:before { width: 3.75em; height: 3.75em; background-size: 3.1875em; font-size: 0.7em; } #header ul li a[href="#menu"]:hover { border-radius: 100%; padding-left: 0; text-indent: -3.75em; width: 3.75em; } #header ul li a[href="#menu"]:hover:before { background-size: 2.1875em; } #header ul li.profilwrapper, #header ul li.moodboardwrapper { display: none; } #header ul li.searchwrapper { display: none; } #header ul li.contactwrapper { margin-right: 0; } #header ul li a.contact { text-indent: -3.75em; width: 3.75em; height: 3.75em; line-height: 3.75em; color: #fff; } #header ul li a.contact:before { width: 3.75em; height: 3.75em; background-size: 3.1875em; font-size: 0.7em; } #header ul li a.contact:hover { border-radius: 100%; padding-left: 0; text-indent: -3.75em; width: 3.75em; color: #fff; } #header ul li a.contact:hover:before { background-size: 2.1875em; } } #header ul li.moodboardwrapper { display: none; margin-right: 1.5em; position: relative; } #header ul li a.moodboard-created { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(255, 153, 0, 0); /*border-radius: 100%; border:1px solid #000;*/ color: #000; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.2em; text-indent: -8.6875em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; } #header ul li a.moodboard-created:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0.5em; background-image: url("moodboard-dark.png"); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 1.5em; } #header ul li a.moodboard-created:hover { text-indent: 0; } #header ul li a.moodboard-created.no-plates:before { right: 0; } #header ul li.cartWrapper { display: none; margin-right: 1.5em; } #header ul li a#cart { -moz-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -ms-transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; transition: width 0.2s ease, border-radius 0.2s ease, color 0.2s ease; -webkit-tap-highlight-color: transparent; background-color: rgba(255, 153, 0, 0); /*border-radius: 100%;*/ color: #565656; overflow: hidden; padding: 0; text-decoration: none; white-space: nowrap; font-size: 1.2em; text-transform: uppercase; letter-spacing: 0.2em; width: 4.6875em; height: 4.6875em; line-height: 4.6875em; text-align: center; } #header ul li a#cart:before { -moz-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease; content: ''; display: block; position: absolute; top: 0; right: 0; background-image: url(""); background-position: center; background-repeat: no-repeat; width: 4.6875em; height: 4.6875em; background-size: 2.5em; } #header ul li a[href="#cart"]:hover { text-indent: 0; } @media screen and (max-width: 767px) { #header ul li.contactwrapper { margin-right: 0.5em; } #header ul li.cartWrapper { margin-right: 0; } #header ul li.moodboardwrapper { display: none !important; } #header { right: 30px; top: 30px; } #header ul li a { height: 3em; line-height: 3em; padding: 0 1em 0 0; } #header ul li a#cart { width: 2em; height: 2em; line-height: 2em; position: relative; top: -5px; left: 5px; } #header ul li a#cart:before { width: 1em; height: 1em; background-size: 1em; } #header ul li a#cart span { top: -5px; position: relative; } #header ul li a#cart span.count { left: -5px; } } /* Menu */ #menu { background-color: #f5f5f5; color: #000; display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; -moz-flex-direction: column; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -moz-align-items: center; -webkit-align-items: center; -ms-align-items: center; align-items: center; -moz-justify-content: center; -webkit-justify-content: center; -ms-justify-content: center; justify-content: center; -moz-pointer-events: none; -webkit-pointer-events: none; -ms-pointer-events: none; pointer-events: none; -moz-transition: opacity 0.25s ease, visibility 0.25s; -webkit-transition: opacity 0.25s ease, visibility 0.25s; -ms-transition: opacity 0.25s ease, visibility 0.25s; transition: opacity 0.25s ease, visibility 0.25s; background-color: #ffffff; height: 100%; opacity: 0; overflow: hidden; position: fixed; right: 0; text-align: left; top: 0; width: 35%; z-index: 10000; visibility: hidden; } #menu blockquote { border-left-color: rgba(255, 255, 255, 0.25); } #menu hr { border-bottom-color: rgba(255, 255, 255, 0.25); } #menu code { background: rgba(255, 255, 255, 0.075); } #menu input[type="submit"], #menu input[type="reset"], #menu input[type="button"], #menu button, #menu .button { background-color: transparent; } #menu input[type="submit"]:hover, #menu input[type="reset"]:hover, #menu input[type="button"]:hover, #menu button:hover, #menu .button:hover { background-color: rgba(255, 255, 255, 0.075); } #menu input[type="submit"].special, #menu input[type="reset"].special, #menu input[type="button"].special, #menu button.special, #menu .button.special { background-color: #ffffff; border-color: #ffffff; color: #000 !important; } #menu input[type="submit"].special:hover, #menu input[type="reset"].special:hover, #menu input[type="button"].special:hover, #menu button.special:hover, #menu .button.special:hover { background-color: rgba(255, 255, 255, 0.075); color: inherit !important; } #menu .select-wrapper:before { color: rgba(255, 255, 255, 0.25); } #menu input[type="text"], #menu input[type="password"], #menu input[type="email"], #menu select, #menu textarea { background: rgba(255, 255, 255, 0.075); border-color: inherit; } #menu input[type="text"]:focus, #menu input[type="password"]:focus, #menu input[type="email"]:focus, #menu select:focus, #menu textarea:focus { background: rgba(255, 255, 255, 0.25); box-shadow: 0 0 0 1px #ffffff; } #menu input[type="checkbox"] + label:before, #menu input[type="radio"] + label:before { background: rgba(255, 255, 255, 0.075); border-color: inherit; } #menu input[type="checkbox"]:focus + label:before, #menu input[type="radio"]:focus + label:before { background: rgba(255, 255, 255, 0.075); box-shadow: 0 0 0 1px #ffffff; } #menu input[type="checkbox"]:checked + label:before, #menu input[type="radio"]:checked + label:before { background-color: #ffffff; border-color: #ffffff; color: #000; } #menu ul.alt li { border-top-color: rgba(255, 255, 255, 0.25); } #menu ul.icons li a.icon:hover:before { background-color: rgba(255, 255, 255, 0.075); } #menu table thead { border-bottom-color: rgba(255, 255, 255, 0.25); } #menu table tfoot { border-top-color: rgba(255, 255, 255, 0.25); } #menu table tbody tr { border-color: rgba(255, 255, 255, 0.25); } #menu table tbody tr:nth-child(2n + 1) { background-color: rgba(255, 255, 255, 0.075); } #menu table.alt tbody tr td { border-color: rgba(255, 255, 255, 0.25); } @media screen and (max-width: 980px) { #menu .spotlight:last-of-type { border-bottom-color: rgba(255, 255, 255, 0.25); } } #menu:before { -moz-transition: width 0.5s linear, height 0.5s linear, top 0.5s linear, right 0.5s linear; -webkit-transition: width 0.5s linear, height 0.5s linear, top 0.5s linear, right 0.5s linear; -ms-transition: width 0.5s linear, height 0.5s linear, top 0.5s linear, right 0.5s linear; transition: width 0.5s linear, height 0.5s linear, top 0.5s linear, right 0.5s linear; position: absolute; content: ''; display: block; top: 2em; right: 2em; width: 3.75em; height: 3.75em; background-color: #f5f5f5; border-radius: 100%; z-index: -1; } #menu > .close { -moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease; -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease; -ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease; transition: opacity 0.5s ease, transform 0.5s ease; -moz-transform: scale(0.25) rotate(-180deg); -webkit-transform: scale(0.25) rotate(-180deg); -ms-transform: scale(0.25) rotate(-180deg); transform: scale(0.25) rotate(-180deg); -webkit-tap-highlight-color: transparent; display: block; position: absolute; top: 1.2em; right: 1em; width: 3.75em; text-indent: 3.75em; height: 3.75em; border: 0; overflow: hidden; padding: 0; white-space: nowrap; } #menu > .close:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: top right; background-repeat: no-repeat; background-size: 1em; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 8px%3B stroke: %23000000%3B %7D%3C/style%3E%3Cline x1='15' y1='15' x2='85' y2='85' /%3E%3Cline x1='85' y1='15' x2='15' y2='85' /%3E%3C/svg%3E"); } @media screen and (max-width: 767px) { #menu > .close { top: 1em; right: 1em; width: 3em; text-indent: 3em; height: 3em; } #menu > .close:before { background-size: 1.75em; } } #menu > .inner { -moz-transition: opacity 0.5s ease-in-out; -webkit-transition: opacity 0.5s ease-in-out; -ms-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; -moz-transition-delay: 0.25s; -webkit-transition-delay: 0.25s; -ms-transition-delay: 0.25s; transition-delay: 0.25s; padding: 10%; width: 100%; /*24em*/ max-width: 100%; height: 100%; opacity: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; } /*padding: 3em 3em 1em 3em ;*/ @media screen and (max-width: 767px) { #menu { width: 100%; } #menu > .inner { padding: 3em 2em 1em 2em; } } @media screen and (max-width: 480px) { #menu > .inner { padding: 3em 1.5em 1em 1.5em; width: 30em; } } @media screen and (max-width: 360px) { #menu > .inner { padding: 3em 1em 1em 1em; } } #menu h2 { font-size: 1.75em; } #menu .logo-link { border: 0; } #menu ul.links { list-style: none; padding: 0; text-align: left; margin-top: 5em; margin-bottom: 1em; } /*text-align:center;*/ #menu ul.links .textonly { padding: 0 0 1em; } #menu ul.links > li { padding-left: 0; display: block; position: relative; text-transform: uppercase; font-weight: 700; } /*display:inline-block;*/ #menu ul.links > li.menu-item { padding: 0 0 1em; } #menu ul.links > li a, #menu .member-wrapper ul.membernav > li a { text-decoration: none; /*height: 3.5em; line-height: 3.5em; display: block;*/ border: 0; text-transform: uppercase; } #menu ul.links > li a:hover, #menu .member-wrapper ul.membernav > li a:hover, #menu ul.links > li a:focus, #menu .member-wrapper ul.membernav > li a:focus { color: #f90; } #menu ul.links li:first-child { border-top: 0; } /*#menu ul.links .submenu {padding: 0 0 1em;}*/ #menu ul.links .submenu li { display: block; text-align: left; padding-left: 0; font-weight: 400; } /*#menu ul.links > li > div.x {position:absolute; left: 0; width:300px;}*/ #menu ul.links > li > .submenu li:last-child { margin-bottom: 1.5em; } #menu ul.links > li > .submenu li a { text-transform: none; margin: 0; height: 1.5em; line-height: 1.5em; /*font-size: 0.95em;*/ } #menu.visible { -moz-pointer-events: auto; -webkit-pointer-events: auto; -ms-pointer-events: auto; pointer-events: auto; opacity: 1; visibility: visible; } #menu.visible:before { width: 400vw; width: 300vmax; height: 400vw; height: 300vmax; top: -150vw; right: -150vw; } #menu.visible > .close { -moz-transform: scale(1) rotate(0deg); -webkit-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); } #menu.visible > .inner { opacity: 1; } #menu .member-wrapper { display: block; width: 100%; padding: 1em 0; position: relative; top: 0; } #menu .member-wrapper ul.membernav { display: block; width: 100%; padding: 0; position: relative; top: 0; } #menu .member-wrapper ul.membernav > li { padding: 0 50px 0 0; display: inline-block; position: relative; text-transform: uppercase; font-weight: 400; } #menu .member-wrapper ul.membernav > li a span.icon { font-size: 1.75em; } @media screen and (min-width: 768px) { #menu ul.links li.start { width: 100%; display: block; text-align: center; padding: 0 0 20px; } } @media screen and (max-width: 1440px) { #menu ul.links > li { padding: 0 75px 0 0; } } @media screen and (max-width: 1280px) { #menu.visible > .inner img { max-width: 140px; } #menu ul.links > li { padding: 0; border-top: none; display: block; position: relative; } #menu ul.links > li a { text-decoration: none; height: 0.5em; line-height: 0.5em; /*display: block;*/ border: 0; text-transform: uppercase; } #menu ul.links > li > div.x { position: static; width: auto; display: none; } #menu ul.links > li div.textonly { position: static; width: auto; display: block; cursor: pointer; } #menu ul.links .submenu li { display: block; text-align: left; padding: 8px 0; } } @media screen and (max-width: 840px) { #menu ul.links > li { padding: 0; } #menu ul.links > li a, #menu ul.links > li div.textonly { font-size: 18px; } #menu .member-wrapper { top: 0; } #menu .member-wrapper ul.membernav { top: 0; } #menu .member-wrapper ul.membernav > li { padding: 0 1em; } #menu ul.links .submenu li a { font-size: 16px; } } /* ABOUT SUB MENU */ .about-submenu { position: fixed; top: 40%; left: 0; background-color: #f5f5f5; padding: 1.0em; z-index: 10; } .about-submenu .btn-close { z-index: 5; width: 40px; height: 40px; position: absolute; top: 0; left: 212px; cursor: pointer; background-color: #f90; text-align: center; line-height: 40px; } .about-submenu .submenu-wrapper { width: 180px; } .about-submenu .hide-menu { left: 0; } .about-submenu .show-menu span.symbol:before { content: '\f053'; font-family: 'FontAwesome'; font-style: normal; font-weight: 900; } .about-submenu .hide-menu span.symbol:before { content: '\f054'; font-family: 'FontAwesome'; font-style: normal; font-weight: 900; } .about-submenu ul { list-style: none; margin: 0; padding: 0; } .about-submenu ul li { padding: 0; } .about-submenu ul p { font-size: 0.9em; margin: 0; } .about-submenu ul a { font-size: 0.8em; } @media screen and (min-width: 1600px) { .about-submenu .btn-close.show-menu { left: 216px; } } @media screen and (max-width: 1023px) { .about-submenu { display: none; } } /* SEARCH */ .search-wrapper { text-align: left; padding: 30px 0 0; max-width: 600px; margin:0 auto; } .search-wrapper .search { display: block; padding-bottom: 30px; cursor: pointer; } .search-toggle { list-style: none; margin: 0; padding: 0; } .search-toggle li { display: inline-block; padding: 0 10px; } .search-wrapper .searchform { display: none; } .search-wrapper input[type="text"] { height: 3.0em; } .searchresults p.border { border-bottom: 1px solid #e6e6e6; padding-bottom: 15px; } .searchresults li span { font-size: 0.8em; } .searchresults ul { margin: 0; padding: 0; list-style: none; text-align: center; } .searchresults ul li { padding: 0 0 7px; display: inline-block; } .searchresults .pagination > li > a, .searchresults .pagination > li > span { float: none; color: #000; border: 1px solid #000; } .searchresults .pagination > li.active > a, .searchresults .pagination > li.active > span { color: #fff; border: 1px solid #000; background-color: #000; } .searchresults ul li p { text-align: left !important; } .search-wrapper button { height: 3.7em; } .search-item { margin-bottom:1.5em; } @media screen and (max-width: 767px) { .search-wrapper { padding: 0; margin-bottom: 10px; } .search-wrapper .col-md-9 { margin-bottom: 30px; } .search-wrapper .search { display: block; } .searchform { display: none; margin-top: 0; margin-bottom: 20px; } .searchform button { margin-top: 20px; } } /* FOOTER */ #footer .copyright { text-align: center; opacity: 0.35; font-size: 0.8em; margin: 4em 0 0 0; } #footer .copyright:before { content: ''; display: block; width: 4rem; height: 1px; margin: 0 auto 2rem auto; border-top: none; opacity: 0.5; } /* Intro */ #intro .image { -moz-transition: opacity 0.75s ease-in-out; -webkit-transition: opacity 0.75s ease-in-out; -ms-transition: opacity 0.75s ease-in-out; transition: opacity 0.75s ease-in-out; } #intro .content { -moz-transition: -moz-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; -ms-transition: -ms-transform 0.5s ease-in-out, opacity 0.5s ease-in-out; transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out; -moz-transition-delay: 0.35s; -webkit-transition-delay: 0.35s; -ms-transition-delay: 0.35s; transition-delay: 0.35s; } body.is-loading #intro .image { opacity: 0; } body.is-loading #intro .content { -moz-transform: translateX(0.5em); -webkit-transform: translateX(0.5em); -ms-transform: translateX(0.5em); transform: translateX(0.5em); opacity: 0; } @media screen and (max-width: 980px) { body.is-loading #intro .content { -moz-transform: translateY(0.35em); -webkit-transform: translateY(0.35em); -ms-transform: translateY(0.35em); transform: translateY(0.35em); } } /* MINA CSS */ .header-wrapper { position: fixed; z-index: 10000; width: 100%; top: 0; background-color: #fff; } .header-wrapper.bg-header { background-color: #fff; -webkit-box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); -moz-box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); } .header-wrapper .logo { float: left; padding: 30px 30px 20px; position: relative; top: 0; left: 0; } /*top: 0;*/ .header-wrapper.bg-header .logo { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .header-wrapper .logo a { border: none; } .header-wrapper .logo img { width: 100%; max-width: 240px; } .header-wrapper.bg-header .logo { float: left; margin: 30px 30px 20px; background-color: transparent; padding: 0; border-radius: 0; position: static; } .header-wrapper.bg-header .logo img { width: 100%; max-width: 240px; } .header-wrapper .header-text { display: none; margin: 30px auto 0; width: 80%; text-align: center; } .header-wrapper .header-text h3, .header-wrapper .header-text p { margin: 0; } .header-wrapper.bg-header .header-text { display: block; } @media screen and (max-width: 1080px) { .header-wrapper .logo img, .header-wrapper.bg-header .logo img { max-width: 180px; } .header-wrapper .header-text { width: 50%; margin: 30px auto 0; } .header-wrapper .header-text h3 { margin: 0 0 0.5rem 0; } } @media screen and (max-width: 1023px) { .header-wrapper { background-color: #fff; -webkit-box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); -moz-box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.27); } .header-wrapper.bg-header .header-text { display: none; } } @media screen and (max-width: 767px) { .header-wrapper { background-color: #fff; position: static; } .header-wrapper .logo img, .header-wrapper.bg-header .logo img { max-width: 140px; } .header-wrapper .logo { float: left; padding: 20px 30px 10px; width: 50%; } } @media screen and (max-width: 480px) { .header-wrapper .logo { float: left; padding: 20px 5px 10px 15px; width: 46%; } #header { right: 15px; } } .fullwidth-container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; margin-bottom: 30px; } .fullwidth-container.style1 { background-color: #000; color: #fff; padding-bottom: 1px; } .fullwidth-container.style2 { background-color: #f7f7f7; padding-bottom: 1em; } .row { margin-left: 0 !important; margin-right: 0 !important; } /* FLEXSLIDER */ #mainslider { background: #fff url(6-dots-scale.svg) no-repeat center center; margin-bottom: 4em; } #mainslider.desktop { display: block; } #mainslider.mobile { display: none; } #mainslider .flexslider { border: none; z-index: 1; margin-bottom: 0; } #mainslider .flexslider .slides { position: relative; overflow: hidden; } #mainslider .flexslider .slides > li { background-repeat: no-repeat; background-size: cover; background-position: center center; min-height: 700px; position: relative; } #mainslider .flexslider .slides li .overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.0); } #mainslider .flexslider .slider-text { display: block; opacity: 0; position: relative; top: 50%; width: 40%; margin: 0 auto; } #mainslider .flexslider .slider-text > .slider-text-inner > div { background: rgba(255, 255, 255, 0); padding: 0 3% 4%; } #mainslider .flexslider .slider-text > .slider-text-inner > div header { margin-bottom: 30px; } #mainslider .flexslider .slider-text > .slider-text-inner h2 { font-size: 3.25em; font-weight: 600; color: #fff; margin: 0; padding-top: 3%; /*text-shadow: 0 2px 6px rgba(0,0,0,.3);*/ } #mainslider .flexslider .slider-text > .slider-text-inner h3 { font-weight: 600; color: #fff; margin: 0 0 15px; /*text-shadow: 0 2px 6px rgba(0,0,0,.3);*/ } #mainslider .flexslider .flex-control-nav { bottom: 40px; z-index: 1000; } #mainslider .flexslider .flex-direction-nav { display: block; } #mainslider .flexslider .flex-direction-nav a.flex-prev { opacity: 1 !important; left: 40px !important; } #mainslider .flexslider .flex-direction-nav a.flex-next { right: 40px !important; opacity: 1 !important; } #mainslider .flexslider .flex-direction-nav a { position: absolute; cursor: pointer; width: 45px; height: 45px; } #mainslider .actions li { min-height: 100%; } #mainslider .actions li .button.big { color: #fff !important; /*background-color:#fff;*/ border: 2px solid #fff !important; } .arrow-down { background-color: #000; padding: 15px; margin: 0 auto; color: #fff; border-radius: 50%; height: 120px; width: 120px; text-align: center; position: relative; z-index: 1000; } .arrow-down .down-arrow { font-size: 50px; line-height: 100px; } .flex-control-paging li a.flex-active { background: #fff; background: rgba(255,255,255,.9); cursor: default; width: 18px; height: 18px; } .flex-control-paging li a:hover { background: #fff; background: rgba(255,255,255,.7); } .flex-control-paging li a { width: 11px; height: 11px; display: block; background: #999; background: rgba(255,255,255,.5); cursor: pointer; text-indent: -9999px; -webkit-box-shadow: inset 0 0 3px rgb(0 0 0 / 30%); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,.3); box-shadow: inset 0 0 3px rgb(0 0 0 / 30%); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } @media screen and (min-width: 1024px) { #mainslider .flexslider .slider-text > .slider-text-inner h1 { font-size: 40px; } #mainslider .flexslider .slider-text > .slider-text-inner h3 { font-size: 20px; } } @media screen and (min-width: 1920px) { #mainslider .flexslider .slider-text { top: 62%; width: 40%; } } @media screen and (max-width: 1025px) { #mainslider .flexslider .slider-text { display: block; opacity: 0; position: relative; top: 46%; width: 90%; margin: 0 auto; } #mainslider .flexslider .slider-text > .slider-text-inner h1, #mainslider .flexslider .slider-text > .slider-text-inner h2 { font-size: 36px; color: #fff; } #mainslider .flexslider .slider-text > .slider-text-inner h3 { font-size: 18px; } #mainslider .flexslider .slides > li { min-height: 100%; } #mainslider .flexslider .slider-text > .slider-text-inner > div { /*background: rgba(255, 255, 255, 0.8);*/ padding: 7% 6% 1%; } .arrow-down { background-color: #000; padding: 15px; margin: 0 auto; color: #fff; border-radius: 50%; height: 80px; width: 80px; text-align: center; position: relative; z-index: 1000; } .arrow-down .down-arrow { font-size: 40px; line-height: 60px; } } @media screen and (max-width: 767px) { #mainslider.desktop { display: none; } #mainslider.mobile { display: block; } #mainslider.mobile .flexslider .slider-text > .slider-text-inner > div .button { background-color: rgba(86, 86, 86, 0.1); } } /* LAPTOP DEVICES */ @media (min-resolution: 120dpi) { #mainslider { overflow: hidden; height: 80vh !important; margin-bottom: 1em; } #mainslider .flexslider { height: 80vh !important; } #mainslider .flexslider .slides > li { min-height: 100%; height: 80vh !important; } #mainslider .flexslider .slider-text { top: 30%; } } /* TEASER */ .teaser { padding-top: 40px; } /* TEASERS STARTSIDA */ .items { padding: 15px; display: block; overflow: hidden; height: 500px; margin-top: 15px; } .infoboxes { width: 100%; padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: cover !important; background-position: center center !important; height: 500px; position: relative; } .items.infoboxes-wrapper { height: auto; } .infoboxes.home { width: 100%; padding-left: 0; padding-right: 0; display: table; background-image: none; height: 100%; position: relative; } .infoboxes.home .infoboxes-img { max-height: 100%; max-width: 100%; object-fit: contain; } .services { background: #fff; color: #000; padding: 40px 40px 15px 40px; margin-bottom: 30px; } .services.shortdesc { padding: 40px 40px 0 40px; margin-bottom: 0; } .infoboxes > .textinfo { display: table-cell; vertical-align: bottom; min-height: 500px !important; background-color: transparent; } .infoboxes > .textinfo:hover { background-color: rgba(255,255,255,0.85); } .infoboxes > .textinfo .blog-intro { margin: 0 5% 0; width: auto; background-color: rgba(255,255,255,0.8); padding: 15px 30px; } .infoboxes > .textinfo .blog-intro h3, .infoboxes > .textinfo .blog-intro h4 { margin: 0; } .textinfo .blog-intro h4 { font-size: 0.9em; } .infoboxes > .textinfo h3 span { background-color: rgba(255,255,255,0.8); padding: 15px 30px; margin-bottom: 0 !important; width: auto !important; display: block; } .infoboxes > .textinfo:hover h3 span, .infoboxes > .textinfo:hover .blog-intro { background-color: transparent; } .infoboxes h3 { color: #000; text-transform: uppercase; font-size: 1.2em; margin: 0; } .infoboxes .imagegalleryinfo:hover h3 { margin-bottom: 0 !important; } .infoboxes .imagegalleryinfo p { opacity: 0; display: none; } .infoboxes .imagegalleryinfo:hover p { opacity: 1; display: block; } .infoboxes p { color: #000; } .infoboxes > .textinfo .shorttext { opacity: 0; display: none; margin-bottom: 15px; } .infoboxes > .textinfo:hover .shorttext { opacity: 1; display: block; } .infoboxes > .textinfo footer { opacity: 0; display: none; } .infoboxes > .textinfo:hover footer { opacity: 1; display: block; } .infoboxes footer .button.big { color: #000 !important; } .shortdesc { width: 100%; margin: 0 auto; } .shorttext p { margin: 0 0 0.5em 0; } .shorttext .date { display:block; } @media screen and (max-width: 1680px) { .items, .infoboxes { height: 450px; } } @media screen and (max-width: 1440px) { .items, .infoboxes { height: 400px; } .infoboxes h3 { font-size: 1.2em; } } @media screen and (max-width: 1281px) { .items, .infoboxes { height: 300px; } .infoboxes > .textinfo .blog-intro { margin: 0 1% 2%; border-radius: 0; } .infoboxes h3 { font-size: 1.2em; text-align: center; /*background-color: rgba(255,255,255,0.9);*/ padding: 5px 0; } .infoboxes.home h3 { background-color: transparent; } .infoboxes > .textinfo h3 span { background-color: rgba(255,255,255,0.8); padding: 15px 30px; margin-bottom: 0 !important; width: auto !important; border-radius: 0; text-align: center; display: block; } .infoboxes > .textinfo .blog-intro span.date, infoboxes > .textinfo .blog-intro span.category { display: block; } .infoboxes > .textinfo .blog-intro span.sep { display: none; } .services { background: #fff; color: #000; padding: 40px 20px 7px 20px; margin-bottom: 30px; } .services.shortdesc { padding: 10px 40px 0 40px; } } @media screen and (max-width: 1200px) { .infoboxes h3 { font-size: 1.6em; padding: 8px 0; } .infoboxes > .textinfo h3 span { padding: 8px 15px; } } @media screen and (max-width: 1023px) { .items, .infoboxes { height: 300px; } } @media screen and (max-width: 767px) { .infoboxes > .textinfo:hover .shorttext, .infoboxes > .textinfo:hover footer { opacity: 0; display: none; } .infoboxes h3 { font-size: 1.4em; padding: 8px 0; } .services.shortdesc { padding: 10px 20px 0 20px; } .shorttext { margin: 0 0 2em 0; } .shorttext p { margin: 0 0 1em 0; } } @media screen and (min-width: 1930px) { .items, .infoboxes { height: 650px; } } /* NEWSLETTER */ .wrapper.newsletter { padding: 2em 0; margin-bottom: 3em; } .wrapper.newsletter.extra-padding { padding: 9em 0; } .wrapper.newsletter .inner { background-color: #f0f0f0 !important; padding: 2em; } .newsletter-desc { padding-top: 2em; } .parloma-newsletter { list-style: none; margin: 0; padding: 0 0 2em; text-align: center; } .parloma-newsletter li { display: inline-block; padding: 1%; width: 48%; } @media screen and (max-width: 1280px) { .wrapper.newsletter.extra-padding { padding: 12em 0 0; } } @media screen and (max-width: 767px) { .wrapper.newsletter.extra-padding { padding: 3em 0 0; } .parloma-newsletter li { display: inline-block; width: 100%; } } /* NEWS INFOBOXES */ .news { padding-top: 50px; } .news .newsinfo { margin-top: 2em; } .news .newsinfo footer { margin-top: 2em; } .news h2, .news p { margin: 0; } .news-small-image { padding-left: 0 !important; padding-right: 0 !important; } .archive, .news-archive { margin-top: 40px; } .related-news.wrapper { background-color: #000; padding: 1% 0 3%; color: #fff; } .related-news h2 { text-align: center; } .related-news .items, .related-news .infoboxes { height: 400px; } .related-news .infoboxes h3 { color: #000; text-transform: uppercase; font-size: 0.9em; } .related-news .button { height: 4em; line-height: 4.0em; } @media screen and (max-width: 1281px) { .related-news.wrapper { padding: 1.5em 3em 4.5em; } } @media screen and (max-width: 1200px) { .related-news.wrapper { padding: 1.0em 3em 3em; } ul.actions.news-archive { margin: 2em auto 2em auto; } } @media screen and (max-width: 840px) { .related-news.wrapper .inner { width: 60%; } } @media screen and (max-width: 767px) { .related-news.wrapper { padding: 1.5em 3em 3em; } .news .newsinfo { padding: 0; } .news.newsnr-2 { padding-top: 0; } .news-small-image { display: none; } } /* KAKELJOURNALEN HOME */ .journal { margin-bottom: 0; } .items.journal-wrapper { height: auto; } .journal h2 { text-align: left; } .items.journal-wrapper .services { background-color: transparent; } .journal .items.big, .journal .items.big .infoboxes { height: 620px; } .journal .items.small, .journal .items.small .infoboxes { height: 303px; } .journal .items.small .infoboxes h3 { font-size: 0.8em; } .journal .items.small .infoboxes .services { padding: 20px 20px 15px 20px; } .journal-first-info, .journal-info { width: 100%; margin: 0 auto; padding: 0 30px; } .journal .image-holder, .journal .journal-first-info { max-width: 1280px; margin: 0 auto; } .journal .image-holder { margin-bottom: 30px; } .journal .inner { border-top: none !important; } .journal-info.shortdesc p, .journal-first-info p { margin: 0; } .journal-first-info footer, .journal-info footer { margin: 1em 0; } @media screen and (max-width: 1200px) { .journal .items.big, .journal .items.big .infoboxes { height: 615px; } } @media screen and (max-width: 840px) { .journal .items.small, .journal .items.small .infoboxes { height: 144px; } } @media screen and (max-width: 767px) { .journal-first-info, .journal-info, .services.journal-info.shortdesc { padding: 0; } } /* POPULAR COLLECTIONS */ .popular { margin-top: 1.5em; padding-top: 1.5em; } .popular h2 { text-align: center; } .popular .items { height: 550px; } .popular .items .infoboxes { height: 450px; } .popular .items p { text-align: center; margin-top: 1em; font-weight: 600; text-transform: uppercase; } @media screen and (max-width: 1200px) { .popular .items { height: 500px; } } @media screen and (max-width: 840px) { .popular .items { height: 500px; } } @media screen and (max-width: 767px) { .popular .items { height: 500px; } } /* POPULÄRA PRODUKTER WEBSHOP */ .wrapper.special { padding: 3.5em 0; position: relative; } .wrapper.special .overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%; /* background-image: linear-gradient(to top, rgba(86, 86, 86, 0.7), rgba(86, 86, 86, 0.7));*/ } .wrapper.special .inner { position: relative; } @media screen and (max-width: 767px) { .wrapper.special { padding: 3.5em; } .popular { margin-bottom: 1.5em; } } /* BACKGROUND-IMAGE TEASER */ .wrapper.special.bgteaser { padding: 8.5em 0; position: relative; } .wrapper.special.bgteaser h2, .wrapper.special.bgteaser h3, .wrapper.special.bgteaser p { text-shadow: 0 2px 6px rgba(0,0,0,.5); } .wrapper.special.bgteaser .button.big { /*background-color:#fff;*/ color: #fff !important; border: 2px solid #fff !important; } /* FOOTER */ #footer.wrapper { padding: 3em 0 !important; } #footer p { margin: 0 0 0.5em 0; } #footer ul { list-style: none; margin: 0 0 1em 0; padding-left: 0; } #footer ul li { padding-left: 0; } @media screen and (max-width: 1280px) { #footer.wrapper { padding: 2em !important; } } @media screen and (max-width: 1023px) { #footer.wrapper { padding: 3em !important; } } @media screen and (max-width: 767px) { #footer.wrapper { padding: 2em 0.8em !important; } #footer.wrapper .col-md-4 { margin-bottom: 3.5em; } .nyhetsbrev { margin-bottom: 3.5em; } } /* HERO IMAGES */ #heroimage { background-repeat: no-repeat; background-position: center center; background-size: cover; } #heroimage.mobile { display: none !important; } #heroimage.desktop { display: block !important; } @media screen and (min-width: 1280px) { #heroimage.desktop { min-height: 50vh; } } @media screen and (max-width: 767px) { #heroimage.desktop { display: none !important; } #heroimage.mobile { display: block !important; } #heroimage { background-position: top center !important; background-size: cover !important; min-height: 220px !important; } } /* CONTENT PAGES */ .wrapper.main { padding: 3.5em 0 3.0em; } .wrapper.main li { padding-bottom: 1.5em; } .webshop .wrapper.special { padding: 0 0 3.5em; } .newslist, .newsarticle, .blogpost, .contactinfo, .event, .productlist { padding: 3.5em 0; } .blogpost p { margin: 0; } .blog-info { margin-top: 15px; } .blog-info ul { list-style: none; margin: 0; padding: 0; } .blog-info ul li { display: block; padding: 5px 0; text-align: left; vertical-align: top; } .blog-info ul li img { position: relative; top: 0; } .tags { padding-left: 5px; } .tags::after { content: "|"; padding-left: 7px; } .tags:last-child::after { content: ""; padding-left: 7px; } .newslist .wrapper.special { padding: 0 0 3.5em !important; } .newslist .fullwidth-container.style2 { padding-bottom: 30px; } .newslist .col-md-12 { display: none; } .newslist .news { padding-top: 0; } .newsarticle .major p { margin: 0 0 0.5em 0; } .faqtags, .posttags { text-align: center; border-bottom: 1px solid #000; padding-bottom: 2em; } .faqtags ul, .posttags ul { list-style: none; margin: 0; text-align: center; } .faqtags ul li, .posttags ul li { display: inline-block; padding: 0 7px 15px; } .faqitems { padding-bottom: 1em; margin-bottom: 1em; border-bottom: 1px solid #e6e6e6; } .faqitems .imageholder { overflow: hidden; } .faqitems .imageholder img { max-width: 100%; } .faqitems h4, .faqitems p, .faqitems ul { margin-bottom: 0.5em; } .eventitems { padding-bottom: 1em; margin-bottom: 1em; border-bottom: 1px solid #e6e6e6; } .eventlistarchive .eventitems { border-bottom: 1px solid #fff; } .eventitems .imageholder { overflow: hidden; } .eventitems .imageholder img { max-width: 100%; } .eventitems h4, .eventitems h5, .eventitems p, .eventitems ul { margin-bottom: 0.5em; } .event .major p { margin: 0 0 0.5em; } #content-pdf { padding-top: 1.0em; } #content-pdf .inner { border-top: 1px solid #000; padding-top: 1.5em; } #content-pdf .pdflist { margin-left: -15px; margin-right: -15px; } #content-pdf .nr-5:after { content: ''; display: block; clear: both; height: 30px; width: 100%; } #content-pdf .imageholder { text-align: center; margin-bottom: 30px; } #content-pdf .imageholder span { display: block; } #content-pdf img { width: 100%; } .content-form .inner { border-top: 1px solid #000; padding-top: 1.5em; text-align: center; } .main .inner p img { display: block; margin-left: auto; margin-right: auto; width: 100% !important; height: 100% !important; max-width: 1140px; } .maincontent-wrapper { margin: 0 auto; max-width: 60%; } @media screen and (max-width: 1281px) { .wrapper.main { padding: 3.5em 3em; } .newslist, .newsarticle, .blogpost, .contactinfo, .event { padding: 3.5em 3em; } } @media screen and (max-width: 767px) { .wrapper.main { padding: 3.5em 1.5em; } .newslist, .newsarticle, .blogpost, .contactinfo, .eventlist { padding: 1em 0; } .newsarticle, .blogpost, .contactinfo, .event { padding: 1.5em; } .faqitems { padding-left: 0; padding-right: 0; } .faqitems .col-md-3.imageholder, .faqitems .col-md-9 { padding-left: 0; padding-right: 0; padding-bottom: 15px; } .faqitems h4 { font-weight: 400; margin-bottom: 1em; } .eventitems { padding-left: 0; padding-right: 0; } .eventitems .col-md-3.imageholder { padding-left: 0; padding-right: 0; padding-bottom: 15px; } .faqtags, .posttags { margin: 0 15px !important; } .faqtags ul li, .posttags ul li { padding: 0; } .button.newslinks, .button.faqlinks, .button.blogpostslinks { padding: 0 !important; border: none; height: auto; line-height: inherit; text-decoration: underline !important; } .maincontent-wrapper { max-width: 100%; } } /* IFRAME */ .iframe-container { overflow: hidden; padding-top: 56.25%; position: relative; } .iframe-container iframe { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; } /* TRADEMARKS */ #trademark.wrapper { padding: 0 0 5.5em 0 !important; } .trademark-info { text-align: center; } #trademark.wrapper .row { padding: 0 0 1.5em 0 !important; border-bottom: 1px solid #e6e6e6; margin-bottom: 1.5em; } #trademark.wrapper .shortinfo { font-size: 0.75em; line-height: 1.2em; text-align: center; } #trademark.wrapper .shortinfo p { margin-bottom: 1.0em; } #trademark.wrapper h3, #trademark.wrapper .trademark-item { text-align: center; margin-bottom: 1.5em; } #trademark.wrapper h3 { margin-bottom: 1.5em; } #trademark.wrapper a { border-bottom: 1px solid #fff !important; } #trademark.wrapper .trademark-item { min-height: 120px; margin-bottom: 1.0em; } #trademark.wrapper .nr-5:after { content: ''; display: block; clear: both; height: 10px; width: 100%; } #trademark.wrapper .trademark-holder { position: relative; min-height: 100px; } #trademark.wrapper .trademark-holder h4 { font-size: 1.2em; } #trademark.wrapper .instore { position: absolute; bottom: 0; margin: auto; left: 0; right: 0; width: 80%; font-size: 0.75em; text-align: center; display: none; } #trademark.wrapper .instore div { margin: 0 auto; text-align: center; } #trademark.wrapper .instore div span { font-size: 1.5em; margin-right: 0.5em; } @media screen and (max-width: 1024px) { #trademark.wrapper .trademark-holder { min-height: 100px; } } @media screen and (max-width: 768px) { #trademark.wrapper .trademark-holder { position: relative; min-height: 60px; } #trademark.wrapper .trademark-item { min-height: 40px; margin-bottom: 1em; } #trademark.wrapper .trademark-item h4 { margin-bottom: 0.5em; font-weight: 400; } #trademark.wrapper .instore { width: 80%; } } /* BREADCRUMB*/ .breadcrumb { padding: 0; margin-bottom: 0.5em; list-style: none; background-color: transparent; border-radius: 0; text-align: center; } .breadcrumb-link::after { content: ""; } .breadcrumb .active { color: #999; } @media screen and (max-width: 767px) { .breadcrumb { margin-bottom: 15px; } .breadcrumb > li + li::before { padding: 0; } } /* GRID */ .umb-grid .row { margin-right: -15px !important; margin-left: -15px !important; } /* TAGS SOCIALA MEDIA */ .tags-socialmedia-wrapper { border-top: 1px solid #000; padding: 15px 0; margin-top: 15px; } .tags-socialmedia-wrapper .tagitems { margin-left: -15px !important; margin-right: -15px !important; } .extra .tags-socialmedia-wrapper { margin-top: 30px !important; } .tags-socialmedia-wrapper .tagitems span { font-size: 0.8em; display: block; } /* IMAGE GALLERY */ .imagegallery { margin-top: 20px; } .my-gallery figure { display: inline-block; padding: 0 !important; margin: 0 0.5% 0 0 !important; height: 180px !important; max-height: 180px; width: 24.5%; } .my-gallery figure:nth-child(4n) { margin: 0 0 0.5% !important } .my-gallery figure:nth-child(4n)::after { clear: both; content: " "; display: table; } .my-gallery figure a { border: none; } .my-gallery .gallery-item { position: relative; } .gallery-item:after { content: '\A'; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.8); opacity: 0; transition: all 1s; -webkit-transition: all 1s; right: 15px; } .gallery-item:hover:after { /*content: 'zooma';*/ opacity: 1; cursor: zoom-in; } .pswp { z-index: 10000; } .pswp__bg { background: #fff; background: rgba(255,255,255,.95); } .pswp__button:hover, pswp__button:focus { background-color: rgba(255,255,255,0.95); border: none; border-radius: 0; } .pswp__button--arrow--left::before, .pswp__button--arrow--right::before { background-color: rgba(255,255,255,0.95); } .pswp__caption { bottom: 150px; } .pswp__caption__center { text-align: center; max-width: 980px; margin: 0 auto; font-size: 14px; color: #000; /*background-color: rgba(255,255,255,0.7);*/ } .image-info { background-color: rgba(255,255,255,0.7); padding: 15px; } .pswp__share-tooltip { background: #f0f0f0 !important; } .pswp__share-tooltip a { color: #000 !important; border-bottom: none; } a.pswp__share--facebook:before { border-bottom-color: #f0f0f0 !important; } a .pswp__share--facebook { background: transparent url(slideshow/facebook-icon-black.png) no-repeat left center !important; } a.pswp__share--twitter { background: transparent url(slideshow/twitter-icon-black.png) no-repeat left center !important; } a.pswp__share--pinterest { background: transparent url(slideshow/pinterest-icon-black.png) no-repeat left center !important; } a.pswp__share--download { background: transparent url(slideshow/download-icon-black.png) no-repeat left center !important; } @media screen and (max-width: 1640px) { .my-gallery figure { height: 140px !important; max-height: 140px; } } @media screen and (max-width: 1280px) { .my-gallery figure { height: 120px !important } } @media screen and (max-width: 1023px) { .my-gallery figure { height: 113px !important } .my-gallery figure:nth-child(4n) { margin: 0 0.5% 0 0 !important; } } @media screen and (max-width: 767px) { .pswp__caption { bottom: 0; } .image-info { background-color: rgba(255,255,255,0); } .pswp__caption__center h2 { font-size: 1.5em; } .my-gallery figure { height: 120px !important; width: 48%; } } @media screen and (max-width: 480px) { .my-gallery figure { max-height: 70px; width: 48%; } } /* IMAGE LIST */ #imagelist { border-top: 1px solid #565656; margin-top: 1.5em; margin-left: 30px; margin-right: 30px; } #imagelist .box { margin-bottom: 0 !important; } #imagelist .box.image-gallery-box { margin-bottom: 20px !important; } #imagelist .image.fit { margin: 0 0 20px 0; max-width: 500px; } #imagelist .image.fit.tile { margin: 0 0 15px 0; } .imagelist { margin-top: 30px; margin-right: -15px !important; margin-left: -15px !important; } #imagelist span.title { margin: 0 0 15px 0; display: block; } #imagelist .imagelist ul { list-style: none; text-align: center; padding: 0; margin: 0; } #imagelist .imagelist li { display: inline-block; padding-right: 15px; padding-left: 15px; } #imagelist .imagelist li .image-text { display: block; text-align: center; margin: 1em 0; } .imagelist.withtext { margin-right: 0 !important; margin-left: 0 !important; } #imagelist span.title { margin: 0 0 15px 0; display: block; } .wrapper > .row > .inner { width: 72em; max-width: 100%; margin: 0 auto; border-top: 1px solid #999; padding-top: 30px; } .show-tag-name { text-transform: uppercase; padding-top: 2em; text-align: center; font-weight: 600; } @media screen and (max-width: 1680px) { .wrapper > .row > .inner { width: 64em; } } @media screen and (max-width:767px) { .wrapper > .row > .inner { padding-top: 0; } #imagelist { border-top: 1px solid #565656; margin-top: 1.5em; margin-left: 0; margin-right: 0; } } /* IMAGE GALLERY HOTSPOTS */ .notes { margin: auto; padding: 2rem 1.2rem 0; max-width: 35rem; font-family: "futura-pt",sans-serif; text-align: center; } .container-hotspots { width: 100%; max-width: 1344px; padding: 0; display: flex; flex-flow: column nowrap; justify-content: flex-start; align-items: center; } .lg-container { max-width: 100%; position: relative; margin: 1rem 1rem 0.7rem; padding: 0; } .image-short-info { position: absolute; bottom: 5px; right: 5px; z-index: 100; background-color: #000; color: #fff; padding: 2%; } .image-short-info h4 { margin-bottom: 0.5rem; } .lg-image { display: block; height: 100%; width: 100%; max-width: 1344px; /*object-fit: scale-down;*/ } .lg-image.mobile { display: none; } .lg-hotspot { position: absolute; margin: 0; padding: 0; transform: translate(-50%, -50%); z-index: 0; } .lg-hotspot:hover .lg-hotspot__button, .lg-hotspot:active .lg-hotspot__button { border-color: #ff774c; } .lg-hotspot:hover .lg-hotspot__button:after, .lg-hotspot:active .lg-hotspot__button:after { background-color: #ff774c; } .lg-hotspot--selected { z-index: 999; } .lg-hotspot--selected .lg-hotspot__label { opacity: 1; } .lg-hotspot__button { height: 48px; width: 48px; padding: 0px; border-radius: 100%; border: 1px solid #ff6000; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index: 999; animation: button-pulse 7s ease-in-out infinite; } .lg-hotspot__button:after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; content: ""; display: block; height: 16.8px; width: 16.8px; border-radius: 100%; border: 3px solid white; background-color: #ff6000; transition: border-color 1s linear; } .lg-hotspot__label { position: absolute; padding: 0 0 1.1em 0; width: 20em; max-width: 70vw; background-color: white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); font-family: "futura-pt",sans-serif; font-size: 14.5px; line-height: 1.45em; z-index: -1; /*pointer-events: none;*/ border-radius: 0; user-select: none; opacity: 0; transition: all 0.1s linear; text-align: center; } .lg-hotspot__label h4 { margin: 0; padding: 0.65em 24px; background-color: #f0f0f0; font-size: 1.1em; font-weight: normal; letter-spacing: 0.02em; color: #000; border-radius: 0; } .lg-hotspot__label p { margin: 0; padding: 0.5em 24px 0 24px; color: #333; } .lg-hotspot__label .wrapper-webshop { padding: 0.5em 0 0.5em; } .lg-hotspot__label .wrapper-webshop ul { list-style: none; text-align: center; padding: 0; margin: 0; } .lg-hotspot__label .wrapper-webshop li { display: inline-block; padding-right: 5px; padding-left: 5px; } .lg-hotspot__label .wrapper-webshop li .button { padding: 0 1.85714em; } .lg-hotspot__label .wrapper-webshop .button.webshop-link { height: 3.0em; line-height: 3.0em; } .lg-hotspot--top-left .lg-hotspot__label { top: 24px; left: 24px; } .lg-hotspot--top-right .lg-hotspot__label { top: 24px; right: 24px; } .lg-hotspot--bottom-right .lg-hotspot__label { right: 24px; bottom: 24px; } .lg-hotspot--bottom-left .lg-hotspot__label { bottom: 24px; left: 24px; } @keyframes button-pulse { 0% { transform: scale(1, 1); opacity: 1; } 40% { transform: scale(1.15, 1.15); opacity: 1; } 100% { transform: scale(1, 1); opacity: 1; } } .lg-hotspot.mobile { display: none; } .lg-hotspot.desktop { display: block; } @media screen and (max-width: 767px) { .lg-image.desktop { display: none !important; } .lg-image.mobile { display: block; } .lg-hotspot.desktop { display: none; } .lg-hotspot.mobile { display: block; } .image-short-info { /*position:static;*/ text-align: center; background-color: #fff; color: #000; margin-top: 1.0em; font-size: 12px; } .image-short-info h4 { font-size: 1em; margin-bottom: 0.2rem; } .lg-hotspot__label { position: absolute; padding: 0 0 1.1em 0; width: 20em; max-width: 40vw; } .lg-hotspot__label p { font-size: 12px; } .lg-hotspot__label .wrapper-webshop .button.webshop-link { height: 3.0em; line-height: 3.0em !important; padding: 0 1em !important; } } #carousel, #carousel-thumbs { width: 100%; max-width: 1344px; margin: 0 auto; } #carousel-thumbs { padding: 0 30px; } .carousel-inner.row { margin-left: 0 !important; margin-right: -15px !important; } #carousel .item { max-height: 540px; overflow: hidden; } .carousel-inner img { width: 100%; } .carousel-control { display: none; } #carousel-thumbs .item.active div { padding: 0 5px; max-height: 110px; overflow: hidden; margin-bottom: 10px; } #carousel-thumbs .item img { opacity: 0.5; } #carousel-thumbs .item.active div.active img { opacity: 1; } #carousel-thumbs .item.active div:not(.active) img { cursor: pointer; } #carousel-thumbs .carousel-control { background-image: none; } .productinfo { border-top: 1px solid #000; padding-top: 1.5em; } .tileitem { margin-bottom: 30px; } .carousel-caption { display: none; } @media screen and (min-width: 1920px) { #carousel .item { max-height: 740px; overflow: hidden; } } @media screen and (max-width: 767px) { #carousel .item { max-height: 540px; overflow: hidden; } #carousel .item img { /*max-width: inherit; max-height: inherit; height: 540px; width: inherit; object-fit: cover;*/ } } /* CONTACT INFO */ .wrapper.contactinfo { background-color: #e6e6e6; } .wrapper.contactinfo h3 span { display: block; font-size: 0.8em; } .wrapper.contactinfo img { width: 100%; } .wrapper.contactinfo .left { padding-right: 3.5em; text-align: center; } .wrapper.contactinfo .right { padding-left: 3.5em; } .contactinfo .category ul { list-style: none !important; padding-left: 0 !important; } .contactinfo .category ul li { padding: 0 0 5px 0 !important; } @media screen and (max-width: 736px) { .wrapper.contactinfo .left, .wrapper.contactinfo .right { padding: 0; } } /* FORMS VALIDATION */ .field-validation-error { margin-left: 2.1em; color: #cd0000; font-style: italic; } /* BOOKING DATE */ .datepicker table tr td.new, .datepicker table tr td.old { height: 0; line-height: 0; visibility: hidden; } .datepicker-dropdown { margin-left: 3.5em; margin-top: 0.5em; } /* CALENDAR MODAL */ .panel-body { display: none; } .modal-backdrop { z-index: 99998; } .panel { margin-bottom: 0; background-color: #fff; border: none; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; } .panel-heading { padding: 0; border-bottom: none; border-top-left-radius: 0; border-top-right-radius: 0; position: relative; top: 9px; } .panel-title { padding: 0 !important; border-radius: 0 !important; margin-bottom: 0 !important; } .modal-header { padding: 15px 15px 0; border-bottom: none; text-align: center; } .modal-body { position: relative; padding: 15px 15px 0; text-align: center; } .modal-body p { margin: 0 0 0.5em 0 !important; } .modal-footer { padding: 0 15px 15px; text-align: right; border-top: none; } .close { height: auto; } .close:hover { border-radius: 0; border: none; background-color: transparent; } @media screen and (min-width: 768px) { .modal-dialog { width: 400px; margin: 30px auto; } } @media screen and (max-width: 767px) { .modal-dialog { width: 280px; margin: 30px auto; } } /* CONTACT MODAL */ .modal-contact .modal-header { padding: 3em 3em 1em; } .modal-contact .modal-body { position: relative; padding: 1em 3em 3em; text-align: left; } .modal-contact .modal-body p { margin: 0 0 0.5em 0 !important; } .modal-contact .modal-dialog { width: auto; max-width: 600px; margin: 30px auto; } .modal-contact .contact-modal-form-content { margin-bottom: 3em; } .modal-contact input[type="submit"] { background-color: #f5f5f5; } .modal-contact input[type="submit"]:hover { background-color: rgba(86, 86, 86, 0.2); } .close { height: auto; float: none; position: absolute; top: 1em; right: 1em; font-size: 40px; color: #000 !important; font-weight: 400; } @media screen and (min-width: 768px) { .modal-contact .modal-dialog { width: auto; max-width: 64em; margin: 30px auto; } } @media screen and (max-width: 767px) { .modal-contact .modal-body .contact-col-2 { display: none; } .modal-contact .modal-body { padding: 1em 1em 1.5em; } .close { top: 10px; right: 20px; font-size: 30px; } } /* FOOTER MODAL */ .modal-extra-field .modal-body { position: relative; padding: 15px 30px 0; text-align: left; } .modal-extra-field .modal-body p { margin: 0 0 0.5em 0 !important; white-space: nowrap; } @media screen and (min-width: 768px) { .modal-extra-field .modal-dialog { width: auto; max-width: 450px; margin: 30px auto; } } /* EMPLOYEES */ .employee-container { margin-left: 0 !important; margin-right: 0 !important; } .employee-container .row { margin-left: -15px !important; margin-right: -15px !important; } .employee-container .employee-link { border-bottom: none !important; } .employee-container .items { height: auto; display: inline-block; width: 33.33%; } .employee-container .items .image-holder img { width: 100%; height: 100%; object-fit: contain; } /*.employee { width: 100%; padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: cover !important; background-position: top center !important; height: 300px; position: relative; } .services { background: #fff; color: #000; padding: 20px 20px 10px 20px; margin-bottom: 30px; } .employee > .textinfo { display: table-cell; vertical-align: bottom; min-height: 380px !important; background-color: transparent; } .employee > .textinfo:hover { background-color: rgba(255,255,255,0.8); } .employee > .textinfo h3 span { width: auto !important; background-color: rgba(255,255,255,0); padding: 15px 30px; } .employee > .textinfo:hover h3 span { background-color: transparent; } */ .employee h3 { color: #fff; margin-bottom: 44px; text-transform: uppercase; font-size: 0.9em; } .employee > .textinfo:hover h3 { color: #000; } .employee p { color: #000; font-size: 0.7em; } .employee > .textinfo .shorttext { opacity: 0; display: none; margin-bottom: 15px; } .employee > .textinfo:hover .shorttext { opacity: 1; display: block; } .employee-info h1 { margin: 0 !important; } .contact-employee { margin-top: 2.5em; margin-left: -15px !important; margin-right: -15px !important; } .contact-employee .phone-email { padding-bottom: 1.5em; margin-bottom: 1.5em; border-bottom: 1px solid #000; } .contact-employee .phone-email h4 { font-size: 1.2em; } .contact-employee .icon { margin-right: 1.5em; } .employee-info .imagelist h3 { display: none; } @media screen and (max-width: 1680px) { .employee h3 { font-size: 0.8em; } } @media screen and (max-width: 1280px) { .employee h3 { font-size: 0.7em; } } @media screen and (max-width: 1023px) { .employee h3 { font-size: 0.8em; } } @media screen and (max-width: 767px) { .employee-info h3 { margin-left: 15px; margin-right: 15px; } } /* EMPLOYEES PAGE SHOW PRODUCT MODAL */ .serieitem { margin-bottom: 30px; } .employee-info .infoboxes { width: 100%; padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: cover !important; background-position: center center !important; height: 300px; position: relative; } .employee-info .services { background: #000; color: #fff; padding: 0; margin-bottom: 30px; } .employee-info .infoboxes > .textinfo { display: table-cell; vertical-align: bottom; min-height: 300px !important; background-color: transparent; } .employee-info .infoboxes > .textinfo:hover { background-color: rgba(0,0,0,0.8); } .employee-info .infoboxes > .textinfo footer { opacity: 0; display: none; background: url(link-to-page.png) no-repeat top center; } .employee-info .infoboxes > .textinfo:hover footer { opacity: 1; display: block; padding: 30px; cursor: pointer; } .employee-info .infoboxes > .textinfo:hover footer .order { text-align: center; } .employee-info .infoboxes > .textinfo:hover footer .order span { font-size: 0.8em; display: block; padding-top: 10px; } @media screen and (max-width: 1024px) { .employee-info .infoboxes { height: 200px; } .employee-info .infoboxes > .textinfo { min-height: 200px !important; } } @media screen and (max-width: 800px) { .employee-info .infoboxes { height: 300px; } .employee-info .infoboxes > .textinfo { min-height: 300px !important; } } @media screen and (max-width: 767px) { .employee-info .infoboxes > .textinfo footer { background: url(link-to-page.png) no-repeat top center; } .employee-info .infoboxes > .textinfo footer { opacity: 1; display: block; padding: 30px; cursor: pointer; } .employee-info .infoboxes > .textinfo footer .order { text-align: center; } .employee-info .infoboxes > .textinfo footer .order span { font-size: 0.8em; display: block; padding-top: 10px; } } /* BOOKING MEETING */ .booking-form { text-align: center; } #form-booking-outer label { display: block; margin: 0; color: #000; font-weight: 400; font-size: 1em; } #form-booking-outer .radio { display: inline-block; width: 40%; margin-top: 20px; } .datepicker-days { width: 320px; } .datepicker table th, .datepicker table th { font-size: 1.2em; } .datepicker table tr td.today { background-color: #f90; background-image: none; } .datepicker table tr td.active.active, .datepicker table tr td.active:hover, .datepicker table tr td.active:hover.active { background-color: #333; color: #fff; background-image: none; } .datepicker table tr td.disabled, .datepicker table tr td.disabled:hover { background-color: #f5f5f5; } /* EVENT SPECIAL FORM */ #form-eventspecial-outer { text-align: left; } .radio-wrapper ul { list-style: none; margin: 0; padding: 0; } .radio-wrapper ul#specialevent li.event-item { display: inline-block; padding: 0.5em; width: 33%; } .radio-wrapper ul li label { font-size: 0.8em; } #form-eventspecial-outer .form-control.number { width: 110px; } @media screen and (max-width: 840px) { .radio-wrapper ul#specialevent li.event-item { display: inline-block; padding: 0.5em; width: 46%; } } @media screen and (max-width: 600px) { .radio-wrapper ul#specialevent li.event-item { display: inline-block; padding: 0.5em; width: 100%; } } /* RECYCLING FORM */ #recycling { padding-top: 9em; } .wrapper.recycling { padding: 1.5em 0; } .wrapper.recycling .row.recycling-form-link { text-align: center; } #form-recycling-outer, #form-recycling-result { border-top: 1px solid #000; padding-top: 2em; } .radio.alternative { display: inline-block; width: 30%; } .extra-info { text-align: center; } label span.icon.grey.fa-asterisk, .extra-info span.icon.fa-asterisk { font-size: 10px; color: #999; position: relative; top: -5px; } @media screen and (max-width: 1279px) { .radio.alternative { display: inline-block; width: 50%; } } @media screen and (max-width: 1080px) { .radio.alternative { display: inline-block; width: 100%; } } /* TILE HELP FORM */ .radio .more { list-style: none; margin: 0; padding: 0; } .radio .more li { display: inline-block; text-align: left; padding-left: 0; } .radio .more li:nth-child(1) { width: 30%; } .radio .more li:nth-child(2) { width: 60%; } /* Upload files*/ .inf__drop-area * { box-sizing: border-box; } .inf__drop-area { position: relative; display: flex; align-items: center; height: 150px; width: 100%; max-width: 100%; border: 2px dashed #000; border-radius: 3px; padding: 0 20px; transition: 0.2s; background-color: #fff; } .inf__drop-area.is-active { background-color: rgba(0, 20, 20, 0.03); } input[type="file"] { position: absolute; left: 0; top: 0; height: 100%; width: 100%; opacity: 0; cursor: pointer; } input[type="file"]:focus { outline: none; } .inf__btn { display: inline-block; border: 1px solid #000; border-radius: 0; padding: 10px 20px; margin-right: 10px; text-transform: uppercase; font-weight: 400; font-size: 0.7em; letter-spacing: 0.2em; } .inf__btn:hover { background-color: rgba(86, 86, 86, 0.2); } .inf__hint { flex: 1; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } @media screen and (max-width: 767px) { .radio .more li:nth-child(1) { width: 100%; } .radio .more li:nth-child(2) { width: 100%; } } /* PRODUCTS */ #referenser p { margin: 0; } .main-info { width: 72em; max-width: 100%; margin: 0 auto; } @media screen and (max-width: 1680px) { .main-info { width: 64em; } } @media screen and (max-width: 840px) { .main-info { padding: 0 1.5em; } } .productlist .wrapper { padding: 0 !important; } .productlist .wrapper .inner, .tile-filter .inner { width: 80%; } .products { padding-top: 10px; padding-bottom: 36px; } .infoboxes > .textinfo .product-intro { width: auto; background-color: transparent; padding: 15px 30px; } .infoboxes > .textinfo .product-intro h3, .infoboxes > .textinfo .product-intro h4 { margin: 0 auto; } .infoboxes > .textinfo .product-intro h3 span { background-color: rgba(255,255,255,0.85); padding: 15px 30px; margin-bottom: 0 !important; width: auto !important; } .infoboxes > .textinfo:hover .product-intro h3 span { background-color: rgba(255,255,255,0); } @media screen and (max-width: 1024px) { .infoboxes > .textinfo .product-intro { padding: 15px 30px 0; } .infoboxes > .textinfo .product-intro h3 span { padding: 5px 15px; } .productlist .wrapper .inner, .tile-filter .inner { width: 100%; } } /* FILTER */ /* Filter serier */ .filter-list-serie ul { list-style: none; margin: 0; padding: 0; width: 100%; } .search-series-wrapper { margin: 0 auto; max-width: 640px; position: relative; } .serie-textfield { max-width: 640px; margin: 0 auto; background-color: #e6e6e6 !important; border: none !important; font-size: 20px; font-weight: 600; text-transform: uppercase; } .serie-textfield:focus { box-shadow: none !important; } #close { position: absolute; z-index: 100; top: 10px; right: 10px; font-weight: 600; font-size: 18px; width: 30px; height: 30px; text-align: center; } #result { position: absolute; padding: 0; width: 100%; z-index: 10; top: 70px; } #result ul { list-style-type: none; padding: 0; margin: 0; } #result ul li { padding: 0.5em 2em; background-color: #e6e6e6; } #result ul li:last-child { padding: 0.5em 2em 2em 2em; } /* Filter */ .row.filter-list { text-align: center !important; } .row.filter.targetdiv { padding: 1.5rem 1rem; } .filter-list ul { list-style: none; margin: 0; padding: 0; width: 100%; font-size: 0px; } .filter-list ul#filter-serie { text-align: center; } .filter-list ul#filter li, .filter-list ul#filter-serie li { position: relative; display: inline-block; padding: 1em; margin: 1em; width: 100%; max-width: 300px; background-color: #e6e6e6; font-size: 16px; text-align: left; } .filter-list ul#filter-serie li { text-align: left; } .filter-list ul#filter li li, .filter-list ul#filter-serie li li { padding: 0.5em; margin: 0; } .filter-list ul#filter > li span, .filter-list ul#filter-serie > li span { color: #ccc; display: block; font-size: 20px; } .filter-list ul#filter > li span::after, .filter-list ul#filter-serie > li span::after { font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; content: '\f078'; font-size: 18px; height: 40px; width: 40px; position: absolute; top: 15px; right: 10px; padding: 2px 5px 6px 5px; text-align: center; border: 2px solid #000; border-radius: 100%; color: #000; } .filter-list ul#filter > li span.active::after, .filter-list ul#filter-serie > li span.active::after { content: '\f077'; } .filter-list ul#filter li span.category, .show-area ul#arealist li span.area, .filter-list ul#filter-serie li span.category { cursor: pointer; color: #000; text-transform: uppercase; font-weight: 600; } /*.filter-list ul#filter li span.category:hover {border-bottom: 1px solid #f90; color: #f90;}*/ .filter-list ul#filter li span.line { border-bottom: 1px solid #fff; } .row.filter-list .row.filter { position: absolute; top: 56px; left: 0; z-index: 10; background-color: #e6e6e6; width: 100%; } .filter ul#colorlist li.color-item, .filter ul#surfacelist li.surface-item, .filter ul#shapelist li.shape-item, .filter ul#appearancelist li.appearance-item { display: inline-block; padding: 0.5em; width: 100%; margin: 0; vertical-align: top; } .filter ul#specialevent li.color-item { display: inline-block; width: 50%; } .filter ul#projecttypeslist li.project-types-item { display: inline-block; } .filter ul#sizelist li.size-item { display: inline-block; } .filter ul#arealist li.area-item { display: inline-block; } .filter ul#appearancelist li.appearance-item, .filter ul#surfacelist li.surface-item { display: inline-block; } .filter ul#shapelist li.shape-item { display: inline-block; } .filter ul#speciallist li.special-item { display: inline-block; } .filter ul#serielist li.serie-item { display: inline-block; } .filter ul li label { font-size: 18px; } #filterresult ul { margin: 1.0rem 0; text-align: center; } #filterresult ul li { display: inline-block; padding: 0; font-size: 0.8em; } #filterresult ul li span { padding: 5px 15px; margin: 0 5px 10px; background-color: #f5f5f5; display: inline-block; cursor: pointer; } #filterresult ul li span.filter-clear { background-color: #555; color: #fff; display: none; } #filterresult ul li span.filter-clear.hide { } #filterresult ul li span::before { font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; content: '\f058'; font-size: 14px; line-height: 14px; color: #000; padding-right: 10px; } #filterresult ul li span.filter-clear::before { color: #fff; } @media screen and (max-width: 840px) { .row.filter.targetdiv { margin-left: 0 !important; margin-right: 0 !important; } .filter ul#colorlist li.color-item, .filter ul#surfacelist li.surface-item { display: inline-block; padding: 0.5em; width: 25%; } .filter ul#surfacelist li.surface-item, .filter ul#shapelist li.shape-item, .filter ul#speciallist li.special-item { width: 33%; } .filter ul#appearancelist li.appearance-item { width: 40%; } } @media screen and (max-width: 480px) { .search-series-wrapper { margin: 0 1.5em; max-width: 480px; position: relative; } .filter-list ul#filter li, .filter-list ul#filter-serie li { max-width: 320px; margin: 1em 0; } .filter ul#colorlist li.color-item, .filter ul#surfacelist li.surface-item { width: 100%; } .filter ul#sizelist li.size-item { width: 100%; } .filter ul#surfacelist li.surface-item, .filter ul#shapelist li.shape-item, .filter ul#speciallist li.special-item { width: 100%; } .filter ul#appearancelist li.appearance-item { width: 100%; } .filter ul#serielist li.serie-item { width: 100%; } .filter ul#arealist li.area-item { width: 100%; } .filter ul#specialevent li.color-item { width: 100%; } .filter-list ul#filter > li span::after, .filter-list ul#filter-serie > li span::after { top: 10px; padding-top: 5px; } } @media screen and (max-width: 320px) { .filter-list ul#filter li, .filter-list ul#filter-serie li { max-width: 280px; margin: 1em 0; } } /* PRODUCT PAGE MODAL */ #modalDiv { padding: 0 !important; } /*#modalDiv > div {width: 80%; margin: 0 auto;}*/ #modalDiv .modal-dialog { width: 100%; height: 100%; margin: 0; padding: 0; } #modalDiv .modal-dialog .modal-content { width: 100%; height: 100vh; margin: 0; top: 0; left: 0; min-height: 100%; border: 0 none; border-radius: 0; box-shadow: none; } #modalDiv .modal-dialog .modal-header { padding: 0; } .modal-show-page .products { padding-top: 0; display: flex; flex-wrap: wrap; width: 100%; } /*.modal-show-page .modal-body .items {padding:0 2em 2em; height:auto; flex:50%; }*/ .modal-show-page .modal-body .i-left { padding: 0 2em 2em; height: auto; flex: 34%; } .modal-show-page .modal-body .i-right { padding: 0 2em 2em; height: auto; flex: 66%; } .modal-show-page .modal-body .items.lightgrey { background-color: #f5f5f5; padding: 2.5em 3em; } .modal-show-page .modal-body .items.lightgrey h2 { margin: 0; } .modal-show-page .modal-body .items .imageholder { padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: contain !important; background-position: center center !important; height: 100%; width: 100%; } .modal-show-page .modal-body .items .imageholder img { width: 100%; height: 100%; object-fit: contain; } .modal-show-page .modal-body .items .image-tools { text-align: right; } .modal-show-page .modal-body .items .tileinfo { padding-bottom: 1.5em; } .modal-show-page .modal-body .items .tile-short-text { border-top: 1px solid #000; border-bottom: 1px solid #000; padding: 1em 0; margin: 1em 0 2em; } .modal-show-page .modal-body { position: relative; padding: 10% 30px; text-align: left; } .modal-show-page .modal-body #wrapper { margin-top: 40px; } .modal-show-page .modal-body p { margin: 0 0 0.5em 0 !important; } .modal-show-page .modal-body ul { list-style: none; padding: 0; margin: 0; } .modal-show-page .modal-body .tileinfo ul li { display: block; } .modal-show-page .modal-body .tileinfo ul li li { display: inline-block; padding-right: 1em; padding-left: 0; vertical-align: top; } .modal-show-page .modal-body ul li.cart-list { width: auto; } .modal-show-page .modal-body .tileinfo li li:nth-child(odd) { width: 35%; } .modal-show-page .modal-body .tileinfo li li:nth-child(even) { width: 60%; } .modal-show-page .modal-body .tileinfo li ul { border-bottom: 1px solid #e6e6e6; padding: 10px 0; } .modal-show-page .modal-body .tileinfo li ul:hover { border-bottom: 1px solid #999; } .modal-show-page .modal-body .tileinfo li ul ul { border-bottom: 1px solid #fff; } .modal-show-page .modal-body .tileinfo li ul:hover ul { border-bottom: 1px solid #fff; } .modal-show-page .modal-body .icon { font-size: 24px; padding-right: 0.5em; } .modal-show-page .modal-body .more-info { text-decoration: none; border: none; } .modal-show-page .modal-body .icon.info { font-size: 20px; } .modal-show-page .modal-body .items .image-tools .icon { font-size: 32px; } .modal-show-page .modal-body .tile-icons li { padding-right: 0; padding-left: 0; margin-right: 0.5em; display: inline-block; } .modal-show-page .modal-body .tile-icons .button { padding: 0 1em; } .modal-show-page .modal-body .tile-icons .icon { padding-right: 0; } .modal-show-page .modal-body li.cart-list .icon.fa-plus-circle { padding-right: 0.5em; } .modal-show-page .modal-body .button-text { position: relative; top: -3px; } .modal-show-page .modal-body .orderbtn .in-cart { display: none; } .modal-show-page .modal-body .orderbtn .cart-item-add { display: block; } /*.modal-show-page .modal-body .tileitem p {font-size:14px; text-align:center;} .modal-show-page .modal-body .tagitems span {text-align: left !important;}*/ #modalDiv .productpage { padding: 0 !important; } #modalDiv .modal-header { padding: 5px 15px 0; } #modalDiv .productpage .inner { width: 100%; } #modalDiv .close, #addToFav .close { font-size: 80px; font-weight: 400; color: #000 !important; width: 80px; position: absolute; z-index: 100; opacity: 1; } @media screen and (max-width: 767px) { #modalDiv .modal-dialog .modal-content { width: 100%; height: 100%; } .modal-header .close { padding: 0 !important; font-size: 50px !important; width: 50px !important; font-weight: 400; } .modal-show-page .modal-body { padding: 0 30px; } .modal-show-page .modal-body .products { margin-top: 2em; } /*.modal-show-page .modal-body .items {flex: 100%; }*/ .modal-show-page .modal-body .i-left, .modal-show-page .modal-body .i-right { flex: 100%; padding: 0; } .modal-show-page .modal-body .items .imageholder { min-height: 400px; } .modal-show-page .modal-body .tileinfo li li:nth-child(odd) { width: 60%; } .modal-show-page .modal-body .tileinfo li li:nth-child(even) { width: 30%; } .modal-show-page .modal-body li ul li.surface-item { margin-top: 0.4em; width: 100% !important; } .modal-show-page .modal-body .tile-icons li { padding: 0 1em; margin: 0 auto 1em auto; } .modal-show-page .modal-body .tile-icons ul, .modal-show-page .modal-body .orderbtn { text-align: center; } .modal-show-page .modal-body .tile-icons .icon { top: 3px; } } @media (min-resolution: 120dpi) { #modalDiv .modal-dialog .modal-content { width: 100%; height: 100%; min-height: 100vh; } .modal-show-page .modal-body { padding: 0 30px; } } /* ADD FAVOURITIES */ #addToFav .modal-dialog { width: 100%; max-width: 1200px; margin: 30px auto; } #addToFav .modal-dialog .modal-header { padding: 0; text-align: right; } #addToFav .close { font-size: 80px; font-weight: 400; color: #000 !important; width: 80px; position: relative; z-index: 100; right: 0; top: 0; } #addToFav .modal-body { position: relative; padding: 0 30px; text-align: left; } #addToFav .modal-body h3 { margin: 0; } #addToFav .modal-body .field { margin-bottom: 0.5em; } #addToFav .modal-body .select-wrapper { margin-top: 0.5em; } /* TILE COLOR LIST */ .tile-filter.wrapper { padding: 2.5em 0 0 0; } .tile-filter.wrapper form { margin: 0; } .seriename { font-size: 0.8em; } .list-pagination { border-top: 1px solid #000; padding-top: 2em; } .list-pagination ul { list-style: none; margin: 0; padding: 0; text-align: center; } .list-pagination ul li { display: inline-block; margin: 0 1em; border: 1px solid #000; padding: 0; } .list-pagination ul li.active { background-color: #ccc; border: #ccc solid 1px; } .list-pagination ul li a { border-bottom: none; padding: 0.5em 1em; display: block; text-align: center; position: relative; } #productgallery { border: none; } #carousel, #carousel-thumbs { width: 100%; max-width: 1344px; margin: 15px auto; } .carousel-inner.row { margin-left: 0 !important; margin-right: -15px !important; } #carousel .item { max-height: 540px; overflow: hidden; } .carousel-inner img { width: 100%; } .carousel-control { display: none; } #carousel-thumbs .item.active div { padding-left: 0 !important; max-height: 110px; overflow: hidden; } #carousel-thumbs .item img { opacity: 0.5; } #carousel-thumbs .item.active div.active img { opacity: 1; } #carousel-thumbs .item.active div:not(.active) img { cursor: pointer; } #carousel-thumbs .carousel-control { background-image: none; } .productinfo { border-top: 1px solid #000; padding-top: 1.5em; } .tileitem { margin-bottom: 30px; border: #fff solid 1px; } .tileitem p { text-align: center; font-size: 16px; } .tileitem:hover { border: #333 solid 1px; } .tileitem.specialpieces:hover { border: #fff solid 1px; } .productpage .infoboxes { width: 100%; max-width: 150px; padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: contain !important; background-position: center center !important; height: 150px; position: relative; margin: 0 auto; } .productpage .services { background: #000; color: #fff; padding: 0; margin-bottom: 30px; } .productpage .infoboxes > .textinfo { display: table-cell; vertical-align: bottom; min-height: 150px !important; background-color: transparent; } .productpage .infoboxes > .textinfo:hover { background-color: rgba(0,0,0,0.8); } .productpage .infoboxes > .textinfo footer { opacity: 0; display: none; background: url(add.png) no-repeat top center; } .productpage .infoboxes > .textinfo:hover footer { opacity: 1; display: block; padding: 30px; cursor: pointer; } .productpage .infoboxes > .textinfo:hover footer .order { text-align: center; } .productpage .infoboxes > .textinfo:hover footer .order span { font-size: 0.8em; display: block; padding-top: 10px; } .productpage .pdflist { padding-bottom: 30px; margin-top: 30px; margin-right: -15px !important; margin-left: -15px !important; } .productpage ul.pdf { margin: 0; } .productpage ul.pdf li { float: left; display: block; padding-right: 30px; padding-left: 0; } .productpage ul.pdf li span { padding-right: 5px; margin: 0 5px 5px 0; } .properties-wrapper { border-top: 1px solid #000; padding: 30px 0 15px; display: none; } .properties-wrapper .prop { margin-left: -15px !important; margin-right: 15px !important; } .properties-wrapper .prop span { font-size: 0.8em; display: block; text-align: left; } .productinfo .declare { margin-top: 15px; } .productinfo .declare span { display: inline !important; text-align: left !important; padding: 0 10px; } .prov-order-info { text-align: left !important; position: relative; top: -15px; } .product-link-to-page { margin: 1em 0; } .product-link-to-page p { text-align: center; } .related-item .related-item-image { background-repeat: no-repeat !important; background-size: cover !important; background-position: center center !important; height: 250px; margin-bottom: 1.0em; } .related-item p { text-align: center; } .product-link-to-page span { display: inherit; margin-right: 1em; position: relative; top: 3px; } @media (min-width: 768px) and (max-width: 1023px) { .properties-wrapper .prop { margin-bottom: 30px; } .properties-wrapper .col-sm-6:nth-child(3n+1) { clear: left; } } @media screen and (max-width: 1680px) { .productpage .infoboxes { height: 150px !important; } .productpage .infoboxes > .textinfo { min-height: 150px !important; } } @media screen and (max-width: 1280px) { .tileitem { height: 200px; } .productpage .infoboxes { height: 115px !important; } .productpage .infoboxes > .textinfo { min-height: 115px !important; } } @media screen and (max-width: 1023px) { .productpage .infoboxes { height: 115px !important; } .productpage .infoboxes > .textinfo { min-height: 115px !important; } } @media screen and (max-width: 767px) { .tileitem p { text-align: center; } .productpage .infoboxes { height: 200px !important; } .productpage .infoboxes > .textinfo { min-height: 115px !important; } .productinfo .declare span { display: block !important; text-align: left !important; padding: 0; } .productpage .pdflist { margin-right: 0 !important; margin-left: 0 !important; } .properties-wrapper .prop { margin-bottom: 30px; } .cart-item-add { cursor: pointer; } .productpage .infoboxes > .textinfo footer { background: url(add.png) no-repeat top center; } .productpage .infoboxes > .textinfo footer { opacity: 1; display: block; padding: 30px; cursor: pointer; } .productpage .infoboxes > .textinfo footer .order { text-align: center; } .productpage .infoboxes > .textinfo footer .order span { font-size: 0.8em; display: block; padding-top: 10px; } } @media screen and (min-width: 1920px) { #carousel .item { max-height: 740px; overflow: hidden; } .productpage .infoboxes { height: 200px !important; } .productpage .infoboxes > .textinfo { min-height: 200px !important; } } /* REF PAGE SHOW PRODUCT MODAL */ .serieitem { margin-bottom: 30px; } .refpost .infoboxes { width: 100%; padding-left: 0; padding-right: 0; display: table; background-repeat: no-repeat !important; background-size: cover !important; background-position: center center !important; height: 300px; position: relative; } .refpost .services { background: #000; color: #fff; padding: 0; margin-bottom: 30px; } .refpost .infoboxes > .textinfo { display: table-cell; vertical-align: bottom; min-height: 300px !important; background-color: transparent; } .refpost .infoboxes > .textinfo:hover { background-color: rgba(0,0,0,0.8); } .refpost .infoboxes > .textinfo footer { opacity: 0; display: none; background: url(link-to-page.png) no-repeat top center; } .refpost .infoboxes > .textinfo:hover footer { opacity: 1; display: block; padding: 30px; cursor: pointer; } .refpost .infoboxes > .textinfo:hover footer .order { text-align: center; } .refpost .infoboxes > .textinfo:hover footer .order span { font-size: 0.8em; display: block; padding-top: 10px; } /* FEEDBACK FORM */ .feedback { position: fixed; left: 50px; bottom: 0; z-index: 1000; width: 210px; display: block; } .feedback a#feedback_button { display: block; height: 50px; width: 205px; margin-right: 95px; text-align: left; background: #f0f0f0; padding: 10px 20px; cursor: pointer; color: #000; font-size: 18px; border: none; } #feedback_button .icon { margin-left: 2em !important; } .feedback .formfeedback { height: 600px; width: 310px; background: #f0f0f0; padding: 15px; display: none; color: #000; position: relative; right: 0; bottom: 0; } .formfeedback p { font-size: 0.8em; line-height: 1.3em; } .formfeedback input { background: #ffffff; border-color: rgba(86, 86, 86, 0.25); height: 3em; padding: 0 1em; font-size: 0.8em; } .formfeedback textarea { background: #ffffff; border-color: rgba(86, 86, 86, 0.25); padding: 1em; font-size: 0.8em; } .formfeedback input[type="submit"] { font-weight: 400; font-size: 0.7em; height: 3em; line-height: 3em; border-radius: 0px; padding: 0 1em; text-align: center; text-decoration: none; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.2em; } #form-result .feedback-success { padding: 3em 1em; text-align: center; } @media screen and (max-width: 767px) { .formfeedback p { font-size: 1.0em; line-height: 1.4em; } .formfeedback input, .formfeedback textarea { font-size: 1.0em; } .feedback { left: 10px; display: none; } .formfeedback input[type="submit"] { font-size: 0.9em; height: 3.5em; line-height: 3.5em; padding: 0 1em; letter-spacing: 0.2em; } } /* BESTÄLLNING */ .cart-table tr { display: flex; } .cart-table td, .cart-table th { align-items: center; display: flex; justify-content: flex-start; flex: 2; } .cart-table td:first-child, .cart-table td:last-child, .cart-table th:first-child, .cart-table th:last-child { flex: 1; } .cart-table td:last-child, .cart-table th:last-child { justify-content: flex-end; } .cart-thumbnail { max-width: 40px; height: 40px; } .prev-orders tr { display: flex; align-items: center; } .prev-orders > tbody > tr { border-bottom: 1px solid #ccc !important; } .prev-orders > tbody > tr:last-child { border-bottom: 0 !important; } .prev-orders td, .prev-orders th { align-items: center; display: flex; justify-content: flex-start; flex: 1; border: 0 !important; } .prev-orders table tr { display: flex; align-items: center; } .prev-orders > tbody > tr > td:first-child, .prev-orders > thead > tr > th:first-child { flex: 3; } .prev-orders > tbody > tr > td:last-child { justify-content: flex-end; } .prev-orders table { margin-bottom: 0; } .order-table .orderRow, .order-table .collapseOrderRow, .order-table-header { display: flex; justify-content: space-between; align-items: center; padding: 1rem; } .order-table-header { font-weight: 400; } .order-table .orderRowWrapper:nth-child(odd) { background: #eee; } .order-table .orderRow div, .order-table .collapseOrderRowWrapper div, .order-table-header div { flex: 1; } .order-table .f-3, .order-table-header .f-3 { flex: 3 !important; } .order-table .collapseOrderRowWrapper { border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; } .order-table .collapseOrderRowWrapper div div { display: flex; } .order-table .favorite, .order-table-header .favorite { flex: 0 !important; padding-right: 1rem; } .order-table .favorite a { border-bottom: 0; } .order-success { display: none; } .cart-wrapper .order-success, .cart-wrapper .cart-is-empty { text-align: center; } .more-info-project .col-md-6, .more-info-project .col-md-12 { padding-right: 0; padding-left: 0; } .more-info-project .col-md-6.pname { padding-right: 15px !important; } .more-info-project .col-md-6.size { padding-left: 15px !important; } .more-info-project .col-md-12 { margin-bottom: 30px; } @media screen and (max-width: 767px) { .order-table .orderRow { display: block; } .order-table-header { display: none; } .order-table .f-3::before { content: "Ordernamn: "; font-weight: 400; } .order-table .plattor::before { content: "Antal plattor: "; font-weight: 400; } .order-table .datum::before { content: "Datum: "; font-weight: 400; } .order-table .text-right { text-align: left; margin: 15px 0; } .more-info-project .col-md-6.pname { padding-right: 0 !important; } .more-info-project .col-md-6.size { padding-left: 0 !important; } } /* PROFIL */ .form-control { background-color: #fff !important; border-color: rgba(86, 86, 86, 0.25); border-radius: 0; } .customer li { padding: 0; } .nav-tabs.nav-justified > li > a { border-bottom: 1px solid #000; border-radius: 0; padding: 1em 0; } .nav-tabs.nav-justified > .active > a { border-bottom: 1px solid #fff; border-radius: 0; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { border-left: 1px solid #000 !important; border-right: 1px solid #000 !important; border-top: 1px solid #000 !important; } .customer li a span.icon { font-size: 20px; margin: 0 1em; } .tab-content { margin-top: 4em; } .userinfo { padding-bottom: 2em; } .user-wrapper.desktop { display: none; } .user-wrapper.mobile { display: none; } .user-wrapper ul.nav-tabs li { padding-left: 0; } .user-wrapper ul.nav-tabs span.icon, .order-table span.icon, .cart-table span.icon { font-size: 20px; margin: 0 1em; } label span.icon.fa-asterisk { font-size: 12px; color: #f90; position: relative; top: -5px; } .input-group-addon { font-size: 24px; } form i { cursor: pointer; top: -47px; right: -10%; } /*old right: -94px*/ #loginForm i { right: -94%; } @media screen and (min-width: 1024px) { .user-wrapper.desktop { display: block; } } @media screen and (max-width: 1023px) { .user-wrapper.mobile { display: block; } .nav.customer.mobile { list-style: none; margin: 0 0 2rem; padding: 0; text-align: center; } .nav.customer.mobile li { display: inline-block; padding: 0 1rem; } .nav.customer.mobile li a { padding: 0; } .nav.customer.mobile li span.icon { padding-right: 10px; } .user-wrapper.mobile .user { display: none; } .user-wrapper.mobile .active.user { display: block; } } @media screen and (max-width: 767px) { .wrapper.main.simplelogin-wrapper { padding-bottom: 0; } .breadcrumb.simplelogin { margin-bottom: 0; } .breadcrumb.simplelogin ol { margin-bottom: 0; } .wrapper.main.user-wrapper { padding: 0 2em; } .wrapper.cookie-gdpr { z-index: 10000; } .nav-tabs.nav-justified > li > a, .nav-tabs.nav-justified > li.active > a { border: 1px solid #000 !important; margin-bottom: 30px; text-align: left; } /* form i { top: -38px; right: -84%; }*/ .submit-wrapper { margin-top: -36px; } .user-wrapper.mobile .active.user .col-md-6 { padding-left: 0 !important; padding-right: 0 !important; } #loginForm i { right: -86%; } } /* VARUKORG */ @media screen and (max-width: 767px) { .wrapper.main.cart-wrapper { padding: 0 3em 3.5em; } .cart-is-not-empty { margin-left: -15px; margin-right: -15px; } } /* COOKIE OCH GDPR */ .wrapper.cookie-gdpr { display: none; position: fixed; left: 0; bottom: 0; padding: 1.5em 0 0 0; width: 100%; background-color: #fff; -webkit-box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.27); -moz-box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.27); box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.27); z-index: 100; font-size: 0.8em; } .wrapper.cookie-gdpr > .inner { width: 92em; } @media screen and (max-width: 767px) { .wrapper.cookie-gdpr { z-index: 10000; } } @media screen and (max-width: 1680px) { .wrapper.cookie-gdpr > .inner { width: 84em; } } .cookie-gdpr ul { list-style: none; margin: 0; padding: 0; text-align: center; } .cookie-gdpr ul li { display: inline-block; padding: 1em; } /* COOKIE BANNER */ .termsfeed-com---palette-light { font-family: "futura-pt",sans-serif !important; font-weight: 400 !important; } .termsfeed-com---palette-light .cc-nb-okagree, .termsfeed-com---palette-light .cc-nb-reject, .termsfeed-com---palette-light .cc-cp-foot-save, .termsfeed-com---palette-light .cc-nb-changep { letter-spacing: normal; text-transform: uppercase; } .termsfeed-com---reset button { padding: .5rem 2rem !important; } .termsfeed-com---palette-light .cc-nb-okagree { color: #fff !important; background-color: #597f3e !important; } .termsfeed-com---palette-light .cc-nb-reject { color: #fff !important; background-color: #f90 !important; font-weight: 600; } .termsfeed-com---palette-light .cc-cp-foot-save { background: #597f3e !important; color: #fff !important; } .termsfeed-com---palette-light .cc-nb-okagree:focus, .termsfeed-com---palette-light .cc-nb-reject:focus, .termsfeed-com---palette-light .cc-nb-changep:focus { box-shadow: none !important; } .termsfeed-com---palette-light .cc-pc-head-lang select:focus { box-shadow: 0 0 0 2px #fff !important; } .termsfeed-com---palette-light .cc-cp-foot-save:focus { box-shadow: 0 0 0 2px #597f3e !important; } .termsfeed-com---pc-dialog .cc-cp-body-tabs-item-link { letter-spacing: normal; white-space: normal; } .termsfeed-com---pc-dialog .cc-cp-body-content-entry-text { font-size: 14px !important; } @media screen and (max-width: 600px) { .termsfeed-com---nb .cc-nb-main-container { padding: 2rem !important; } .termsfeed-com---nb-simple { max-width: 100% !important; } .termsfeed-com---nb .cc-nb-title { font-size: 20px !important; } termsfeed-com---nb .cc-nb-text { font-size: 14px !important; } } @media (max-width: 320px), (max-height: 480px) { .termsfeed-com---nb-simple { height: auto !important; } } /* UNSUPPORTED BROWSER */ .unsupported-browser { position: relative; z-index: 99; } /* MASONRY INSP */ .wrapper.main.insp .inner { border-bottom: 1px solid #000; } .masonry { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 1em; -moz-column-gap: 1em; column-gap: 1em; margin: 1.5em; padding: 0; -moz-column-gap: 1.5em; -webkit-column-gap: 1.5em; column-gap: 1.5em; font-size: .85em; } .masonry .item { display: inline-block; background: #fff; padding: 0; margin: 0 0 1.5em; width: 100%; -webkit-transition: 1s ease all; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .masonry .item img { max-width: 100%; width: 100%; } .masonry .textinfo { text-align: center; padding: 0.5em 1em 1em; color: #000; } .masonry .textinfo ul { list-style: none; padding: 0; margin: 0; } .masonry .textinfo ul li { display: inline-block; padding-right: 1em; } .masonry .textinfo .icon { font-size: 24px; } .masonry .textinfo li { padding-right: 0; padding-left: 0; margin-right: 0.5em; } .masonry .textinfo .button { padding: 0 1em; } .masonry .textinfo .icon { padding-right: 0; } #favInsp .image-insp img { max-width: 100%; } #favInsp .title-insp { text-align: center; margin-bottom: 1em; } .modal-profile { padding-right: 0 !important; } .modal-profile .modal-dialog { width: 100%; height: 100%; margin: 0; padding: 0; } .modal-profile .modal-dialog .modal-content { width: 100%; height: auto; margin: 0; top: 0; left: 0; min-height: 100%; border: 0 none; border-radius: 0; box-shadow: none; text-align: center; } .modal-profile .modal-dialog .modal-content .modal-header { border-bottom: none; } .modal-profile .modal-dialog .modal-content .modal-footer { border-top: none; } .modal-profile .close { font-size: 80px; font-weight: 400; color: #000 !important; width: 80px; position: absolute; z-index: 100; right: 0; top: 0; } .modal-profile .modal-dialog .modal-content .modal-body img { margin: 0 auto; height: 80vh; } #addToFav .modal-footer { position: relative; padding: 30px 48px 50px; } @media only screen and (max-width: 320px) { .masonry { -moz-column-count: 1; -webkit-column-count: 1; column-count: 1; } .modal-profile .modal-dialog .modal-content .modal-body img { height: auto; } } @media only screen and (min-width: 321px) and (max-width: 768px) { .masonry { -moz-column-count: 1; -webkit-column-count: 1; column-count: 1; } .modal-profile .modal-dialog .modal-content .modal-body img { height: auto; } } @media only screen and (min-width: 769px) and (max-width: 1200px) { .masonry { -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; } } @media only screen and (min-width: 1201px) { .masonry { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; } } /* MACRO CTA BUTTON */ .cta-button-wrapper { margin-bottom: 1em; } /* DESIGNA DITT EGET KAKEL */ #form-createtile-outer ul.sizes li.size-item { display: inline-block; padding: 0.5em; width: 20%; } #form-createtile-outer ul.surface li.surface-item { display: inline-block; padding: 0.5em; width: 33%; } #form-createtile-outer .val-1, #form-createtile-outer .val-2 { padding-bottom: 2em; } .select-1 { width: 50%; } #form-createtile-outer .val-2-wrapper, #form-createtile-outer .val-3-wrapper, #form-createtile-outer .val-4-wrapper { display: none; } .val-color { list-style: none; margin: 0; padding: 0; } .val-color li { display: inline-block; } #your-tile { padding: 2em 0; margin: 2em 0 1em; border-top: 1px solid #000; } .create-your-own-tile-send { border: 1px solid #000; padding: 1.5em; } @media only screen and (max-width:810px) { .select-1 { width: 100%; } } .modal-content-error-message { display: flex; margin-top: 28em; width: 50%; margin-left: 20em; padding: 1%; border: 2px solid red; } /* MOOD BOARDS */ .moodboard-start { width: 100%; border-bottom: 1px solid #000; text-align: center; padding-bottom: 1.5em; } .moodboard-start a { border-bottom: none !important; } .moodboard-start span.icon { font-size: 20px; margin: 0 1em; } .mood-board-wrapper { margin: 0 auto; width: 800px; } .mood-board-header { display: flex; justify-content: space-between; background: #f0f0f0; width: 800px; border-top: 1px solid #585858; border-left: 1px solid #000; border-right: 1px solid #000; } .mood-board-header-title { display: flex; justify-content: center; align-items: center; font-size: 3em; width: 100%; } .mood-board-header-title input { padding: 1%; width: 100%; border: none; margin-left: 1.5em; } input:focus { outline: none !important; border-color: #f90; border: 1px solid #f90; } textarea:focus { outline: none !important; border-color: #f90; border: 4px solid #f90; } .mood-board-header button { width: 5px; display: flex; align-content: center; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; border: none; height: 8em; } .mood-board-header button:hover { background: #f90; } .mood-board-header svg { width: 25px; height: 25px; justify-content: center; align-items: center; color: #000; } .mood-board-header button:hover svg { fill: black; } .mood-board-header-buttons { display: flex; justify-content: flex-end; align-items: center; } .image-container { position: absolute; z-index: 9; background-color: #fff; text-align: center; /*min-height: 174px; min-width: 305px;*/ } .image-container.active { border: 1px solid #ccc; } .image-div { /*border: 1px solid #000 !important;*/ border: none !important; } .mood-board { background: #fff; width: 100%; height: 50em; position: relative; box-sizing: border-box; display: flex; border: 1px solid #000; z-index: 9; } /*Drgable */ #theImage { min-height: 174px; min-width: 305px; width: 100%; height: 100%; padding: 10px; cursor: move; z-index: 10; } .options-container { background-color: transparent !important; /*border-left: 1px solid #000; border-right: 1px solid #000; border-bottom: 1px solid #000;*/ border: none !important; padding: 0.5em 0; height: auto !important; position: absolute; top: 0; } .options-buttons { display: flex; justify-content: space-evenly; align-items: center; } .options-buttons button { width: 40px !important; height: 40px; display: flex; align-content: center; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; background-color: #fff; border: 1px solid #000 !important; padding: 0 1em; } .options-buttons button:hover { background: #f0f0f0; border: 1px solid #f90 !important } svg { width: 18px; height: 18px; justify-content: center; align-items: center; color: #000; } .options-buttons button:hover svg { fill: #f90; } /*Resizeable*/ .image-container .resizer-right { width: 5px; height: 100%; background: transparent; position: absolute; right: 0; bottom: 0; cursor: e-resize; } .image-container .resizer-bottom { width: 100%; height: 5px; background: transparent; position: absolute; right: 0; bottom: 0; cursor: n-resize; } .image-container .resizer-both { width: 5px; height: 5px; background: transparent; z-index: 10; position: absolute; right: 0; bottom: 0; cursor: nw-resize; } .html-content { width: 800px; } /* SHOW PASSWORD */ .field-icon { float: right; margin-left: -25px; margin-top: -25px; position: relative; z-index: 2; } /*SMALL MOODBOARD COUNTER*/ .newly-added-plates { cursor: auto; position: absolute; left: 2.5em; bottom: 1.5em; width: 1.5em; height: 1.5em; background-color: transparent; border-radius: 50%; visibility: visible; text-indent: 0; margin: 0; padding: 0; display: none; } .newly-added-plates .newly-added-plates-number { display: flex; justify-content: center; align-items: center; color: #000; flex-direction: row; align-content: center; margin: 0; padding: 0; height: 1.5em; width: 1.5em; } @media (min-resolution: 120dpi) { html, body { /*font-size: 90%;*/ } .header-wrapper .header-text { width: 60%; } .header-wrapper.bg-header .header-text { font-size: 90%; text-align: left; } #mainslider { overflow: hidden; } .popular .items { height: 400px; } .popular .items .infoboxes { height: 300px; } }